2.1 KiB
2.1 KiB
High-Level Architecture Diagram: Company Inc.
Use this as reference when creating your diagram in draw.io or Lucidchart.
Mermaid Source (for Git-rendered diagrams)
flowchart TB
subgraph Internet["Internet"]
Users[Users]
end
subgraph GCP["GCP"]
subgraph Projects["Projects"]
Prod[company-inc-prod]
Staging[company-inc-staging]
Shared[company-inc-shared]
end
subgraph Networking["Network"]
LB[Cloud Load Balancer<br/>HTTPS]
CDN[Cloud CDN<br/>Static Assets]
VPC[VPC - Private Subnets]
end
subgraph GKE["GKE Cluster (Private)"]
Ingress[Ingress Controller]
subgraph Workloads["Workloads"]
API[Backend - Python/Flask<br/>HPA 2-3 replicas]
SPA[Frontend - React SPA<br/>Nginx]
end
Redis[Redis - Memorystore]
end
subgraph Data["Data & Services"]
Mongo[(MongoDB Atlas<br/>Replica Set)]
Secrets[Secret Manager]
Registry[Artifact Registry]
end
end
Users --> LB
Users --> CDN
LB --> Ingress
Ingress --> API
Ingress --> SPA
CDN --> SPA
API --> Mongo
API --> Redis
API --> Secrets
GKE --> Registry
Draw.io / Lucidchart Layout Guide
Top Row (External)
- Users → Internet
Second Row (Edge)
- Cloud Load Balancer (HTTPS)
- Cloud CDN (for SPA static assets)
Third Row (GKE)
- GKE Cluster (Private)
- Ingress Controller
- Backend (Flask) — 2–3 replicas, HPA
- Frontend (React SPA)
- Redis (Memorystore)
Fourth Row (Data)
- MongoDB Atlas (Replica Set, private endpoint)
- Secret Manager
- Artifact Registry
Connections
- Users → LB, Users → CDN
- LB → Ingress → Backend + Frontend
- Backend → MongoDB, Redis, Secret Manager
- GKE → Artifact Registry (image pulls)
Colors (suggested)
- External: Light blue
- GCP managed: Light green
- Workloads: Light yellow
- Data: Light orange