Project structures

How a real project is laid out in your stack, from the first scaffold to production. Open one to explore every folder and file: what it is, why it exists, when you add it and the mistakes people make with it.

51 stacks
7 categories

Day 1 and Growing are free to read; Production and Expert open in your dashboard with credits.

Frontend

Project structure · Frontend
React with Vite (TypeScript)
For developers building a single-page React app that talks to a separate backend: an orders dashboard with auth, routing, server data, forms and tests. Product code is grouped by feature under src/features, shared pieces live in components and lib, and src/app wires providers, routes and guards together.
Stages
1. 1Day 1 · 24 files and folders
2. 2Growing · +113 files and folders
3. Production · +37 files and folders
+ 1 more
- Beginner
- 219 files and folders
Opens with credits
Project structure · Frontend
Next.js (App Router)
For React developers building a real web front end with Next.js: a shop dashboard with public pages, sign-in, orders and products, talking to a separate backend API. The app folder holds routes only, product code lives in feature folders, server-only code sits in src/server, and the browser side gets a proper React setup: providers, TanStack Query, forms with React Hook Form and Zod, and tests from unit to end-to-end.
Stages
1. 1Day 1 · 26 files and folders
2. 2Growing · +129 files and folders
3. Production · +36 files and folders
+ 1 more
- Intermediate
- 236 files and folders
Opens with credits
Project structure · Frontend
Angular
For developers building a structured single-page app with Angular, the framework many enterprise and services companies use. The example is an orders dashboard with a login: standalone components, signals for state, typed forms, lazy-loaded feature routes, and a small core and shared layer around feature folders, grown from the ng new scaffold to a repository a team can run for years.
Stages
1. 1Day 1 · 33 files and folders
2. 2Growing · +94 files and folders
3. Production · +34 files and folders
+ 1 more
- Intermediate
- 209 files and folders
Opens with credits
Project structure · Frontend
Vue 3 with Vite
For developers building a Vue single-page app with TypeScript, Vue Router and Pinia, the stack create-vue sets up. The example is an orders dashboard with sign-in: the scaffold folders stay for app-wide pieces (plugins, layouts, base components, router), and each product area lives in a feature folder with its own views, components, store, API calls and tests.
Stages
1. 1Day 1 · 46 files and folders
2. 2Growing · +89 files and folders
3. Production · +31 files and folders
+ 1 more
- Beginner
- 210 files and folders
Opens with credits
Project structure · Frontend
Nuxt
For developers who know some Vue and want a full app with server rendering, file-based routing and API routes in one project. The example is a campus events app with sign-in and seat booking: Vue code lives in app/, the API and database in server/, code both sides need in shared/, and a large area like the admin dashboard can later move into its own layer.
Stages
1. 1Day 1 · 22 files and folders
2. 2Growing · +83 files and folders
3. Production · +30 files and folders
+ 1 more
- Intermediate
- 172 files and folders
Opens with credits
Project structure · Frontend
SvelteKit
For developers building a full Svelte app with server rendering, form actions and a database, using SvelteKit 3 and Svelte 5 runes as `npx sv create` sets them up. The example is a study planner where students track courses and assignment deadlines: routes stay thin and URL-shaped, while each product area lives in a feature folder under src/lib with its own components, validation, server queries and tests.
Stages
1. 1Day 1 · 34 files and folders
2. 2Growing · +96 files and folders
3. Production · +28 files and folders
+ 1 more
- Intermediate
- 181 files and folders
Opens with credits
Project structure · Frontend
Astro
For developers building content-heavy websites (blogs, docs, society or portfolio sites) that should load fast with little JavaScript. The example is a university tech society site from the blog template: content collections for posts, events and the team, a couple of React islands, an Action-backed join form, and a few on-demand pages through the Node adapter while everything else stays static.
Stages
1. 1Day 1 · 47 files and folders
2. 2Growing · +62 files and folders
3. Production · +29 files and folders
+ 1 more
- Beginner
- 164 files and folders
Opens with credits
Project structure · Frontend
React Router (framework mode, formerly Remix)
A server-rendered React app built with React Router in framework mode, the direct successor to Remix. Every URL maps to a route module that loads its own data in a `loader`, handles its own forms in an `action` and renders with the result; `app/routes.ts` wires the URLs together. The example is a task tracker for small teams, with sessions, PostgreSQL through Drizzle, middleware for auth and a Docker deploy.
Stages
1. 1Day 1 · 30 files and folders
2. 2Growing · +58 files and folders
3. Production · +25 files and folders
+ 1 more
- Intermediate
- 131 files and folders
Opens with credits

