Frontend Section

This section is for frontend developers working on the Flet application.

Contents

• Architecture - Clean Architecture, folder structure
• Design System - Colors, typography, spacing
• Components - Reusable UI components
• Flet Best Practices - Flet-specific guidelines
• i18n - Internationalization workflow
• Global AppBar System
• Session Persistence

Quick Start

# Install dependencies
uv sync

# Run development
uv run flet -r

# Run tests
uv run pytest test/ -v

Tech Stack

• Framework: Flet (Python) - cross-platform (web, mobile, desktop)
• Communication: httpx for async API calls
• Images: SVG exclusively
• Architecture: Clean Architecture + Clean Code

Clean Architecture Rules

Layer	Can Import	Cannot Import
domain/	core.error	flet, httpx, modules
data/	domain, core.network, core.error	flet, shared
presentation/	domain, core.theme, flet	data, shared
shared/	core.theme, flet	modules
core/	Only stdlib	Everything else

Key Rules

1. SafeArea is OBLIGATORY - Every page must wrap content in ft.SafeArea
2. Check Flet docs before using controls - Avoid deprecated APIs
3. All texts must use i18n - Never hardcode visible strings
4. Clean Architecture separation - Follow layer rules strictly

Documentation Links

• Flet Controls
• Flet Async
• Theme Reference