CloudBlocks is a visual cloud learning tool for beginners: start from guided templates, learn common architecture patterns, and export Terraform starter code.
Start from built-in architecture templates, learn cloud infrastructure patterns with guided scenarios, and export Terraform starter code — all in the browser. No cloud account or backend required.
▶ Try the Live Demo — Frontend-only playground. Visual builder, templates, learning scenarios, and Terraform starter export work instantly. AI and GitHub features require the backend (setup guide).
Start from a guided template, learn cloud architecture patterns step by step, customize with drag-and-drop blocks, and export Terraform starter code — all in the browser.
Automated demo video coming soon. For now, try the live demo.
Most diagram tools produce static images. CloudBlocks produces a live architecture model with built-in learning and validation — designed for people just getting started with cloud infrastructure.
| Diagram Tool | CloudBlocks | |
|---|---|---|
| Output | Static image | Interactive architecture model |
| Validation | None | Real-time rule engine |
| Semantics | Visual only | Every block maps to a real cloud resource |
| Learning | None | Guided scenarios for beginners |
| Code Export | None | Terraform starter code |
- 📋 Guided templates — Start from 6 built-in architecture patterns with step-by-step learning scenarios
- 📚 Learning mode — Interactive guided scenarios to learn cloud architecture patterns (beginner → advanced)
- 🧱 Block-based modeling — Container blocks (boundaries) + Resource blocks (resources) + typed Connections
- ✅ Validation engine — Real-time rule checking for placement and connections
- 📦 8 resource categories — Network, Delivery, Compute, Data, Messaging, Security, Identity, Operations
- ⚡ Terraform starter export — Export your design to Terraform starter code for learning and prototyping
- 🌐 Multi-cloud preview — Visual preview for Azure, AWS, and GCP
- 🎨 Dual theme system — Workshop (light, enterprise) and Blueprint (dark, creative)
- ⚗️ Bicep & Pulumi (Experimental) — Additional IaC export formats
- 🔗 GitHub integration (Backend required) — OAuth login, repo sync, PR creation
git clone https://github.com/yeongseon/cloudblocks.git
cd cloudblocks
pnpm install
pnpm devOpen http://localhost:5173 to start learning.
The frontend works standalone — no backend needed. Start
apps/apifor GitHub integration and AI features.
| Path | Package | Role |
|---|---|---|
apps/web |
@cloudblocks/web |
Frontend SPA — visual builder, validation engine, template system, code generation pipeline |
apps/api |
— | FastAPI backend — GitHub OAuth, workspace sync, AI integration |
packages/schema |
@cloudblocks/schema |
Canonical architecture model types, enums, and JSON Schema |
packages/cloudblocks-domain |
@cloudblocks/domain |
Shared domain helpers — hierarchy rules, labels, validation types |
Full documentation is available in the docs/ directory:
# Frontend development
pnpm dev
# Build
pnpm build
# Type check
pnpm typecheck
# Backend
cd apps/api && pip install -e ".[dev]" && uvicorn app.main:app --reload| Stage | Name | Focus | Status |
|---|---|---|---|
| V1 | Learn | Visual cloud learning tool for beginners | Current |
| V2 | Export | Trustworthy Terraform starter code with hypothesis validation | Next |
| V3 | Practice | Learning paths with progress tracking and guided scenarios | Later |
| V4 | Teach | Educator distribution, curriculum packaging, community sharing | Future |
See ROADMAP.md for details and CHANGELOG.md for release history.
- Three-Tier Web App — Classic three-tier architecture
- Serverless API — Serverless function architecture
- Event-Driven Pipeline — Event processing pattern
See CONTRIBUTING.md for development setup, coding standards, and the PR process.
- GitHub Issues — Bug reports and feature requests
- GitHub Discussions — Questions and ideas