APIviz Home

01 — GETTING STARTED

FastAPI

FastAPI is a modern Python framework built for speed. It auto-generates documentation, validates request/response types at runtime, and is fully async. Perfect for APIs that Axios will consume.

The FastAPI Request Pipeline — Click to Animate

Axios Client

Frontend

Uvicorn ASGI

Web Server

FastAPI Route

Async Logic

Pydantic

Validation

Fast

On par with Node.js/Go. Built on Starlette + Uvicorn.

Auto Docs

Swagger UI + ReDoc generated free at /docs.

Type Safe

Pydantic validates every request/response field.

Async

Native async/await. Non-blocking I/O by default.

02 — GETTING STARTED

Django DRF vs FastAPI

Compare the heavy-duty batteries-included framework with the modern, high-speed micro-framework side-by-side.

Django DRF vs FastAPI — Side by Side

Feature
Django DRF
FastAPI
Performance
Moderate (sync)
Fast (async)
Auto Docs
No (use drf-spectacular)
Yes (built-in)
Validation
Serializer fields
Pydantic (Python types)
Admin Panel
Yes (built-in)
No
ORM
Django ORM (built-in)
SQLAlchemy (add-on)
Learning Curve
Steep
Gentle
Best For
Full-stack apps with admin
Pure APIs, ML services

03 — GETTING STARTED

Installation & Server Setup

Get a FastAPI project running locally in two commands.

Install Packages

$ pip install fastapi uvicorn

Start Server (Uvicorn)

$ uvicorn main:app --reload

FastAPI Auto-Docs at /docs

Interactive Swagger UI — test endpoints in browser at http://localhost:8000/docs

Alternative ReDoc docs at http://localhost:8000/redoc

Request/response schemas shown automatically from Pydantic models

"Try it out" button sends real HTTP requests directly to the backend

04 — CORE CONCEPTS

Complete CRUD API

FastAPI allows writing complete applications in a single file with native CORS support.

Complete CRUD API — Single File

main.pyFull FastAPI application
# pip install fastapi uvicorn pydantic from fastapi import FastAPI, HTTPException from pydantic import BaseModel from typing import Optional, List from fastapi.middleware.cors import CORSMiddleware app = FastAPI(title="My API") # CORS — so Axios can call this from React app.add_middleware( CORSMiddleware, allow_origins=["http://localhost:3000"], allow_methods=["*"], allow_headers=["*"], ) # --- Pydantic Schema (replaces Serializer) --- class UserCreate(BaseModel): name: str email: str role: str = "user" class UserResponse(UserCreate): id: int class Config: from_attributes = True # --- In-memory DB (replace with real DB) --- db: List[dict] = [ {"id": 1, "name": "Alice", "email": "alice@ex.com", "role": "admin"}, {"id": 2, "name": "Bob", "email": "bob@ex.com", "role": "user"}, ] next_id = 3 # --- Routes --- @app.get("/api/users", response_model=List[UserResponse]) async def list_users(role: Optional[str] = None): # FastAPI auto-filters from query param! # GET /api/users?role=admin users = db if role: users = [u for u in db if u["role"] == role] return users @app.post("/api/users", response_model=UserResponse, status_code=201) async def create_user(user: UserCreate): global next_id # Pydantic validates name & email automatically if any(u["email"] == user.email for u in db): raise HTTPException(status_code=409, detail="Email exists") new_user = {"id": next_id, **user.model_dump()} db.append(new_user) next_id += 1 return new_user @app.get("/api/users/{user_id}", response_model=UserResponse) async def get_user(user_id: int): for u in db: if u["id"] == user_id: return u raise HTTPException(status_code=404, detail="User not found") @app.delete("/api/users/{user_id}") async def delete_user(user_id: int): for i, u in enumerate(db): if u["id"] == user_id: db.pop(i) return {"message": "Deleted"} raise HTTPException(status_code=404, detail="User not found")

05 — CORE CONCEPTS

Pydantic Validation

Pydantic enforces strict data validation using standard Python type hints. If the incoming payload violates the type declaration, FastAPI automatically rejects it with code 422.

Pydantic Validation — What Axios Gets Back

// If Axios sends invalid data: axios.post('/api/users', { name: '' }) // FastAPI responds with 422 Unprocessable Entity: { "detail": [{ "loc": ["body", "name"], "msg": "String must have at least 1 character", "type": "string_too_short" }] } // Axios catches: err.response.status === 422 // err.response.data.detail[0].msg has the descriptive message

06 — CORE CONCEPTS

Axios + FastAPI pairing

Combine frontend requests with backend route handlers. Capture validation errors globally.

React — api.js (Typed Axios calls)

React — api.jsTyped Axios calls
import axios from 'axios'; const api = axios.create({ baseURL: 'http://localhost:8000/api', }); // GET with query param — matches FastAPI's ?role= filter const { data: admins } = await api.get('/users', { params: { role: 'admin' } }); // → GET /api/users?role=admin // POST — Pydantic validates the shape const { data } = await api.post('/users', { name: 'Charlie', email: 'charlie@example.com', role: 'user' }); // → 201 { id: 3, name: "Charlie", ... } // Handle FastAPI's 422 validation errors axios.interceptors.response.use( res => res.data, err => { if (err.response?.status === 422) { // Pydantic validation error const msg = err.response.data.detail .map(d => d.msg).join(', '); return Promise.reject(new Error(msg)); } return Promise.reject(err); } );

07 — PRACTICE

FastAPI Playground

Simulate FastAPI endpoints locally. Test Pydantic validation rules and responses live.

Request Builder

Response Console

Response Body
// Send a request or select a quick option below

Quick Endpoints

08 — PRACTICE

FastAPI Quiz

Test your knowledge of Python backends and FastAPI.

1/8