Backend

Project structure · Backend
Express with TypeScript
For students who know a bit of JavaScript and want a backend that looks like the ones teams actually run. Express gives you almost no structure, so this layout supplies it: one folder per feature under src/modules, each split into routes, controller, service and repository, with Zod at the edge and Vitest plus Supertest for tests.
Stages
1. 1Day 1 · 11 files and folders
2. 2Growing · +90 files and folders
3. Production · +31 files and folders
+ 1 more
- Intermediate
- 187 files and folders
Opens with credits
Project structure · Backend
NestJS
For people who want a structured TypeScript backend with clear rules about where code goes. Every feature is a Nest module that owns its controller, service, DTOs, entities and tests, so the app grows by adding folders, not by stretching old ones. The tree follows one orders API from nest new to a codebase a whole team can run for years.
Stages
1. 1Day 1 · 23 files and folders
2. 2Growing · +83 files and folders
3. Production · +35 files and folders
+ 1 more
- Intermediate
- 187 files and folders
Opens with credits
Project structure · Backend
FastAPI
A typed Python API for an orders app, built the way the FastAPI docs and the official full stack template lay it out: one `app` package, a router per feature, Pydantic schemas at the edges, services in the middle and SQLAlchemy models with Alembic migrations underneath. For students who have finished the FastAPI tutorial and want to know where the second, tenth and fiftieth file go.
Stages
1. 1Day 1 · 12 files and folders
2. 2Growing · +91 files and folders
3. Production · +42 files and folders
+ 1 more
- Intermediate
- 188 files and folders
Opens with credits
Project structure · Backend
Django
For students building their first serious Python web app or API with Django, and for the team that keeps it running years later. The project is a thin "config" package plus one Django app per business area (accounts, catalog, orders, core), each owning its models, services, views, API, migrations and tests. Settings come from validated environment variables, and the tree grows from the tutorial layout to CI, containers, observability and enforced module boundaries.
Stages
1. 1Day 1 · 37 files and folders
2. 2Growing · +81 files and folders
3. Production · +42 files and folders
+ 1 more
- Beginner
- 193 files and folders
Opens with credits
Project structure · Backend
Spring Boot
A REST API in Java with Spring Boot 4, PostgreSQL, Flyway and Testcontainers, organised by feature the way the Spring docs suggest. It grows from the Initializr scaffold to a service with JWT security, problem-detail errors, MapStruct DTOs, slice and integration tests, CI, containers and observability, and finally Modulith boundaries, contract and load tests. For students who know some Java and want to see how a real service is organised.
Stages
1. 1Day 1 · 40 files and folders
2. 2Growing · +64 files and folders
3. Production · +36 files and folders
+ 1 more
- Intermediate
- 183 files and folders
Opens with credits
Project structure · Backend
ASP.NET Core Web API
A REST API in C# on .NET 10 with minimal API endpoints grouped by feature, EF Core and PostgreSQL, JWT auth with policies, xUnit and Testcontainers tests, and everything production needs: health checks, OpenTelemetry, rate limits, versioning, caching and a CI pipeline. It shows the popular clean architecture split (Api, Application, Domain, Infrastructure) honestly, and at Expert grows into Aspire, a modular monolith and enforced boundaries.
Stages
1. 1Day 1 · 16 files and folders
2. 2Growing · +94 files and folders
3. Production · +44 files and folders
+ 1 more
- Intermediate
- 218 files and folders
Opens with credits
Project structure · Backend
Go REST API
A JSON API in Go using the standard library router, PostgreSQL through pgx and sqlc, SQL migrations with goose, and tests next to the code. It follows the layout the Go team itself documents: commands in cmd/, everything else in internal/, one package per feature plus a small platform package for the plumbing, and nothing added until it is needed.
Stages
1. 1Day 1 · 13 files and folders
2. 2Growing · +73 files and folders
3. Production · +43 files and folders
+ 1 more
- Intermediate
- 176 files and folders
Opens with credits
Project structure · Backend
Laravel
A Laravel 13 web app for booking clinic appointments, laid out the way `laravel new` creates it and the Laravel docs describe it: models, controllers and providers in `app`, migrations and factories in `database`, Blade and Vite assets in `resources`, Pest tests in `tests`. For students who have built a first CRUD app and want to know where actions, jobs, policies, API resources and deploy files go as it grows.
Stages
1. 1Day 1 · 82 files and folders
2. 2Growing · +68 files and folders
3. Production · +22 files and folders
+ 1 more
- Intermediate
- 190 files and folders
Opens with credits
Project structure · Backend
Ruby on Rails
A Rails 8.1 app for a tuition centre (courses, enrollments, payments), laid out exactly as `rails new` creates it: Hotwire and import maps for the frontend, Solid Queue, Cache and Cable on the database, and Kamal deploying a Docker image to your own server. For students who have done the Getting Started guide and want to know where authentication, jobs, admin pages, tests and deploy files go as the app grows.
Stages
1. 1Day 1 · 124 files and folders
2. 2Growing · +51 files and folders
3. Production · +19 files and folders
+ 1 more
- Intermediate
- 206 files and folders
Opens with credits
Project structure · Backend
Rust with Axum
A REST API for an orders app in Rust, built on Axum, Tokio and SQLx with tower middleware. A thin `main.rs` starts a library crate split into routes, extractors, domain types, repositories and services, and SQL is checked against PostgreSQL at compile time. For students who know basic Rust and want to see how a real service is laid out, from `cargo new` to a workspace a team can maintain for years.
Stages
1. 1Day 1 · 9 files and folders
2. 2Growing · +68 files and folders
3. Production · +33 files and folders
+ 1 more
- Advanced
- 143 files and folders
Opens with credits
Project structure · Backend
Flask
The Flaskr blog from the official Flask tutorial, grown into a real app: an application factory, blueprints for auth, blog and a JSON API, Flask-SQLAlchemy models with Flask-Migrate migrations, services shared by views and API, and pytest from the tutorial's fixtures up to Playwright and contract tests. For students who finished the tutorial and want to know what the next fifty files look like.
Stages
1. 1Day 1 · 27 files and folders
2. 2Growing · +62 files and folders
3. Production · +26 files and folders
+ 1 more
- Beginner
- 137 files and folders
Opens with credits
Project structure · Backend
Firebase (Cloud Functions and security rules)
For students building an app on Firebase who need a real backend: Cloud Functions (2nd gen) in TypeScript, Firestore and Storage security rules with tests, and the Local Emulator Suite. The tree starts from `firebase init` and grows into feature folders of callables, triggers and scheduled jobs, then adds CI deploys, environments, contract tests and runbooks.
Stages
1. 1Day 1 · 21 files and folders
2. 2Growing · +59 files and folders
3. Production · +25 files and folders
+ 1 more
- Intermediate
- 137 files and folders
Opens with credits

