# mateuszdabrowski/sqlstudio architecture

> Architecture diagram of the GitHub repository mateuszdabrowski/sqlstudio, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-30). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/mateuszdabrowski/sqlstudio
- Repository: https://github.com/mateuszdabrowski/sqlstudio

## Overview

SQL Studio is a Marketing Cloud Engagement Cloud Page app for authoring and running SQL within the user's own account. The documented workflow runs from the editor through query execution to paged or exported results; other capabilities include SQL assistance, saved Query Activities, and query history. The README identifies the Cloud Page and two Code Resources but does not expose source excerpts, so internal call ownership and several integration details remain unverified; dashed edges mark those links.

Main entry points: [`src/code-resources/sql-studio-frontend.js`](https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/code-resources/sql-studio-frontend.js) (Frontend app), [`src/cloud-page/sql-studio.html`](https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/cloud-page/sql-studio.html) (Studio page), [`src/code-resources/sql-studio-backend.html`](https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/code-resources/sql-studio-backend.html) (Query execution)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_authoring["SQL authoring"]
  node_cloudpage["Studio page<br/>[sql-studio.html]"]
  node_frontend["Frontend app"]
  node_editor["SQL editor"]
  node_assistance["SQL assistance"]
end

subgraph group_runtime["Query runtime"]
  node_querytabs["Query tabs"]
  node_backend["Backend resource"]
  node_execution["Query execution"]
  node_results["Results and export"]
  node_savedqueries["Saved queries"]
  node_history["Query history"]
end

subgraph group_mce["MCE resources"]
  node_mce["Marketing Cloud"]
  node_queryactivity["Query Activities"]
  node_tempde[("Temporary Data Extension")]
  node_metadata[("DE and system views")]
end

node_user(("MCE user"))
node_monaco["Monaco CDN"]

node_user -->|"opens"| node_cloudpage
node_cloudpage -.->|"loads"| node_frontend
node_cloudpage -->|"loads editor"| node_monaco
node_frontend -.->|"provides"| node_editor
node_editor -.->|"uses"| node_assistance
node_assistance -->|"autocompletes"| node_metadata
node_frontend -.->|"provides"| node_querytabs
node_querytabs -.->|"runs queries"| node_backend
node_backend -.->|"handles runs"| node_execution
node_execution -->|"uses pool"| node_queryactivity
node_execution -->|"writes results"| node_tempde
node_tempde -->|"pages and exports"| node_results
node_frontend -.->|"saves and opens"| node_savedqueries
node_frontend -.->|"shows history"| node_history
node_queryactivity -->|"runs in"| node_mce
node_tempde -->|"stored in"| node_mce

click node_cloudpage "https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/cloud-page/sql-studio.html"
click node_frontend "https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/code-resources/sql-studio-frontend.js"
click node_editor "https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/code-resources/sql-studio-frontend.js"
click node_assistance "https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/code-resources/sql-studio-frontend.js"
click node_querytabs "https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/code-resources/sql-studio-frontend.js"
click node_backend "https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/code-resources/sql-studio-backend.html"
click node_execution "https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/code-resources/sql-studio-backend.html"
click node_results "https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/code-resources/sql-studio-frontend.js"
click node_savedqueries "https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/code-resources/sql-studio-backend.html"
click node_history "https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/code-resources/sql-studio-backend.html"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_cloudpage,node_frontend,node_editor,node_assistance,node_user toneBlue
class node_querytabs,node_backend,node_execution,node_results,node_savedqueries,node_history toneAmber
class node_mce,node_queryactivity,node_tempde,node_metadata toneMint
class node_monaco toneIndigo
```

## Components

### SQL authoring

- [Studio page](https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/cloud-page/sql-studio.html): `src/cloud-page/sql-studio.html`
- [Frontend app](https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/code-resources/sql-studio-frontend.js): `src/code-resources/sql-studio-frontend.js`
- [SQL editor](https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/code-resources/sql-studio-frontend.js): `src/code-resources/sql-studio-frontend.js`
- [SQL assistance](https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/code-resources/sql-studio-frontend.js): `src/code-resources/sql-studio-frontend.js`

### Query runtime

- [Query tabs](https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/code-resources/sql-studio-frontend.js): `src/code-resources/sql-studio-frontend.js`
- [Backend resource](https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/code-resources/sql-studio-backend.html): `src/code-resources/sql-studio-backend.html`
- [Query execution](https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/code-resources/sql-studio-backend.html): `src/code-resources/sql-studio-backend.html`
- [Results and export](https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/code-resources/sql-studio-frontend.js): `src/code-resources/sql-studio-frontend.js`
- [Saved queries](https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/code-resources/sql-studio-backend.html): `src/code-resources/sql-studio-backend.html`
- [Query history](https://github.com/mateuszdabrowski/sqlstudio/blob/main/src/code-resources/sql-studio-backend.html): `src/code-resources/sql-studio-backend.html`

### MCE resources

- **Marketing Cloud**
- **Query Activities**
- **Temporary Data Extension**
- **DE and system views**

### Other components

- **MCE user**
- **Monaco CDN**

## Connections

- MCE user → Studio page: opens (evidence: `README.md`)
- Studio page → Frontend app: loads
- Studio page → Monaco CDN: loads editor (evidence: `README.md`)
- Frontend app → SQL editor: provides
- SQL editor → SQL assistance: uses
- SQL assistance → DE and system views: autocompletes (evidence: `README.md`)
- Frontend app → Query tabs: provides
- Query tabs → Backend resource: runs queries
- Backend resource → Query execution: handles runs
- Query execution → Query Activities: uses pool (evidence: `README.md`)
- Query execution → Temporary Data Extension: writes results (evidence: `README.md`)
- Temporary Data Extension → Results and export: pages and exports (evidence: `README.md`)
- Frontend app → Saved queries: saves and opens
- Frontend app → Query history: shows history
- Query Activities → Marketing Cloud: runs in (evidence: `README.md`)
- Temporary Data Extension → Marketing Cloud: stored in (evidence: `README.md`)