Development Guide

Technical implementation guides for working with the Jubiloop codebase.

Overview

This section contains technical guides for developers working on different parts of the Jubiloop monorepo. While the Product section describes what we build and the Infrastructure section describes how we deploy it, this Development section describes how we build it.

Structure

Backend Development

AdonisJS server implementation patterns:

• Server setup and configuration
• Controllers and routing patterns
• Database operations with Lucid ORM
• CLI commands and tooling

Frontend Development

Client application development:

• Web App - React SPA with TanStack Router
• Marketing Site - Next.js with static generation
• Component patterns and state management
• Styling with Tailwind CSS

Shared Packages

Reusable code across applications:

• UI component library
• TypeScript configurations
• ESLint and testing configs
• Shared utilities

Quick Links

Backend

• Setup Guide - Configure the AdonisJS server
• Controllers - Request handling patterns
• Database - Migrations and queries
• CLI Commands - Ace command reference

Frontend

• Web App Overview - React SPA architecture
• Routing - TanStack Router setup
• State Management - Zustand patterns
• Marketing Site - Next.js setup
• Blog System - Sanity CMS integration

Packages

• UI Components - Shared component library
• Shared Packages - Configuration packages

Development Workflow

1. Choose your area: Backend, Frontend, or Packages
2. Follow the guides: Each section has specific patterns and conventions
3. Use shared code: Leverage packages for consistency
4. Test locally: Use the local development setup

Key Principles

Code Organization

• Separation of concerns: Business logic in backend, UI logic in frontend
• Reusability: Common code in packages
• Type safety: TypeScript throughout the stack
• Consistency: Shared linting and formatting rules

Development Patterns

• API-first: Backend defines contracts, frontend consumes
• Component-driven: Build UIs from composable parts
• Database migrations: Version control for schema changes
• Environment parity: Local setup mirrors production

Technology Stack

Backend

• Runtime: Node.js 20+
• Framework: AdonisJS 6
• Database: PostgreSQL with Lucid ORM
• Sessions: Redis
• Authentication: Better Auth

Frontend

• Web App: React 19, TanStack Router, Zustand
• Marketing: Next.js 15, Static Generation, Sanity CMS
• Styling: Tailwind CSS v4
• Build Tool: Vite

Shared

• Language: TypeScript 5.3+
• Package Manager: npm workspaces
• Monorepo: Turborepo
• Linting: ESLint
• Formatting: Prettier

Getting Help

• Check the specific guide for your area (backend/frontend/packages)
• Review team guidelines
• See troubleshooting guide
• Consult the API reference for endpoint details