full-stack-fastapi-template

Full stack, modern web application template. Using FastAPI, React, SQLModel, PostgreSQL, Docker, GitHub Actions, automatic HTTPS and more.

26,007

4,513

26,007

182

View on GitHub

Top Related Projects

full-stack-fastapi-template

26,012

Full stack, modern web application template. Using FastAPI, React, SQLModel, PostgreSQL, Docker, GitHub Actions, automatic HTTPS and more.

fastapi

75,446

FastAPI framework, high performance, easy to learn, fast to code, ready for production

cookiecutter-django

11,953

Cookiecutter Django is a framework for jumpstarting production-ready Django projects quickly.

awesome-fastapi

8,332

A curated list of awesome things related to FastAPI

Quick Overview

The fastapi/full-stack-fastapi-template is a comprehensive project template for building full-stack web applications using FastAPI, PostgreSQL, and React. It provides a solid foundation for developing modern, scalable web applications with a robust backend API and a responsive frontend interface.

Pros

Includes a complete setup for both backend (FastAPI) and frontend (React) development
Incorporates best practices for project structure, security, and deployment
Provides pre-configured Docker setup for easy development and deployment
Includes user authentication and authorization out of the box

Cons

May be overwhelming for beginners due to its comprehensive nature
Requires knowledge of multiple technologies (FastAPI, React, PostgreSQL, Docker)
Some users may find the opinionated project structure limiting
Regular maintenance is needed to keep dependencies up-to-date

Code Examples

Creating a new API endpoint:

from fastapi import APIRouter, Depends
from sqlalchemy.orm import Session

from app import crud, schemas
from app.api import deps

router = APIRouter()

@router.post("/items/", response_model=schemas.Item)
def create_item(
    item: schemas.ItemCreate,
    db: Session = Depends(deps.get_db),
    current_user: schemas.User = Depends(deps.get_current_active_user),
):
    return crud.item.create_with_owner(db=db, obj_in=item, owner_id=current_user.id)

Defining a database model:

from sqlalchemy import Column, ForeignKey, Integer, String
from sqlalchemy.orm import relationship

from app.db.base_class import Base

class Item(Base):
    id = Column(Integer, primary_key=True, index=True)
    title = Column(String, index=True)
    description = Column(String, index=True)
    owner_id = Column(Integer, ForeignKey("user.id"))
    owner = relationship("User", back_populates="items")

Creating a React component:

import React from 'react';
import { useQuery } from 'react-query';
import { getItems } from '../api';

const ItemList = () => {
  const { data, isLoading, error } = useQuery('items', getItems);

  if (isLoading) return <div>Loading...</div>;
  if (error) return <div>Error: {error.message}</div>;

  return (
    <ul>
      {data.map((item) => (
        <li key={item.id}>{item.title}</li>
      ))}
    </ul>
  );
};

export default ItemList;

Getting Started

Clone the repository:

git clone https://github.com/tiangolo/full-stack-fastapi-postgresql.git
cd full-stack-fastapi-postgresql

Create a .env file with your environment variables:
```
cp .env.example .env
```
Start the development environment using Docker:
```
docker-compose up -d
```
Access the API documentation at http://localhost:8000/docs and the frontend at http://localhost:3000.

Competitor Comparisons

full-stack-fastapi-template

26,012

Full stack, modern web application template. Using FastAPI, React, SQLModel, PostgreSQL, Docker, GitHub Actions, automatic HTTPS and more.

Pros of full-stack-fastapi-template

More comprehensive and feature-rich, including frontend and backend components
Includes Docker setup for easier deployment and development
Provides a complete project structure with user authentication and database integration

Cons of full-stack-fastapi-template

May be overly complex for simple projects or beginners
Requires more setup and configuration due to its full-stack nature
Potentially harder to customize or modify due to its extensive structure

Code Comparison

full-stack-fastapi-template:

from fastapi import FastAPI, Depends
from app.api.deps import get_current_active_user

app = FastAPI(title="MyApp")

@app.get("/users/me")
def read_users_me(current_user = Depends(get_current_active_user)):
    return current_user

full-stack-fastapi-template:

from fastapi import FastAPI

app = FastAPI()

@app.get("/")
def read_root():
    return {"Hello": "World"}

The code comparison shows that full-stack-fastapi-template includes more advanced features like user authentication, while full-stack-fastapi-template provides a simpler starting point. The full-stack version offers a more structured approach with dependencies and user management, whereas the other template focuses on basic FastAPI functionality.