Full stack

Project structure · Full stack
MERN (MongoDB, Express, React, Node)
One repository with a React app built by Vite in client/, an Express API with Mongoose in server/, and a tiny shared/ package that both import for request shapes and types. npm workspaces give you one install and one command to run both, and one example feature (clinic appointments) runs through every folder so you can see how a request travels from a form to MongoDB and back, and what tests, security and operations a real team adds around it.
Stages
1. 1Day 1 · 35 files and folders
2. 2Growing · +121 files and folders
3. Production · +39 files and folders
+ 1 more
- Intermediate
- 247 files and folders
Opens with credits
Project structure · Full stack
Next.js full stack (database and auth)
One Next.js app that is both your frontend and your backend: pages render on the server, forms call Server Actions, and Route Handlers serve the few real HTTP endpoints (auth, webhooks, jobs, health). PostgreSQL through Prisma ORM, sign-in through Better Auth, background jobs with Inngest, and every database read goes through a small Data Access Layer that checks who is asking. The example features are invoices and clients for freelancers.
Stages
1. 1Day 1 · 26 files and folders
2. 2Growing · +143 files and folders
3. Production · +46 files and folders
+ 1 more
- Intermediate
- 258 files and folders
Opens with credits
Project structure · Full stack
.NET with Angular
The common enterprise pairing: an ASP.NET Core Web API and an Angular app as two projects in one solution, exactly as the Visual Studio template lays them out. In development the Angular dev server proxies API calls to .NET; in production the API serves the built Angular files from one origin, so cookie sign-in with ASP.NET Core Identity just works. The Angular API client is generated from the API's OpenAPI document, so both sides always agree. The example features are orders and products.
Stages
1. 1Day 1 · 49 files and folders
2. 2Growing · +101 files and folders
3. Production · +43 files and folders
+ 1 more
- Intermediate
- 246 files and folders
Opens with credits
Project structure · Full stack
Spring Boot with React
A Spring Boot API from Spring Initializr in server/ and a React app from Vite in client/, side by side in one repository. The Vite dev server and Nginx both proxy /api to Spring, so the browser sees one origin with session cookies and CSRF tokens, and TypeScript types are generated from Spring's OpenAPI document. It grows from two scaffolds to a tested, containerised, observable app with contract tests and release automation; the example feature is orders.
Stages
1. 1Day 1 · 67 files and folders
2. 2Growing · +109 files and folders
3. Production · +35 files and folders
+ 1 more
- Intermediate
- 251 files and folders
Opens with credits
Project structure · Full stack
Django with React
A Django and Django REST framework backend in `backend/` and a Vite React TypeScript app in `frontend/`, in one repository. The browser always sees one origin: Vite proxies `/api` in development and Django serves the built React app in production, so login is a normal Django session protected by its CSRF cookie, and TypeScript types are generated from the DRF schema. For students who know a bit of Django and a bit of React and want to see how the two halves fit together, from two scaffolds to one tested, deployable app.
Stages
1. 1Day 1 · 39 files and folders
2. 2Growing · +63 files and folders
3. Production · +21 files and folders
+ 1 more
- Intermediate
- 144 files and folders
Opens with credits
Project structure · Full stack
Turborepo monorepo
One Git repository holding several apps and the packages they share, wired together by pnpm workspaces and run by Turborepo. `apps/` holds things you deploy (two Next.js apps from the starter, later an API), `packages/` holds shared code and config (UI components, ESLint and TypeScript configs, validation schemas, the database client). Turborepo runs each task in dependency order and caches the results, so you never rebuild what did not change.
Stages
1. 1Day 1 · 66 files and folders
2. 2Growing · +41 files and folders
3. Production · +20 files and folders
+ 1 more
- Intermediate
- 146 files and folders
Opens with credits
Project structure · Full stack
T3 app (Next.js, tRPC, Prisma)
A typesafe full stack app made with create-t3-app: Next.js App Router for pages, tRPC for an API whose types flow straight into your components, Prisma for PostgreSQL, NextAuth.js for sign in and Tailwind CSS for styling. The example app splits shared expenses between flatmates. For students who know React and some TypeScript and want one codebase where a typo in a field name is a compile error, not a production bug.
Stages
1. 1Day 1 · 51 files and folders
2. 2Growing · +48 files and folders
3. Production · +21 files and folders
+ 1 more
- Intermediate
- 136 files and folders
Opens with credits
Project structure · Full stack
Blazor web app
A full stack C# web app built from the .NET 10 `dotnet new blazor` template with interactive Auto mode: a server project that prerenders pages and owns the database, and a .Client project for components that can run in the browser as WebAssembly. For students who know some C# and want to build web UI without a JavaScript framework, and want to know where the database code, the shared contracts and the bUnit tests go as the app grows.
Stages
1. 1Day 1 · 46 files and folders
2. 2Growing · +57 files and folders
3. Production · +27 files and folders
+ 1 more
- Intermediate
- 156 files and folders
Opens with credits

