Architecture Overview

Architektur der MORELO Dealer Suite.

High-Level Architektur

┌─────────────────────────────────────────────────────────────┐
│                      CLIENTS                                 │
│  ┌─────────┐  ┌─────────┐  ┌─────────┐  ┌─────────┐        │
│  │ Browser │  │ Mobile  │  │ E-Paper │  │   API   │        │
│  │  (PWA)  │  │  (PWA)  │  │ (ESP32) │  │ Clients │        │
│  └────┬────┘  └────┬────┘  └────┬────┘  └────┬────┘        │
└───────┼────────────┼────────────┼────────────┼──────────────┘
        │            │            │            │
        └────────────┴──────┬─────┴────────────┘
                            │
                            ▼
┌─────────────────────────────────────────────────────────────┐
│                   CLOUDFLARE EDGE                            │
│  ┌─────────────────────────────────────────────────────┐    │
│  │                  Cloudflare Workers                  │    │
│  │                   (Hono Framework)                   │    │
│  └────────────────────────┬────────────────────────────┘    │
│                           │                                  │
│  ┌───────────┐  ┌────────┴────────┐  ┌───────────────┐     │
│  │    D1     │  │       KV        │  │ Durable Obj.  │     │
│  │ (SQLite)  │  │    (Cache)      │  │  (Sessions)   │     │
│  └───────────┘  └─────────────────┘  └───────────────┘     │
└─────────────────────────────────────────────────────────────┘
                            │
                            ▼
┌─────────────────────────────────────────────────────────────┐
│                 EXTERNAL INTEGRATIONS                        │
│  ┌─────────┐  ┌─────────┐  ┌─────────┐  ┌─────────┐        │
│  │  MS365  │  │Salesforce│  │ sevDesk │  │ MORELO  │        │
│  │  Graph  │  │   API    │  │   API   │  │   API   │        │
│  └─────────┘  └─────────┘  └─────────┘  └─────────┘        │
└─────────────────────────────────────────────────────────────┘

Komponenten

Frontend (SvelteKit)

• PWA - Progressive Web App, offline-fähig
• Tailwind CSS - Utility-first Styling
• TypeScript - Type Safety

Backend (Hono + Cloudflare)

• Hono - Lightweight Web Framework
• Cloudflare Workers - Edge Computing
• D1 - SQLite Database (replicated)
• KV - Key-Value Cache
• R2 - Object Storage (Bilder, PDFs)

Hardware (ESP32)

• PlatformIO - Build System
• GxEPD2 - E-Paper Driver
• ArduinoJSON - API Parsing

Datenfluss

sequenceDiagram
    participant U as User
    participant F as Frontend
    participant B as Backend
    participant E as External

    U->>F: Login
    F->>B: POST /auth/login
    B->>E: MS365 OAuth
    E-->>B: Token
    B-->>F: JWT
    F-->>U: Dashboard