⚙️ Mini Projects
Complete, runnable mini-projects that tie frontend + FastAPI + Docker + ML together. Each project has multiple files and a step-by-step explanation.
11 concepts
1
Form + Fetch + FastAPI Backend
A login form that POSTs to FastAPI, a button that GETs users, and a live clock — the exact pattern behind every auth flow.
›
2
CRUD API with FastAPI + SQLAlchemy
Create, Read, Update, Delete users — the four operations every backend needs. SQLite + Pydantic + SQLAlchemy.
›
3
Dockerize a FastAPI App
Package a FastAPI app into a Docker image. Same image runs on your laptop, Render, AWS, anywhere.
›
4
Linear Regression with scikit-learn
Train a model on (X, y) data, predict on new X, score with MSE + R². The 'hello world' of ML.
›
5
Todo App with localStorage
Pure frontend — no backend, no server. Add, complete, delete todos. They survive page reload via localStorage.
›
6
WebSocket Chat Room
Real-time chat — messages broadcast to every connected browser instantly. FastAPI WS + vanilla JS client.
›
7
JWT Auth Flow (Login → Cookie → Protected Route)
The complete auth loop: register, login (get JWT in cookie), access a protected route, logout. The backbone of OpenBenchML.
›
8
File Upload + Save + List
Upload files via multipart form, save to disk with a UUID name, list all uploaded files. The pattern behind OpenBenchML's model upload.
›
9
SQLite + SQLAlchemy from Scratch
Set up a SQLite database, define models, run queries, run migrations. The data layer behind every backend.
›
10
Frontend REST Client (fetch + render table)
A vanilla JS frontend that calls a REST API, renders results in a table, and supports add/delete — no framework.
›
11
Mini Metrics Dashboard (chart + API)
A dashboard that fetches metrics from FastAPI and renders a live bar chart with vanilla JS + SVG. No chart library.
›