fastapi

75,446

FastAPI framework, high performance, easy to learn, fast to code, ready for production

Pros of FastAPI

Lightweight and focused on core API functionality
Extensive documentation and examples for API development
Highly performant and designed for asynchronous operations

Cons of FastAPI

Lacks built-in full-stack features and frontend integration
Requires additional setup for database management and authentication
Less opinionated structure for larger applications

Code Comparison

FastAPI (basic route):

from fastapi import FastAPI

app = FastAPI()

@app.get("/")
async def root():
    return {"message": "Hello World"}

Full-Stack FastAPI Template (route with dependencies):

from fastapi import APIRouter, Depends
from app import deps

router = APIRouter()

@router.get("/")
def read_root(
    db = Depends(deps.get_db),
    current_user = Depends(deps.get_current_active_user),
):
    return {"message": "Hello World"}

The Full-Stack FastAPI Template provides a more structured approach with pre-configured dependencies and database integration, while the core FastAPI focuses on simplicity and flexibility for API development.

cookiecutter-django

11,953

Cookiecutter Django is a framework for jumpstarting production-ready Django projects quickly.

Pros of cookiecutter-django

More mature and established project with a larger community
Comprehensive documentation and extensive feature set
Built-in support for Docker and production-ready configurations

Cons of cookiecutter-django

Steeper learning curve due to its complexity and extensive features
Potentially slower development process for smaller projects
Less flexibility for customization compared to a more lightweight template

Code Comparison

cookiecutter-django:

from django.db import models
from django.contrib.auth.models import AbstractUser

class User(AbstractUser):
    name = models.CharField(_("Name of User"), blank=True, max_length=255)

full-stack-fastapi-template:

from sqlalchemy import Column, Integer, String
from app.db.base_class import Base

class User(Base):
    id = Column(Integer, primary_key=True, index=True)
    full_name = Column(String, index=True)

The cookiecutter-django example shows a custom User model extending Django's AbstractUser, while the full-stack-fastapi-template uses SQLAlchemy for database models, demonstrating the different approaches to ORM and user management in these frameworks.

awesome-fastapi

8,332

A curated list of awesome things related to FastAPI

Pros of awesome-fastapi

Comprehensive collection of FastAPI resources, tutorials, and tools
Regularly updated with community contributions
Serves as a valuable learning and reference hub for FastAPI developers

Cons of awesome-fastapi

Not a complete project template, requires more setup for a full-stack application
Lacks integrated frontend and backend components
May overwhelm beginners with too many options and resources

Code Comparison

awesome-fastapi doesn't provide direct code examples, as it's a curated list of resources. However, full-stack-fastapi-template offers a complete project structure:

# full-stack-fastapi-template
from fastapi import FastAPI
from app.api.api_v1.api import api_router

app = FastAPI()
app.include_router(api_router, prefix="/api/v1")

Summary

awesome-fastapi is an excellent resource for learning and discovering FastAPI tools, while full-stack-fastapi-template provides a ready-to-use project structure. The choice depends on whether you need a comprehensive reference or a complete project setup.

Convert designs to code with AI

Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.

Try Visual Copilot

README

Full Stack FastAPI Template

Technology Stack and Features

â¡ FastAPI for the Python backend API.
- ð§° SQLModel for the Python SQL database interactions (ORM).
- ð Pydantic, used by FastAPI, for the data validation and settings management.
- ð¾ PostgreSQL as the SQL database.
ð React for the frontend.
- ð Using TypeScript, hooks, Vite, and other parts of a modern frontend stack.
- ð¨ Chakra UI for the frontend components.
- ð¤ An automatically generated frontend client.
- ð§ª Playwright for End-to-End testing.
- ð¦ Dark mode support.
ð Docker Compose for development and production.
ð Secure password hashing by default.
ð JWT (JSON Web Token) authentication.
ð« Email based password recovery.
â Tests with Pytest.
ð Traefik as a reverse proxy / load balancer.
ð¢ Deployment instructions using Docker Compose, including how to set up a frontend Traefik proxy to handle automatic HTTPS certificates.
ð CI (continuous integration) and CD (continuous deployment) based on GitHub Actions.

Dashboard Login

Dashboard - Admin

Dashboard - Create User

Dashboard - Items

Dashboard - User Settings

Dashboard - Dark Mode

Interactive API Documentation

How To Use It

You can just fork or clone this repository and use it as is.

â¨ It just works. â¨

How to Use a Private Repository

