Full‑Stack Movie Catalog (Shelf + Ormed)
Welcome to the Full-Stack Movie Catalog tutorial! In this guide, we'll build a complete web application from scratch using Ormed for database persistence and Shelf for the web server.
This isn't just a "Hello World" example. We'll build a meaningful application that includes:
- Database Modeling: Defining structured data with relations.
- Migrations & Seeding: Managing schema changes and initial data.
- Web Routing: Handling both HTML pages and JSON API endpoints.
- Template Rendering: Using Liquify for dynamic HTML.
- File Storage: Handling image uploads for movie posters.
- Structured Logging: Using Contextual for observable applications.
- Testing: Ensuring reliability with unit and integration tests.
note
This guide is built from a runnable example project in packages/ormed/example/fullstack with region markers. Code blocks are embedded directly from the source to keep docs and code in sync.
What You’ll Build
By the end of this tutorial, you'll have a movie catalog app with:
- Server-rendered pages: Catalog, detail, edit, delete, and genre listings.
- REST APIs: JSON endpoints for CRUD operations.
- SQLite persistence: Using Ormed models and migrations.
- Layout inheritance: Clean templates with shared layouts.
- Asset uploads: Storing movie posters on disk.
- Observability: Structured logging for easier debugging.
Guide Map
- Setup & Scaffolding - Initialize the project and dependencies.
- Models & Codegen - Define your data structure.
- Migrations & Seed Data - Prepare your database.
- Server & Web Routes - Build the web application.
- JSON API - Expose your data via REST.
- Templates & Storage - UI and file handling.
- Testing Strategy - Verify your work.
- CLI & Runbook - Manage the app.
Project Layout
Understanding the project structure is key to navigating this tutorial:
example/fullstack/
├── bin/ # Entry points (server + CLI)
├── lib/src/ # App code (models, server, templates, storage)
├── templates/ # Liquify templates
├── uploads/ # Local storage for assets
└── test/ # HTTP + property tests