Mobile

Project structure · Mobile
Flutter
For anyone building one Dart app for Android, iOS and the web. The tree starts from what flutter create gives you and grows into a feature-first lib/ folder, where each feature keeps its own data, domain and presentation code, then adds tests at every level, flavors, release signing, crash reporting and, for large teams, a melos workspace of local packages.
Stages
1. 1Day 1 · 48 files and folders
2. 2Growing · +95 files and folders
3. Production · +47 files and folders
+ 1 more
- Intermediate
- 224 files and folders
Opens with credits
Project structure · Mobile
React Native with Expo
For web developers who know React and want one TypeScript codebase for Android, iOS and the web. Routes are files in src/app (Expo Router), the business logic lives in feature folders under src/features split into data, domain and presentation, and the native android and ios folders are generated, not hand-written.
Stages
1. 1Day 1 · 38 files and folders
2. 2Growing · +102 files and folders
3. Production · +37 files and folders
+ 1 more
- Intermediate
- 228 files and folders
Opens with credits
Project structure · Mobile
Android with Kotlin and Compose
For anyone building a native Android app the way Google recommends in 2026: Kotlin, Jetpack Compose, a ViewModel per screen, repositories over Room and the network, and Hilt wiring it together. The tree starts from Android Studio's Empty Activity template, grows into feature packages with data, domain and presentation, adds signing, shrinking, CI and crash reporting for production, and ends as a multi-module build with convention plugins, Baseline Profiles and staged rollouts.
Stages
1. 1Day 1 · 50 files and folders
2. 2Growing · +104 files and folders
3. Production · +45 files and folders
+ 1 more
- Intermediate
- 290 files and folders
Opens with credits
Project structure · Mobile
iOS app with SwiftUI
For students building a native iPhone app in Swift. The tree starts from Xcode's App template and grows into feature folders with @Observable models, a small URLSession API client, a SwiftData offline cache and Swift Testing, then adds build configurations, privacy manifests, fastlane or Xcode Cloud releases and, for large teams, local Swift packages.
Stages
1. 1Day 1 · 18 files and folders
2. 2Growing · +61 files and folders
3. Production · +33 files and folders
+ 1 more
- Intermediate
- 139 files and folders
Opens with credits
Project structure · Mobile
Kotlin Multiplatform
For students who want one Kotlin codebase for Android and iOS. The tree follows the current KMP wizard layout: a shared module with commonMain, androidMain and iosMain, a thin androidApp module, and an iosApp Xcode project, with Compose Multiplatform for shared UI. It grows into feature folders with Ktor, Room and Koin, adds tests that run on both platforms, signing and store releases, and for large teams, convention plugins and more modules.
Stages
1. 1Day 1 · 53 files and folders
2. 2Growing · +38 files and folders
3. Production · +25 files and folders
+ 1 more
- Intermediate
- 138 files and folders
Opens with credits