If you want to have a private repository, GitHub won't allow you to simply fork it as it doesn't allow changing the visibility of forks.

But you can do the following:

Create a new GitHub repo, for example my-full-stack.
Clone this repository manually, set the name with the name of the project you want to use, for example my-full-stack:

git clone git@github.com:fastapi/full-stack-fastapi-template.git my-full-stack

Enter into the new directory:

cd my-full-stack

Set the new origin to your new repository, copy it from the GitHub interface, for example:

git remote set-url origin git@github.com:octocat/my-full-stack.git

Add this repo as another "remote" to allow you to get updates later:

git remote add upstream git@github.com:fastapi/full-stack-fastapi-template.git

Push the code to your new repository:

git push -u origin master

Update From the Original Template

After cloning the repository, and after doing changes, you might want to get the latest changes from this original template.

Make sure you added the original repository as a remote, you can check it with:

git remote -v

origin    git@github.com:octocat/my-full-stack.git (fetch)
origin    git@github.com:octocat/my-full-stack.git (push)
upstream    git@github.com:fastapi/full-stack-fastapi-template.git (fetch)
upstream    git@github.com:fastapi/full-stack-fastapi-template.git (push)

Pull the latest changes without merging:

git pull --no-commit upstream master

This will download the latest changes from this template without committing them, that way you can check everything is right before committing.

If there are conflicts, solve them in your editor.
Once you are done, commit the changes:

git merge --continue

Configure

You can then update configs in the .env files to customize your configurations.

Before deploying it, make sure you change at least the values for:

SECRET_KEY
FIRST_SUPERUSER_PASSWORD
POSTGRES_PASSWORD

You can (and should) pass these as environment variables from secrets.

Read the deployment.md docs for more details.

Generate Secret Keys

Some environment variables in the .env file have a default value of changethis.

You have to change them with a secret key, to generate secret keys you can run the following command:

python -c "import secrets; print(secrets.token_urlsafe(32))"

Copy the content and use that as password / secret key. And run that again to generate another secure key.

How To Use It - Alternative With Copier

This repository also supports generating a new project using Copier.

It will copy all the files, ask you configuration questions, and update the .env files with your answers.

Install Copier

You can install Copier with:

pip install copier

Or better, if you have pipx, you can run it with:

pipx install copier

Note: If you have pipx, installing copier is optional, you could run it directly.

Generate a Project With Copier

Decide a name for your new project's directory, you will use it below. For example, my-awesome-project.

Go to the directory that will be the parent of your project, and run the command with your project's name:

copier copy https://github.com/fastapi/full-stack-fastapi-template my-awesome-project --trust

If you have pipx and you didn't install copier, you can run it directly:

pipx run copier copy https://github.com/fastapi/full-stack-fastapi-template my-awesome-project --trust

Note the --trust option is necessary to be able to execute a post-creation script that updates your .env files.

Input Variables

Copier will ask you for some data, you might want to have at hand before generating the project.

But don't worry, you can just update any of that in the .env files afterwards.

The input variables, with their default values (some auto generated) are:

project_name: (default: "FastAPI Project") The name of the project, shown to API users (in .env).
stack_name: (default: "fastapi-project") The name of the stack used for Docker Compose labels and project name (no spaces, no periods) (in .env).
secret_key: (default: "changethis") The secret key for the project, used for security, stored in .env, you can generate one with the method above.
first_superuser: (default: "admin@example.com") The email of the first superuser (in .env).
first_superuser_password: (default: "changethis") The password of the first superuser (in .env).
smtp_host: (default: "") The SMTP server host to send emails, you can set it later in .env.
smtp_user: (default: "") The SMTP server user to send emails, you can set it later in .env.
smtp_password: (default: "") The SMTP server password to send emails, you can set it later in .env.
emails_from_email: (default: "info@example.com") The email account to send emails from, you can set it later in .env.
postgres_password: (default: "changethis") The password for the PostgreSQL database, stored in .env, you can generate one with the method above.
sentry_dsn: (default: "") The DSN for Sentry, if you are using it, you can set it later in .env.

Backend Development

Backend docs: backend/README.md.

Frontend Development

Frontend docs: frontend/README.md.

Deployment

Deployment docs: deployment.md.

Development

General development docs: development.md.

This includes using Docker Compose, custom local domains, .env configurations, etc.

Release Notes

Check the file release-notes.md.

License

The Full Stack FastAPI Template is licensed under the terms of the MIT license.

Top Related Projects

Convert designs to code with AI

Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.

Try Visual Copilot