Architecture Overview

The YCW Adelaide website and CMS is built as a serverless application using Cloudflare Workers and Pages.

High-Level Architecture

Client → Cloudflare Pages → Cloudflare Workers → D1 Database
                              ↓
                         R2 Storage
                         Durable Objects

Request Flow

1. User visits website → Cloudflare Pages serves Vue SPA
2. Vue Router handles routing
3. Component makes API call → Cloudflare Worker
4. Worker queries D1 database
5. JSON response returned
6. Vue component renders data

Architecture Patterns

• API-First Design - All functionality via RESTful API
• Serverless Architecture - Cloudflare Workers and Pages
• Component-Based Frontend - Vue 3 with Composition API
• Type Safety - TypeScript throughout

Quick Links

• Frontend Architecture - Vue components and structure
• Backend Architecture - Workers and API
• Database Architecture - D1 and Prisma
• Security Architecture - Authentication and authorization

Next Steps

• Frontend Architecture - Learn about Vue structure
• Backend Architecture - Understand Workers