AI and ML

Project structure · AI and ML
GenAI RAG app (FastAPI)
For developers turning a "chat with your documents" demo into an app people can rely on. A FastAPI backend where every layer has a home: ingestion workers, retrieval, prompts as versioned files, model clients with fallbacks and cost caps, guards, evals that gate CI, and tracing, so a wrong answer can be traced to the step that caused it.
Stages
1. 1Day 1 · 19 files and folders
2. 2Growing · +107 files and folders
3. Production · +62 files and folders
+ 1 more
- Intermediate
- 229 files and folders
Opens with credits
Project structure · AI and ML
AI agent with an MCP server
For developers who want to give AI assistants safe access to their own data or API. A TypeScript MCP server built on the official SDK, organised by feature (tasks, projects) with each feature owning its tools, resources and prompts, served over stdio for local hosts and Streamable HTTP with OAuth for remote ones, plus a small agent and the evals that prove a model can use it.
Stages
1. 1Day 1 · 16 files and folders
2. 2Growing · +63 files and folders
3. Production · +43 files and folders
+ 1 more
- Intermediate
- 172 files and folders
Opens with credits
Project structure · AI and ML
Machine learning project
For students and analysts whose model works in a notebook and now needs to be reproducible, reviewable, served and watched. It starts from the Cookiecutter Data Science v2 layout (immutable raw data, numbered notebooks, a real Python package) and grows into versioned data with DVC, typed parameters, data validation with pandera, experiment tracking and a model registry with MLflow, a FastAPI prediction service, drift monitoring and, for a team, scheduled retraining, model cards, fairness checks and shadow deployment.
Stages
1. 1Day 1 · 42 files and folders
2. 2Growing · +44 files and folders
3. Production · +47 files and folders
+ 1 more
- Intermediate
- 169 files and folders
Opens with credits
Project structure · AI and ML
MLOps pipeline
For engineers who can train a model and now need the training to be a pipeline anyone can rerun, review and release. A uv workspace holds the pipeline package (prepare, validate, featurize, train, evaluate, register steps run by DVC), a small shared feature package, and a separate FastAPI prediction service that loads models from the MLflow registry by alias. It grows into CI that reproduces the pipeline on pull requests, scheduled retraining, approved promotion and monitoring.
Stages
1. 1Day 1 · 25 files and folders
2. 2Growing · +54 files and folders
3. Production · +46 files and folders
+ 1 more
- Advanced
- 151 files and folders
Opens with credits
Project structure · AI and ML
Python AI agent with LangGraph
For Python developers moving from "call a model in a loop" to an agent that can pause, resume and be debugged. It starts from the official LangGraph template (langgraph.json, a src/agent package, unit and integration tests) and grows into a customer support agent with typed state, one file per node and tool, human approval before refunds, evals that score whole trajectories, tracing, auth and a deployable server image.
Stages
1. 1Day 1 · 30 files and folders
2. 2Growing · +42 files and folders
3. Production · +30 files and folders
+ 1 more
- Intermediate
- 136 files and folders
Opens with credits

