Web shop on one cloud region, with symbols
The web shop on one cloud region with a generic symbol above the label of nine components — a browser, a content network, a container, a cache, a message broker, a function, object storage, identity and a cloud. The kind keeps its shape; each symbol is a plain stroke drawing, defined once per SVG, and the description and the table name it after the kind. Illustrative values.
Web shop on one cloud region, with symbols
examples/shop-symbols.json{
"schemaVersion": 1,
"type": "architecture",
"title": "Web shop on one cloud region, with symbols",
"source": "Architecture handbook, overview",
"width": 1840,
"height": 600,
"architecture": {
"boundaries": [
{
"id": "region",
"label": "Cloud region eu-central-1"
},
{
"id": "network",
"label": "Private network",
"in": "region"
},
{
"id": "data",
"label": "Data zone",
"in": "network"
}
],
"components": [
{
"id": "customer",
"label": "Customer",
"kind": "person"
},
{
"id": "web",
"label": "Web shop",
"kind": "frontend",
"symbol": "browser"
},
{
"id": "cdn",
"label": "Content network",
"kind": "external",
"symbol": "cdn"
},
{
"id": "api",
"label": "Shop API",
"sublabel": "Node.js",
"in": "network",
"symbol": "container"
},
{
"id": "cache",
"label": "Session cache",
"sublabel": "Redis",
"kind": "cache",
"in": "network",
"symbol": "cache"
},
{
"id": "events",
"label": "Order events",
"kind": "queue",
"in": "network",
"symbol": "message-broker"
},
{
"id": "worker",
"label": "Order worker",
"in": "network",
"symbol": "function"
},
{
"id": "db",
"label": "Orders",
"sublabel": "Postgres",
"kind": "database",
"in": "data"
},
{
"id": "files",
"label": "Invoices",
"kind": "storage",
"in": "region",
"symbol": "object-storage"
},
{
"id": "pay",
"label": "Payment provider",
"kind": "external",
"symbol": "cloud"
},
{
"id": "auth",
"label": "Sign-in",
"kind": "security",
"in": "network",
"symbol": "identity"
}
],
"connections": [
{
"from": "customer",
"to": "web",
"label": "browses"
},
{
"from": "web",
"to": "cdn",
"label": "loads assets",
"technology": "HTTPS",
"dash": "dashed"
},
{
"from": "web",
"to": "api",
"label": "calls",
"technology": "HTTPS/JSON"
},
{
"from": "api",
"to": "cache",
"label": "sessions",
"technology": "RESP"
},
{
"from": "api",
"to": "auth",
"label": "checks token",
"technology": "OIDC"
},
{
"from": "api",
"to": "db",
"label": "reads, writes",
"technology": "SQL/TLS"
},
{
"from": "api",
"to": "events",
"label": "publishes",
"technology": "AMQP"
},
{
"from": "events",
"to": "worker",
"label": "delivers"
},
{
"from": "worker",
"to": "pay",
"label": "charges",
"technology": "HTTPS"
},
{
"from": "worker",
"to": "files",
"label": "stores PDF",
"technology": "S3 API"
},
{
"from": "worker",
"to": "db",
"label": "updates",
"technology": "SQL/TLS"
}
],
"mainPath": [
"customer",
"web",
"api",
"events",
"worker",
"pay"
]
}
}Focus
Source: Architecture handbook, overview
Show chart data
| Component | Kind | Boundary | Connects to |
|---|---|---|---|
| Customer | person | Web shop (browses) | |
| Web shop | frontend, web browser | Content network (loads assets, via HTTPS), Shop API (calls, via HTTPS/JSON) | |
| Shop API | service, container | Cloud region eu-central-1 › Private network | Session cache (sessions, via RESP), Sign-in (checks token, via OIDC), Orders (reads, writes, via SQL/TLS), Order events (publishes, via AMQP) |
| Content network | external system, content delivery network | ||
| Session cache | in-memory cache | Cloud region eu-central-1 › Private network | |
| Order events | queue, message broker | Cloud region eu-central-1 › Private network | Order worker (delivers) |
| Sign-in | security, identity provider | Cloud region eu-central-1 › Private network | |
| Order worker | service, serverless function | Cloud region eu-central-1 › Private network | Payment provider (charges, via HTTPS), Invoices (stores PDF, via S3 API), Orders (updates, via SQL/TLS) |
| Orders | database | Cloud region eu-central-1 › Private network › Data zone | |
| Invoices | object storage | Cloud region eu-central-1 | |
| Payment provider | external system, cloud service |