A modern, feature-rich starter template for building web applications with FastHTML, TailwindCSS, and FH-FrankenUI.

• 🚀 Pre-configured FastHTML setup with hot-reload
• 💅 TailwindCSS and ft-frankenui itegration for modern styling
• 📁 Clean and organized project structure
• 🛠️ Automated tools for development workflow
• 🔄 Automatic route collection system
• 📄 Built-in page creation script
• 🧪 Testing setup with pytest
• 🗃️ Built-in FastHTML database support
• 🔐 Complete authentication system

This is a template repository on GitHub. To use it:

1. Click the "Use this template" button at the top of the repository
2. Create a new repository from this template
3. Clone your new repository:

git clone <your-new-repository-url>
cd <your-repository-name>

4. Initialize the development environment:

make init

This will:

• Create a virtual environment using uv (or standard venv if uv is not installed)
• Install all required dependencies
• Set up the project for development

5. Create your .env based on .env.example to include your prefered DATABASE_URL

6. Once in your virtual env start the project with:

make run

This will run example app on port 8000. You can change the port in main.py file.

project/
├── app/                    # Application code
│   ├── components/         # Reusable UI components
│   ├── models/            # Data models
│   ├── pages/             # Page routes and views
│   ├── services/          # Business logic and services
│   │   └── db/           # Database services
│   ├── templates/         # Page templates
│   └── utils/            # Utility functions
├── config/                # Configuration files
├── static/                # Static assets
└── tests/                # Test files

The template features an automatic route collection system that scans the app/pages directory and registers all routes automatically. Here's how it works:

1. Create a new page in the app/pages directory:

# app/pages/hello.py
from fasthtml.common import *
from fasthtml.core import APIRouter

rt = APIRouter()

@rt("/hello")
def get(request):
    return "Hello, World!"

2. The route collector will automatically find and register this route - no manual registration needed!

You can create new pages by using:

make new-page ROUTE=your/page/path

This will create the same folder route structure under project/app/pages with routes attached to get and post methods.

from fasthtml.common import *
from fasthtml.core import APIRouter

rt = APIRouter()

@rt("/your/page/path")
def get(request):
    return Titled("New Page", P("This is a new page"))

@rt("/your/page/path")
def post(request):
    # Handle POST request
    return {"message": "Received a POST request"}

# Add other HTTP methods as needed

The template includes a database system built on SQLModel with a custom BaseTable class.

Create new models by extending the BaseTable class:

from sqlmodel import Field
from app.models.base import BaseTable

class Product(BaseTable, table=True):
    name: str = Field(nullable=False)
    price: float = Field(nullable=False)
    description: str = Field(default="")

The BaseTable class provides several convenient methods:

# Create/Update
product = Product(name="Widget", price=9.99)
product.save()

# Query
all_products = Product.all()
specific_product = Product.get(product_id)

# Update
Product.update(product_id, {"price": 19.99})

# Delete
Product.delete(product_id)

The template uses Alembic for database migrations. If you're using SQLite, make sure you specify absolute database DATABSE_URL in your .env file.

1. After creating or modifying models, generate a migration:

alembic revision --autogenerate -m "Add product table"

or

make migrations

2. Apply the migration:

alembic upgrade head

or

make migrate

The template includes a complete authentication system with the following features:

• User registration and login
• Password reset functionality
• OAuth support - under development 🚧
• OTP (One-Time Password) support - emails are sent using Resend
• Session management

The project includes a Makefile with various helpful commands:

• make run - Start the FastHTML development server
• make test - Run all tests
• make test-coverage - Run tests with coverage report

Create a new page with automatic routing:

make new-page ROUTE=path/to/your/page

• make init - Initialize development environment
• make clean - Clean up cache and temporary files

• Default components for database table views
• Frontend rendering system for database records
• Enhanced authentication features
• More pre-built UI components