Data and DevOps

Project structure · Data and DevOps
dbt project
A dbt project that turns raw tables into tested, documented models, using the staging, intermediate and marts layers from dbt's own structure guide. It runs on DuckDB on your laptop, so you can learn analytics engineering for free, and grows into a governed project with checks, contracts, slim CI and a hosted docs site that moves to BigQuery or Snowflake unchanged.
Stages
1. 1Day 1 · 47 files and folders
2. 2Growing · +46 files and folders
3. Production · +27 files and folders
+ 1 more
- Intermediate
- 144 files and folders
Opens with credits
Project structure · Data and DevOps
Apache Airflow
For data engineers scheduling real pipelines with Airflow 3. It starts from `astro dev init` (dags, include, plugins, tests and a Runtime Dockerfile that runs Airflow locally in Docker) and grows into dags grouped by business area, logic in a tested include package, asset-driven scheduling, data quality checks, alerts, CI that parses and tests every dag, and dag-only deploys. A self-hosted docker compose and Helm route is shown alongside.
Stages
1. 1Day 1 · 21 files and folders
2. 2Growing · +48 files and folders
3. Production · +35 files and folders
+ 1 more
- Intermediate
- 139 files and folders
Opens with credits
Project structure · Data and DevOps
Terraform
An infrastructure repository for a small app on AWS: reusable modules, one folder per environment with its own remote state, pinned providers, tests and security scans, with plan on every pull request and apply from CI. For students who have finished the Terraform tutorials and want to know how a real team lays out the files. The same layout works unchanged with OpenTofu.
Stages
1. 1Day 1 · 16 files and folders
2. 2Growing · +54 files and folders
3. Production · +27 files and folders
+ 1 more
- Intermediate
- 133 files and folders
Opens with credits
Project structure · Data and DevOps
Kubernetes with Helm
A Helm chart repository for one app: the chart that `helm create` gives you, grown into a tested, versioned package with per-environment values, unit tests, install tests in a kind cluster and releases to an OCI registry. For students who can write a Deployment by hand and want to know how a team organises charts. It is about the repo layout and what each file does, not about cluster design.
Stages
1. 1Day 1 · 21 files and folders
2. 2Growing · +54 files and folders
3. Production · +20 files and folders
+ 1 more
- Intermediate
- 129 files and folders
Opens with credits

Project structure · More
Chrome extension
A Manifest V3 Chrome extension that saves highlights from any page into a side panel, built with WXT, React and TypeScript. WXT reads your `entrypoints` folder and writes the manifest for you, so the layout is one folder per thing Chrome loads (service worker, content script, popup, side panel, options) with shared code in `utils`. For students who have loaded an unpacked extension once and want to ship a real one to the Chrome Web Store.
Stages
1. 1Day 1 · 29 files and folders
2. 2Growing · +50 files and folders
3. Production · +33 files and folders
+ 1 more
- Intermediate
- 137 files and folders
Opens with credits
Project structure · More
Python package and CLI
A command line tool published to PyPI, laid out the way the Python Packaging User Guide and uv recommend: a src layout, one pyproject.toml for metadata and every tool, a thin Typer CLI over plain, testable modules, and releases uploaded by GitHub Actions with trusted publishing. The example is mdlinks, a tool that finds broken links in Markdown files. For students who have written Python scripts and want to ship one that strangers can `pip install`.
Stages
1. 1Day 1 · 14 files and folders
2. 2Growing · +58 files and folders
3. Production · +26 files and folders
+ 1 more
- Intermediate
- 135 files and folders
Opens with credits
Project structure · More
TypeScript npm library
A small, typed npm package (a retry helper) built the way modern libraries ship in 2026: TypeScript source in `src`, bundled by tsdown into `dist` with type declarations and an `exports` map, tested with Vitest, checked with publint and Are the Types Wrong, versioned with Changesets and published from CI with npm provenance. For students who want to publish their first package, and for anyone whose package works locally but breaks for users.
Stages
1. 1Day 1 · 15 files and folders
2. 2Growing · +44 files and folders
3. Production · +26 files and folders
+ 1 more
- Intermediate
- 123 files and folders
Opens with credits
Project structure · More
VS Code extension
A TypeScript extension for Visual Studio Code, built from the official Yeoman generator with esbuild bundling. The example, TODO Lens, finds TODO comments and shows them in a tree view, with commands, settings and editor decorations. The tree grows from the generator's Hello World into commands, providers and editor-free core logic, then tests on three operating systems, publishing to the Marketplace and Open VSX, and a webview with a strict security policy. For students who use VS Code every day and want to build a tool other developers install.
Stages
1. 1Day 1 · 25 files and folders
2. 2Growing · +41 files and folders
3. Production · +25 files and folders
+ 1 more
- Intermediate
- 130 files and folders
Opens with credits
Project structure · More
Discord bot
A study buddy bot for Discord servers (focus sessions, streaks, a leaderboard), built on discord.js with TypeScript from the official create-discord-bot template. Node runs the TypeScript directly, commands and events are one file each in folders the loaders read, and the bot grows a PostgreSQL database with Drizzle, background jobs and a Docker deploy. For students who have made a `/ping` bot and want one that survives thousands of servers.
Stages
1. 1Day 1 · 28 files and folders
2. 2Growing · +55 files and folders
3. Production · +25 files and folders
+ 1 more
- Intermediate
- 132 files and folders
Opens with credits
Project structure · More
Unity game
A small 3D action game in Unity 6.3 LTS with the Universal Render Pipeline, laid out the way Unity's manual and experienced teams do it: your own work in one `_Project` folder grouped by feature, C# split into assemblies with `.asmdef` files, Edit mode and Play mode tests, and Git with LFS and Smart Merge for scenes and art. The example is Lantern Runner. For students who have finished a Unity tutorial and want to know how a real game project stays organised as it grows.
Stages
1. 1Day 1 · 37 files and folders
2. 2Growing · +65 files and folders
3. Production · +20 files and folders
+ 1 more
- Intermediate
- 140 files and folders
Opens with credits
Project structure · More
ESP32 with PlatformIO
Firmware for an ESP32-S3 plant monitor that reads soil moisture and temperature, publishes them over MQTT and serves a small web dashboard, built with PlatformIO and the Arduino framework. The layout follows the PlatformIO project conventions: firmware in src/, testable logic in private libraries under lib/, tests under test/ that run on your laptop and on the board, web files in data/ for LittleFS, and a custom partition table with two OTA slots. For students who have blinked an LED in the Arduino IDE and want to build firmware that survives in the field.
Stages
1. 1Day 1 · 17 files and folders
2. 2Growing · +53 files and folders
3. Production · +31 files and folders
+ 1 more
- Intermediate
- 131 files and folders
Opens with credits
Project structure · More
WordPress plugin
A modern WordPress plugin that adds product reviews: blocks scaffolded with `@wordpress/create-block` and built by `@wordpress/scripts`, PHP classes autoloaded by Composer, a REST API, a React settings page, and tests running inside `wp-env`. For students who can write a little PHP and JavaScript and want to build a plugin the way WordPress core contributors and serious plugin teams lay it out.
Stages
1. 1Day 1 · 19 files and folders
2. 2Growing · +63 files and folders
3. Production · +21 files and folders
+ 1 more
- Intermediate
- 124 files and folders
Opens with credits
Project structure · More
Electron desktop app
A desktop notes app for Windows, macOS and Linux, built from the Electron Forge 8 Vite and TypeScript template. The tree starts with the scaffold's three entry files (main, preload, renderer) and grows into separate folders for each process, a typed IPC contract, signed installers, auto-update and end-to-end tests on the packaged app. For students who know web development and want to ship a real desktop app; if a small download matters more than a large JavaScript ecosystem, Tauri is the alternative worth comparing first.
Stages
1. 1Day 1 · 22 files and folders
2. 2Growing · +58 files and folders
3. Production · +29 files and folders
+ 1 more
- Intermediate
- 138 files and folders
Opens with credits

Work with me

Stuck on something specific?

Writing only gets you so far. If you want an answer to your situation rather than the general case, book a session and we will work through it together. Sessions are free for approved Sefism members, and a few slots open each week.