mirror of
https://github.com/fastapi/full-stack-fastapi-template.git
synced 2026-11-03 20:36:27 +00:00
Compare commits
3 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 Sebastián Ramírez
|
5217a7e693 | ||
 Alejandra
|
a33ded45e1 | ||
 dependabot[bot]
|
64221a627e |
+1
-1
@@ -1,11 +1,11 @@
|
||||
.git
|
||||
**/__pycache__
|
||||
**/.venv
|
||||
backend/app/frontend
|
||||
backend/htmlcov
|
||||
frontend/blob-report
|
||||
frontend/dist
|
||||
frontend/node_modules
|
||||
frontend/playwright-report
|
||||
frontend/playwright/.auth
|
||||
frontend/test-results
|
||||
node_modules
|
||||
|
||||
@@ -14,5 +14,7 @@ SMTP_TLS=False
|
||||
SMTP_PORT=1025
|
||||
|
||||
# Postgres
|
||||
POSTGRES_SERVER=localhost
|
||||
POSTGRES_DB=app
|
||||
POSTGRES_USER=postgres
|
||||
POSTGRES_PASSWORD=changethis
|
||||
DATABASE_URL=postgresql://postgres:${POSTGRES_PASSWORD}@localhost:5432/app
|
||||
|
||||
@@ -1,2 +0,0 @@
|
||||
.env
|
||||
!backend/app/frontend/
|
||||
@@ -0,0 +1,25 @@
|
||||
docs:
|
||||
- all:
|
||||
- changed-files:
|
||||
- any-glob-to-any-file:
|
||||
- '**/*.md'
|
||||
- all-globs-to-all-files:
|
||||
- '!frontend/**'
|
||||
- '!backend/**'
|
||||
- '!.github/**'
|
||||
- '!scripts/**'
|
||||
- '!.gitignore'
|
||||
- '!.pre-commit-config.yaml'
|
||||
|
||||
internal:
|
||||
- all:
|
||||
- changed-files:
|
||||
- any-glob-to-any-file:
|
||||
- .github/**
|
||||
- scripts/**
|
||||
- .gitignore
|
||||
- .pre-commit-config.yaml
|
||||
- all-globs-to-all-files:
|
||||
- '!./**/*.md'
|
||||
- '!frontend/**'
|
||||
- '!backend/**'
|
||||
@@ -1,12 +0,0 @@
|
||||
auto-labels:
|
||||
docs:
|
||||
- exclude: frontend/**
|
||||
- exclude: backend/**
|
||||
- exclude: .github/**
|
||||
- exclude: scripts/**
|
||||
- '**/*.md'
|
||||
internal:
|
||||
- .github/**
|
||||
- scripts/**
|
||||
- .gitignore
|
||||
- .pre-commit-config.yaml
|
||||
@@ -28,9 +28,11 @@ jobs:
|
||||
with:
|
||||
python-version-file: ".python-version"
|
||||
- name: Setup uv
|
||||
uses: astral-sh/setup-uv@20cfd1bf945f4377ade1205e4dbc17946fc9a30d # v10.0.1
|
||||
uses: astral-sh/setup-uv@c771a70e6277c0a99b617c7a806ffedaca235ff9 # v9.0.0
|
||||
with:
|
||||
version: "latest-known"
|
||||
# Before upgrading uv version, make sure astral-sh/setup-uv knows its checksum.
|
||||
# See: https://github.com/astral-sh/setup-uv/issues/851#issuecomment-4282017837
|
||||
version: "0.11.18"
|
||||
cache-dependency-glob: |
|
||||
pyproject.toml
|
||||
uv.lock
|
||||
|
||||
@@ -29,9 +29,11 @@ jobs:
|
||||
with:
|
||||
python-version-file: ".python-version"
|
||||
- name: Install uv
|
||||
uses: astral-sh/setup-uv@20cfd1bf945f4377ade1205e4dbc17946fc9a30d # v10.0.1
|
||||
uses: astral-sh/setup-uv@c771a70e6277c0a99b617c7a806ffedaca235ff9 # v9.0.0
|
||||
with:
|
||||
version: "latest-known"
|
||||
# Before upgrading uv version, make sure astral-sh/setup-uv knows its checksum.
|
||||
# See: https://github.com/astral-sh/setup-uv/issues/851#issuecomment-4282017837
|
||||
version: "0.11.18"
|
||||
- name: Extract release details
|
||||
id: release-details
|
||||
run: |
|
||||
|
||||
@@ -1,41 +0,0 @@
|
||||
name: Deploy with Docker Compose
|
||||
|
||||
on:
|
||||
workflow_dispatch:
|
||||
|
||||
permissions:
|
||||
contents: read
|
||||
|
||||
concurrency:
|
||||
group: deploy-docker-compose
|
||||
cancel-in-progress: false
|
||||
|
||||
jobs:
|
||||
deploy:
|
||||
# Do not deploy the template repository, only projects created from it
|
||||
if: github.repository != 'fastapi/full-stack-fastapi-template'
|
||||
runs-on: self-hosted
|
||||
timeout-minutes: 30
|
||||
env:
|
||||
DOMAIN: ${{ vars.DOMAIN }}
|
||||
PROJECT_NAME: ${{ vars.PROJECT_NAME }}
|
||||
SECRET_KEY: ${{ secrets.SECRET_KEY }}
|
||||
FIRST_SUPERUSER: ${{ vars.FIRST_SUPERUSER }}
|
||||
FIRST_SUPERUSER_PASSWORD: ${{ secrets.FIRST_SUPERUSER_PASSWORD }}
|
||||
SMTP_HOST: ${{ vars.SMTP_HOST }}
|
||||
SMTP_USER: ${{ vars.SMTP_USER }}
|
||||
SMTP_PASSWORD: ${{ secrets.SMTP_PASSWORD }}
|
||||
EMAILS_FROM_EMAIL: ${{ vars.EMAILS_FROM_EMAIL }}
|
||||
POSTGRES_PASSWORD: ${{ secrets.POSTGRES_PASSWORD }}
|
||||
SENTRY_DSN: ${{ vars.SENTRY_DSN }}
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
|
||||
with:
|
||||
persist-credentials: false
|
||||
- name: Build
|
||||
run: docker compose -f compose.yml -f compose.deploy.yml build
|
||||
- name: Prepare database
|
||||
run: docker compose -f compose.yml -f compose.deploy.yml run --rm backend bash scripts/prestart.sh
|
||||
- name: Start application
|
||||
run: docker compose -f compose.yml -f compose.deploy.yml up -d
|
||||
@@ -0,0 +1,37 @@
|
||||
name: Deploy to Production
|
||||
|
||||
on:
|
||||
release:
|
||||
types:
|
||||
- published
|
||||
|
||||
permissions:
|
||||
contents: read
|
||||
|
||||
jobs:
|
||||
deploy:
|
||||
environment: production
|
||||
# Do not deploy in the main repository, only in user projects
|
||||
if: github.repository_owner != 'fastapi'
|
||||
runs-on:
|
||||
- self-hosted
|
||||
- production
|
||||
env:
|
||||
DOMAIN: ${{ secrets.DOMAIN }}
|
||||
SECRET_KEY: ${{ secrets.SECRET_KEY }}
|
||||
FIRST_SUPERUSER: ${{ secrets.FIRST_SUPERUSER }}
|
||||
FIRST_SUPERUSER_PASSWORD: ${{ secrets.FIRST_SUPERUSER_PASSWORD }}
|
||||
SMTP_HOST: ${{ secrets.SMTP_HOST }}
|
||||
SMTP_USER: ${{ secrets.SMTP_USER }}
|
||||
SMTP_PASSWORD: ${{ secrets.SMTP_PASSWORD }}
|
||||
EMAILS_FROM_EMAIL: ${{ secrets.EMAILS_FROM_EMAIL }}
|
||||
POSTGRES_PASSWORD: ${{ secrets.POSTGRES_PASSWORD }}
|
||||
SENTRY_DSN: ${{ secrets.SENTRY_DSN }}
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
|
||||
with:
|
||||
persist-credentials: false
|
||||
- run: docker compose -f compose.yml -f compose.deploy.yml build
|
||||
- run: docker compose -f compose.yml -f compose.deploy.yml run --rm backend bash scripts/prestart.sh
|
||||
- run: docker compose -f compose.yml -f compose.deploy.yml up -d
|
||||
@@ -0,0 +1,37 @@
|
||||
name: Deploy to Staging
|
||||
|
||||
on:
|
||||
push:
|
||||
branches:
|
||||
- master
|
||||
|
||||
permissions:
|
||||
contents: read
|
||||
|
||||
jobs:
|
||||
deploy:
|
||||
environment: staging
|
||||
# Do not deploy in the main repository, only in user projects
|
||||
if: github.repository_owner != 'fastapi'
|
||||
runs-on:
|
||||
- self-hosted
|
||||
- staging
|
||||
env:
|
||||
DOMAIN: ${{ secrets.DOMAIN }}
|
||||
SECRET_KEY: ${{ secrets.SECRET_KEY }}
|
||||
FIRST_SUPERUSER: ${{ secrets.FIRST_SUPERUSER }}
|
||||
FIRST_SUPERUSER_PASSWORD: ${{ secrets.FIRST_SUPERUSER_PASSWORD }}
|
||||
SMTP_HOST: ${{ secrets.SMTP_HOST }}
|
||||
SMTP_USER: ${{ secrets.SMTP_USER }}
|
||||
SMTP_PASSWORD: ${{ secrets.SMTP_PASSWORD }}
|
||||
EMAILS_FROM_EMAIL: ${{ secrets.EMAILS_FROM_EMAIL }}
|
||||
POSTGRES_PASSWORD: ${{ secrets.POSTGRES_PASSWORD }}
|
||||
SENTRY_DSN: ${{ secrets.SENTRY_DSN }}
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
|
||||
with:
|
||||
persist-credentials: false
|
||||
- run: docker compose -f compose.yml -f compose.deploy.yml build
|
||||
- run: docker compose -f compose.yml -f compose.deploy.yml run --rm backend bash scripts/prestart.sh
|
||||
- run: docker compose -f compose.yml -f compose.deploy.yml up -d
|
||||
@@ -1,54 +0,0 @@
|
||||
name: Deploy
|
||||
|
||||
on:
|
||||
push:
|
||||
branches:
|
||||
- master
|
||||
paths-ignore:
|
||||
- release-notes.md
|
||||
workflow_dispatch:
|
||||
|
||||
permissions:
|
||||
contents: read
|
||||
|
||||
jobs:
|
||||
deploy:
|
||||
# Do not deploy the template repository, only projects created from it
|
||||
if: github.repository != 'fastapi/full-stack-fastapi-template'
|
||||
runs-on: ubuntu-latest
|
||||
timeout-minutes: 15
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
|
||||
with:
|
||||
fetch-depth: 0
|
||||
persist-credentials: false
|
||||
- name: Set up Bun
|
||||
uses: oven-sh/setup-bun@0c5077e51419868618aeaa5fe8019c62421857d6 # v2.2.0
|
||||
with:
|
||||
bun-version: 1.3.12
|
||||
- name: Install frontend dependencies
|
||||
run: bun ci
|
||||
- name: Build frontend
|
||||
run: bun run --filter frontend build
|
||||
env:
|
||||
# Override frontend/.env so the deployed frontend uses the same origin as the API
|
||||
VITE_API_URL: ""
|
||||
- name: Set up uv
|
||||
uses: astral-sh/setup-uv@20cfd1bf945f4377ade1205e4dbc17946fc9a30d # v10.0.1
|
||||
with:
|
||||
version: "latest-known"
|
||||
- name: Prepare database
|
||||
run: uv run bash scripts/prestart.sh
|
||||
working-directory: backend
|
||||
env:
|
||||
DATABASE_URL: ${{ secrets.DATABASE_URL }}
|
||||
PROJECT_NAME: ${{ vars.PROJECT_NAME }}
|
||||
SECRET_KEY: ${{ secrets.SECRET_KEY }}
|
||||
FIRST_SUPERUSER: ${{ vars.FIRST_SUPERUSER }}
|
||||
FIRST_SUPERUSER_PASSWORD: ${{ secrets.FIRST_SUPERUSER_PASSWORD }}
|
||||
- name: Deploy to FastAPI Cloud
|
||||
run: uv run fastapi deploy
|
||||
env:
|
||||
FASTAPI_CLOUD_TOKEN: ${{ secrets.FASTAPI_CLOUD_TOKEN }}
|
||||
FASTAPI_CLOUD_APP_ID: ${{ secrets.FASTAPI_CLOUD_APP_ID }}
|
||||
@@ -0,0 +1,20 @@
|
||||
name: Labels
|
||||
on:
|
||||
pull_request_target: # zizmor: ignore[dangerous-triggers]
|
||||
types:
|
||||
- opened
|
||||
- synchronize
|
||||
- reopened
|
||||
|
||||
permissions: {}
|
||||
|
||||
jobs:
|
||||
labeler:
|
||||
permissions:
|
||||
contents: read
|
||||
pull-requests: write
|
||||
runs-on: ubuntu-latest
|
||||
timeout-minutes: 5
|
||||
steps:
|
||||
- uses: actions/labeler@bf12e9b00b37c5c0ca2b87b79b2daf7891dbda13 # v7.0.0
|
||||
- run: echo "Done adding labels"
|
||||
@@ -66,9 +66,11 @@ jobs:
|
||||
with:
|
||||
limit-access-to-actor: true
|
||||
- name: Install uv
|
||||
uses: astral-sh/setup-uv@20cfd1bf945f4377ade1205e4dbc17946fc9a30d # v10.0.1
|
||||
uses: astral-sh/setup-uv@c771a70e6277c0a99b617c7a806ffedaca235ff9 # v9.0.0
|
||||
with:
|
||||
version: "latest-known"
|
||||
# Before upgrading uv version, make sure astral-sh/setup-uv knows its checksum.
|
||||
# See: https://github.com/astral-sh/setup-uv/issues/851#issuecomment-4282017837
|
||||
version: "0.11.18"
|
||||
- run: uv sync
|
||||
working-directory: backend
|
||||
- run: bun ci
|
||||
|
||||
@@ -46,9 +46,11 @@ jobs:
|
||||
with:
|
||||
python-version-file: .python-version
|
||||
- name: Setup uv
|
||||
uses: astral-sh/setup-uv@20cfd1bf945f4377ade1205e4dbc17946fc9a30d # v10.0.1
|
||||
uses: astral-sh/setup-uv@c771a70e6277c0a99b617c7a806ffedaca235ff9 # v9.0.0
|
||||
with:
|
||||
version: "latest-known"
|
||||
# Before upgrading uv version, make sure astral-sh/setup-uv knows its checksum.
|
||||
# See: https://github.com/astral-sh/setup-uv/issues/851#issuecomment-4282017837
|
||||
version: "0.11.18"
|
||||
cache-dependency-glob: |
|
||||
requirements**.txt
|
||||
pyproject.toml
|
||||
|
||||
@@ -38,9 +38,11 @@ jobs:
|
||||
with:
|
||||
python-version-file: ".python-version"
|
||||
- name: Install uv
|
||||
uses: astral-sh/setup-uv@20cfd1bf945f4377ade1205e4dbc17946fc9a30d # v10.0.1
|
||||
uses: astral-sh/setup-uv@c771a70e6277c0a99b617c7a806ffedaca235ff9 # v9.0.0
|
||||
with:
|
||||
version: "latest-known"
|
||||
# Before upgrading uv version, make sure astral-sh/setup-uv knows its checksum.
|
||||
# See: https://github.com/astral-sh/setup-uv/issues/851#issuecomment-4282017837
|
||||
version: "0.11.18"
|
||||
- name: Prepare release
|
||||
env:
|
||||
BUMP: ${{ inputs.bump }}
|
||||
|
||||
@@ -24,9 +24,11 @@ jobs:
|
||||
with:
|
||||
python-version-file: .python-version
|
||||
- name: Setup uv
|
||||
uses: astral-sh/setup-uv@20cfd1bf945f4377ade1205e4dbc17946fc9a30d # v10.0.1
|
||||
uses: astral-sh/setup-uv@c771a70e6277c0a99b617c7a806ffedaca235ff9 # v9.0.0
|
||||
with:
|
||||
version: "latest-known"
|
||||
# Before upgrading uv version, make sure astral-sh/setup-uv knows its checksum.
|
||||
# See: https://github.com/astral-sh/setup-uv/issues/851#issuecomment-4282017837
|
||||
version: "0.11.18"
|
||||
cache-dependency-glob: |
|
||||
pyproject.toml
|
||||
uv.lock
|
||||
|
||||
@@ -22,11 +22,13 @@ jobs:
|
||||
with:
|
||||
python-version-file: .python-version
|
||||
- name: Install uv
|
||||
uses: astral-sh/setup-uv@20cfd1bf945f4377ade1205e4dbc17946fc9a30d # v10.0.1
|
||||
uses: astral-sh/setup-uv@c771a70e6277c0a99b617c7a806ffedaca235ff9 # v9.0.0
|
||||
with:
|
||||
version: "latest-known"
|
||||
# Before upgrading uv version, make sure astral-sh/setup-uv knows its checksum.
|
||||
# See: https://github.com/astral-sh/setup-uv/issues/851#issuecomment-4282017837
|
||||
version: "0.11.18"
|
||||
- run: docker compose down -v --remove-orphans
|
||||
- run: docker compose up -d db mailpit
|
||||
- run: docker compose up -d db mailcatcher
|
||||
- name: Migrate DB
|
||||
run: uv run bash scripts/prestart.sh
|
||||
working-directory: backend
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
# Full Stack FastAPI Template
|
||||
|
||||
[](../../actions/workflows/test-docker-compose.yml)
|
||||
[](../../actions/workflows/test-backend.yml)
|
||||
<a href="https://github.com/fastapi/full-stack-fastapi-template/actions?query=workflow%3A%22Test+Docker+Compose%22" target="_blank"><img src="https://github.com/fastapi/full-stack-fastapi-template/workflows/Test%20Docker%20Compose/badge.svg" alt="Test Docker Compose"></a>
|
||||
<a href="https://github.com/fastapi/full-stack-fastapi-template/actions?query=workflow%3A%22Test+Backend%22" target="_blank"><img src="https://github.com/fastapi/full-stack-fastapi-template/workflows/Test%20Backend/badge.svg" alt="Test Backend"></a>
|
||||
<a href="https://coverage-badge.samuelcolvin.workers.dev/redirect/fastapi/full-stack-fastapi-template" target="_blank"><img src="https://coverage-badge.samuelcolvin.workers.dev/fastapi/full-stack-fastapi-template.svg" alt="Coverage"></a>
|
||||
|
||||
## Technology Stack and Features
|
||||
|
||||
@@ -10,54 +11,141 @@
|
||||
- 🔍 [Pydantic](https://docs.pydantic.dev), used by FastAPI, for the data validation and settings management.
|
||||
- 💾 [PostgreSQL](https://www.postgresql.org) as the SQL database.
|
||||
- 🚀 [React](https://react.dev) for the frontend.
|
||||
- 🧩 Built into the backend application and served by FastAPI on the same domain as the API.
|
||||
- 🧩 Built into the backend image and served by FastAPI on the same domain as the API.
|
||||
- 💃 Using TypeScript, hooks, [Vite](https://vitejs.dev), and other parts of a modern frontend stack.
|
||||
- 🎨 [Tailwind CSS](https://tailwindcss.com) and [shadcn/ui](https://ui.shadcn.com) for the frontend components.
|
||||
- 🤖 An automatically generated frontend client.
|
||||
- 🧪 [Playwright](https://playwright.dev) for end-to-end testing.
|
||||
- 🧪 [Playwright](https://playwright.dev) for End-to-End testing.
|
||||
- 🦇 Dark mode support.
|
||||
- ☁️ [FastAPI Cloud](https://fastapicloud.com) for deployment.
|
||||
- 🐋 [Docker Compose](https://www.docker.com) for local services and self-hosted deployment.
|
||||
- 📞 [Traefik](https://traefik.io) as a reverse proxy with automatic HTTPS.
|
||||
- 🐋 [Docker Compose](https://www.docker.com) for local services and deployment.
|
||||
- 🔒 Secure password hashing by default.
|
||||
- 🔑 JWT (JSON Web Token) authentication.
|
||||
- 📫 Email-based password recovery.
|
||||
- ✉️ [React Email](https://react.email) for email templates.
|
||||
- 📬 [Mailpit](https://mailpit.axllent.org) for local email testing during development.
|
||||
- 📫 Email based password recovery.
|
||||
- 📬 [Mailcatcher](https://mailcatcher.me) for local email testing during development.
|
||||
- ✅ Tests with [Pytest](https://pytest.org).
|
||||
- 📞 [Traefik](https://traefik.io) as a reverse proxy / load balancer.
|
||||
- 🚢 Deployment instructions using Docker Compose with automatic HTTPS provided by Traefik.
|
||||
- 🏭 CI (continuous integration) and CD (continuous deployment) based on GitHub Actions.
|
||||
|
||||
### Dashboard Login
|
||||
|
||||
|
||||
[](https://github.com/fastapi/full-stack-fastapi-template)
|
||||
|
||||
### Dashboard - Admin
|
||||
|
||||
|
||||
[](https://github.com/fastapi/full-stack-fastapi-template)
|
||||
|
||||
### Dashboard - Items
|
||||
|
||||
|
||||
[](https://github.com/fastapi/full-stack-fastapi-template)
|
||||
|
||||
### Dashboard - Dark Mode
|
||||
|
||||
|
||||
|
||||
### React Email Templates
|
||||
|
||||
|
||||
|
||||
### Mailpit - Local Email Testing
|
||||
|
||||
|
||||
[](https://github.com/fastapi/full-stack-fastapi-template)
|
||||
|
||||
### Interactive API Documentation
|
||||
|
||||
|
||||
[](https://github.com/fastapi/full-stack-fastapi-template)
|
||||
|
||||
## How to Use It
|
||||
## How To Use It
|
||||
|
||||
Click the **Use this template** button at the top of this page to create a new repository.
|
||||
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`:
|
||||
|
||||
```bash
|
||||
git clone git@github.com:fastapi/full-stack-fastapi-template.git my-full-stack
|
||||
```
|
||||
|
||||
- Enter into the new directory:
|
||||
|
||||
```bash
|
||||
cd my-full-stack
|
||||
```
|
||||
|
||||
- Set the new origin to your new repository, copy it from the GitHub interface, for example:
|
||||
|
||||
```bash
|
||||
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:
|
||||
|
||||
```bash
|
||||
git remote add upstream git@github.com:fastapi/full-stack-fastapi-template.git
|
||||
```
|
||||
|
||||
- Push the code to your new repository:
|
||||
|
||||
```bash
|
||||
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:
|
||||
|
||||
```bash
|
||||
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:
|
||||
|
||||
```bash
|
||||
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:
|
||||
|
||||
```bash
|
||||
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](./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:
|
||||
|
||||
```bash
|
||||
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.
|
||||
|
||||
## Backend Development
|
||||
|
||||
@@ -69,15 +157,13 @@ Frontend docs: [frontend/README.md](./frontend/README.md).
|
||||
|
||||
## Deployment
|
||||
|
||||
FastAPI Cloud deployment: [deployment.md](./deployment.md).
|
||||
|
||||
Self-hosted deployment with Docker Compose: [deployment-docker-compose.md](./deployment-docker-compose.md).
|
||||
Deployment docs: [deployment.md](./deployment.md).
|
||||
|
||||
## Development
|
||||
|
||||
General development docs: [development.md](./development.md).
|
||||
|
||||
This includes the local FastAPI and Vite workflow, Docker Compose services, `.env` configuration, and more.
|
||||
This includes the local FastAPI and Vite workflow, Docker Compose services, custom local domains, `.env` configuration, and more.
|
||||
|
||||
## Release Notes
|
||||
|
||||
|
||||
+10
-10
@@ -9,10 +9,10 @@
|
||||
|
||||
Run the backend locally and connect it to PostgreSQL in Docker Compose.
|
||||
|
||||
From the project root, start PostgreSQL and Mailpit:
|
||||
From the project root, start PostgreSQL and Mailcatcher:
|
||||
|
||||
```console
|
||||
$ docker compose up -d db mailpit
|
||||
$ docker compose up -d db mailcatcher
|
||||
```
|
||||
|
||||
Then, from `./backend/`, install the dependencies, prepare the database, and start the development server:
|
||||
@@ -58,19 +58,19 @@ To open a shell in the backend container:
|
||||
$ docker compose exec backend bash
|
||||
```
|
||||
|
||||
## Backend Tests
|
||||
## Backend tests
|
||||
|
||||
To test the backend from the `backend` directory, run:
|
||||
|
||||
```console
|
||||
$ uv run bash scripts/test.sh
|
||||
$ uv run bash ./scripts/test.sh
|
||||
```
|
||||
|
||||
The tests run with Pytest. Modify existing tests or add new ones in `./backend/tests/`.
|
||||
The tests run with Pytest, modify and add tests to `./backend/tests/`.
|
||||
|
||||
If you use GitHub Actions, the tests will run automatically.
|
||||
If you use GitHub Actions the tests will run automatically.
|
||||
|
||||
### Test a Running Stack
|
||||
### Test running stack
|
||||
|
||||
If your stack is already up and you just want to run the tests, you can use:
|
||||
|
||||
@@ -78,7 +78,7 @@ If your stack is already up and you just want to run the tests, you can use:
|
||||
docker compose exec backend bash scripts/tests-start.sh
|
||||
```
|
||||
|
||||
The `/app/backend/scripts/tests-start.sh` script calls `pytest` after making sure that the rest of the stack is running. If you need to pass extra arguments to `pytest`, you can pass them to that command and they will be forwarded.
|
||||
That `/app/scripts/tests-start.sh` script just calls `pytest` after making sure that the rest of the stack is running. If you need to pass extra arguments to `pytest`, you can pass them to that command and they will be forwarded.
|
||||
|
||||
For example, to stop on first error:
|
||||
|
||||
@@ -88,7 +88,7 @@ docker compose exec backend bash scripts/tests-start.sh -x
|
||||
|
||||
### Test Coverage
|
||||
|
||||
When the tests run, they generate `htmlcov/index.html`. Open it in your browser to inspect the test coverage.
|
||||
When the tests are run, a file `htmlcov/index.html` is generated, you can open it in your browser to see the coverage of the tests.
|
||||
|
||||
## Migrations
|
||||
|
||||
@@ -128,7 +128,7 @@ If you don't want to start with the default models and want to remove them / mod
|
||||
|
||||
The email templates are written with [React Email](https://react.email) in `./packages/react-email/`. The `emails` directory holds one component per email and the `ui` directory holds the shared components (layout, heading, button, link, callout).
|
||||
|
||||
The rendered HTML in `./backend/app/email-templates/` is generated from those components. It is what the application sends and should not be edited by hand.
|
||||
The rendered HTML in `./backend/app/email-templates/` is generated from those components, it is what the application sends, and it shouldn't be edited by hand.
|
||||
|
||||
To preview the emails while editing them, start the dev server from the root of the project:
|
||||
|
||||
|
||||
@@ -31,7 +31,7 @@ target_metadata = SQLModel.metadata
|
||||
|
||||
|
||||
def get_url():
|
||||
return str(settings.DATABASE_URL)
|
||||
return str(settings.SQLALCHEMY_DATABASE_URI)
|
||||
|
||||
|
||||
def run_migrations_offline():
|
||||
|
||||
+17
-12
@@ -6,7 +6,6 @@ from pydantic import (
|
||||
HttpUrl,
|
||||
PostgresDsn,
|
||||
computed_field,
|
||||
field_validator,
|
||||
model_validator,
|
||||
)
|
||||
from pydantic_settings import BaseSettings, SettingsConfigDict
|
||||
@@ -28,16 +27,23 @@ class Settings(BaseSettings):
|
||||
|
||||
PROJECT_NAME: str
|
||||
SENTRY_DSN: HttpUrl | None = None
|
||||
DATABASE_URL: PostgresDsn
|
||||
POSTGRES_SERVER: str
|
||||
POSTGRES_PORT: int = 5432
|
||||
POSTGRES_USER: str
|
||||
POSTGRES_PASSWORD: str = ""
|
||||
POSTGRES_DB: str = ""
|
||||
|
||||
@field_validator("DATABASE_URL", mode="before")
|
||||
@classmethod
|
||||
def _use_psycopg_driver(cls, value: str | PostgresDsn) -> str:
|
||||
database_url = str(value)
|
||||
for scheme in ("postgres://", "postgresql://"):
|
||||
if database_url.startswith(scheme):
|
||||
return database_url.replace(scheme, "postgresql+psycopg://", 1)
|
||||
return database_url
|
||||
@computed_field # type: ignore[prop-decorator]
|
||||
@property
|
||||
def SQLALCHEMY_DATABASE_URI(self) -> PostgresDsn:
|
||||
return PostgresDsn.build(
|
||||
scheme="postgresql+psycopg",
|
||||
username=self.POSTGRES_USER,
|
||||
password=self.POSTGRES_PASSWORD,
|
||||
host=self.POSTGRES_SERVER,
|
||||
port=self.POSTGRES_PORT,
|
||||
path=self.POSTGRES_DB,
|
||||
)
|
||||
|
||||
SMTP_TLS: bool = True
|
||||
SMTP_SSL: bool = False
|
||||
@@ -79,8 +85,7 @@ class Settings(BaseSettings):
|
||||
@model_validator(mode="after")
|
||||
def _enforce_non_default_secrets(self) -> Self:
|
||||
self._check_default_secret("SECRET_KEY", self.SECRET_KEY)
|
||||
for host in self.DATABASE_URL.hosts():
|
||||
self._check_default_secret("DATABASE_URL password", host["password"])
|
||||
self._check_default_secret("POSTGRES_PASSWORD", self.POSTGRES_PASSWORD)
|
||||
self._check_default_secret(
|
||||
"FIRST_SUPERUSER_PASSWORD", self.FIRST_SUPERUSER_PASSWORD
|
||||
)
|
||||
|
||||
@@ -4,7 +4,7 @@ from app import crud
|
||||
from app.core.config import settings
|
||||
from app.models import User, UserCreate
|
||||
|
||||
engine = create_engine(str(settings.DATABASE_URL))
|
||||
engine = create_engine(str(settings.SQLALCHEMY_DATABASE_URI))
|
||||
|
||||
|
||||
# make sure all SQLModel models are imported (app.models) before initializing DB
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -33,6 +33,7 @@
|
||||
"clsx": "^2.1.1",
|
||||
"form-data": "4.0.6",
|
||||
"lucide-react": "^1.28.0",
|
||||
"next-themes": "^0.4.6",
|
||||
"react": "^19.2.8",
|
||||
"react-dom": "^19.2.8",
|
||||
"react-error-boundary": "^6.1.2",
|
||||
@@ -843,6 +844,8 @@
|
||||
|
||||
"next": ["next@16.2.6", "", { "dependencies": { "@next/env": "16.2.6", "@swc/helpers": "0.5.15", "baseline-browser-mapping": "^2.9.19", "caniuse-lite": "^1.0.30001579", "postcss": "8.4.31", "styled-jsx": "5.1.6" }, "optionalDependencies": { "@next/swc-darwin-arm64": "16.2.6", "@next/swc-darwin-x64": "16.2.6", "@next/swc-linux-arm64-gnu": "16.2.6", "@next/swc-linux-arm64-musl": "16.2.6", "@next/swc-linux-x64-gnu": "16.2.6", "@next/swc-linux-x64-musl": "16.2.6", "@next/swc-win32-arm64-msvc": "16.2.6", "@next/swc-win32-x64-msvc": "16.2.6", "sharp": "^0.34.5" }, "peerDependencies": { "@opentelemetry/api": "^1.1.0", "@playwright/test": "^1.51.1", "babel-plugin-react-compiler": "*", "react": "^18.2.0 || 19.0.0-rc-de68d2f4-20241204 || ^19.0.0", "react-dom": "^18.2.0 || 19.0.0-rc-de68d2f4-20241204 || ^19.0.0", "sass": "^1.3.0" }, "optionalPeers": ["@opentelemetry/api", "@playwright/test", "babel-plugin-react-compiler", "sass"], "bin": { "next": "dist/bin/next" } }, "sha512-qOVgKJg1+At15NpeUP+eJgCHvTCgXsogweq87Ri/Ix7PkqQHg4sdaXmSFqKlgaIXE4kW0g25LE68W87UANlHtw=="],
|
||||
|
||||
"next-themes": ["next-themes@0.4.6", "", { "peerDependencies": { "react": "^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc", "react-dom": "^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc" } }, "sha512-pZvgD5L0IEvX5/9GWyHMf3m8BKiVQwsCMHfoFosXtXBMnaS0ZnIJ9ST4b4NqLVKDEm8QBxoNNGNaBv2JNF6XNA=="],
|
||||
|
||||
"node-releases": ["node-releases@2.0.27", "", {}, "sha512-nmh3lCkYZ3grZvqcCH+fjmQ7X+H0OeZgP40OierEaAptX4XofMh5kwNbWh7lBduUzCcV/8kZ+NDLCwm2iorIlA=="],
|
||||
|
||||
"normalize-path": ["normalize-path@3.0.0", "", {}, "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA=="],
|
||||
|
||||
@@ -64,14 +64,14 @@ services:
|
||||
- ./backend/htmlcov:/app/backend/htmlcov
|
||||
environment:
|
||||
FASTAPI_ENV: "development"
|
||||
SMTP_HOST: "mailpit"
|
||||
SMTP_HOST: "mailcatcher"
|
||||
SMTP_PORT: "1025"
|
||||
SMTP_TLS: "false"
|
||||
|
||||
mailpit:
|
||||
image: axllent/mailpit
|
||||
mailcatcher:
|
||||
image: schickling/mailcatcher
|
||||
ports:
|
||||
- "8025:8025"
|
||||
- "1080:1080"
|
||||
- "1025:1025"
|
||||
|
||||
playwright:
|
||||
@@ -83,13 +83,13 @@ services:
|
||||
ipc: host
|
||||
depends_on:
|
||||
- backend
|
||||
- mailpit
|
||||
- mailcatcher
|
||||
environment:
|
||||
- FIRST_SUPERUSER=${FIRST_SUPERUSER:?Variable not set}
|
||||
- FIRST_SUPERUSER_PASSWORD=${FIRST_SUPERUSER_PASSWORD:?Variable not set}
|
||||
- PLAYWRIGHT_BASE_URL=http://backend:8000
|
||||
- VITE_API_URL=http://backend:8000
|
||||
- MAILPIT_HOST=http://mailpit:8025
|
||||
- MAILCATCHER_HOST=http://mailcatcher:1080
|
||||
# For the reports when run locally
|
||||
- PLAYWRIGHT_HTML_HOST=0.0.0.0
|
||||
- CI=${CI:-}
|
||||
|
||||
+7
-3
@@ -20,7 +20,7 @@ services:
|
||||
db:
|
||||
image: postgres:18
|
||||
healthcheck:
|
||||
test: ["CMD-SHELL", "pg_isready -U postgres -d app"]
|
||||
test: ["CMD-SHELL", "pg_isready -U ${POSTGRES_USER} -d ${POSTGRES_DB}"]
|
||||
interval: 10s
|
||||
retries: 5
|
||||
start_period: 30s
|
||||
@@ -29,7 +29,8 @@ services:
|
||||
- app-db-data:/var/lib/postgresql
|
||||
environment:
|
||||
- POSTGRES_PASSWORD=${POSTGRES_PASSWORD:?Variable not set}
|
||||
- POSTGRES_DB=app
|
||||
- POSTGRES_USER=${POSTGRES_USER:?Variable not set}
|
||||
- POSTGRES_DB=${POSTGRES_DB:?Variable not set}
|
||||
|
||||
adminer:
|
||||
image: adminer
|
||||
@@ -61,7 +62,10 @@ services:
|
||||
SMTP_USER: ${SMTP_USER:-}
|
||||
SMTP_PASSWORD: ${SMTP_PASSWORD:-}
|
||||
EMAILS_FROM_EMAIL: ${EMAILS_FROM_EMAIL}
|
||||
DATABASE_URL: postgresql://postgres:${POSTGRES_PASSWORD:?Variable not set}@db:5432/app
|
||||
POSTGRES_SERVER: db
|
||||
POSTGRES_DB: ${POSTGRES_DB:?Variable not set}
|
||||
POSTGRES_USER: ${POSTGRES_USER:?Variable not set}
|
||||
POSTGRES_PASSWORD: ${POSTGRES_PASSWORD:?Variable not set}
|
||||
SENTRY_DSN: ${SENTRY_DSN:-}
|
||||
|
||||
healthcheck:
|
||||
|
||||
@@ -1,129 +0,0 @@
|
||||
# FastAPI Project - Docker Compose Deployment
|
||||
|
||||
You can deploy the project to your own remote server with Docker Compose. The deployment configuration includes Traefik to handle HTTPS and route incoming traffic to the application.
|
||||
|
||||
## Preparation
|
||||
|
||||
* Have a remote server ready and available.
|
||||
* Configure DNS records pointing to the server for the application domain and any supporting service subdomains you want to expose, such as `fastapi-project.example.com` and `adminer.fastapi-project.example.com`.
|
||||
* Install and configure [Docker](https://docs.docker.com/engine/install/) on the remote server (Docker Engine, not Docker Desktop).
|
||||
|
||||
## Copy the Code
|
||||
|
||||
```bash
|
||||
rsync -av --exclude=".git/" --filter=":- .gitignore" ./ root@your-server.example.com:/root/code/app/
|
||||
```
|
||||
|
||||
The `--filter=":- .gitignore"` option tells `rsync` to use the same ignore rules as Git, excluding files such as the Python virtual environment.
|
||||
|
||||
## Configure the Application
|
||||
|
||||
### Environment Variables
|
||||
|
||||
Set the application domain, project name, and first superuser email:
|
||||
|
||||
```bash
|
||||
export DOMAIN=fastapi-project.example.com
|
||||
export PROJECT_NAME="Full Stack FastAPI Project"
|
||||
export FIRST_SUPERUSER=admin@example.com
|
||||
```
|
||||
|
||||
You can also configure these environment variables as needed:
|
||||
|
||||
* `SMTP_HOST`: The SMTP server host from your email provider.
|
||||
* `SMTP_USER`: The SMTP server user.
|
||||
* `EMAILS_FROM_EMAIL`: The email account used to send emails.
|
||||
* `SENTRY_DSN`: The DSN for Sentry.
|
||||
|
||||
### Secrets
|
||||
|
||||
Generate and set secure values for the database password, token signing key, and first superuser password:
|
||||
|
||||
```bash
|
||||
export POSTGRES_PASSWORD="$(python -c 'import secrets; print(secrets.token_urlsafe(32))')"
|
||||
export SECRET_KEY="$(python -c 'import secrets; print(secrets.token_urlsafe(32))')"
|
||||
export FIRST_SUPERUSER_PASSWORD="$(python -c 'import secrets; print(secrets.token_urlsafe(32))')"
|
||||
```
|
||||
|
||||
To use an authenticated email provider, also set `SMTP_PASSWORD`.
|
||||
|
||||
## Deploy
|
||||
|
||||
```bash
|
||||
cd /root/code/app/
|
||||
docker compose -f compose.yml -f compose.deploy.yml build
|
||||
docker compose -f compose.yml -f compose.deploy.yml run --rm backend bash scripts/prestart.sh
|
||||
docker compose -f compose.yml -f compose.deploy.yml up -d
|
||||
```
|
||||
|
||||
The `compose.deploy.yml` file adds HTTPS and automatic certificate handling to the shared `compose.yml` configuration. Explicitly listing both files excludes the local settings from `compose.override.yml`.
|
||||
|
||||
The backend Docker image builds the frontend, so the server does not need Bun or prebuilt frontend files.
|
||||
|
||||
## Deploy with GitHub Actions
|
||||
|
||||
The included `.github/workflows/deploy-docker-compose.yml` workflow runs the deployment commands on the server when manually triggered from GitHub Actions.
|
||||
|
||||
Use a self-hosted runner only for a repository whose contributors and workflow code you trust. GitHub recommends using self-hosted runners with private repositories because workflows execute directly on the runner machine.
|
||||
|
||||
### Configure Repository Variables and Secrets
|
||||
|
||||
In the repository, go to **Settings** > **Secrets and variables** > **Actions** and add these repository variables:
|
||||
|
||||
* `DOMAIN`
|
||||
* `PROJECT_NAME`
|
||||
* `FIRST_SUPERUSER`
|
||||
|
||||
To enable emails, add these optional repository variables:
|
||||
|
||||
* `SMTP_HOST`
|
||||
* `SMTP_USER`
|
||||
* `EMAILS_FROM_EMAIL`
|
||||
|
||||
To enable Sentry, add the optional `SENTRY_DSN` repository variable.
|
||||
|
||||
Add these repository secrets:
|
||||
|
||||
* `POSTGRES_PASSWORD`
|
||||
* `SECRET_KEY`
|
||||
* `FIRST_SUPERUSER_PASSWORD`
|
||||
|
||||
To use an authenticated email provider, add the optional `SMTP_PASSWORD` repository secret.
|
||||
|
||||
### Install a Self-Hosted Runner
|
||||
|
||||
On the server, create a dedicated user and grant it access to Docker:
|
||||
|
||||
```bash
|
||||
sudo adduser github
|
||||
sudo usermod -aG docker github
|
||||
sudo su - github
|
||||
```
|
||||
|
||||
In the GitHub repository, go to **Settings** > **Actions** > **Runners**, select **New self-hosted runner**, choose Linux, and follow the commands GitHub provides to download, configure, and register the runner. Install it in `/home/github/actions-runner`.
|
||||
|
||||
After registering the runner, exit the `github` user session and install the runner as a system service:
|
||||
|
||||
```bash
|
||||
exit
|
||||
cd /home/github/actions-runner
|
||||
sudo ./svc.sh install github
|
||||
sudo ./svc.sh start
|
||||
sudo ./svc.sh status
|
||||
```
|
||||
|
||||
See GitHub's guides for [adding a self-hosted runner](https://docs.github.com/en/actions/how-tos/manage-runners/self-hosted-runners/add-runners) and [configuring the runner as a service](https://docs.github.com/en/actions/how-tos/manage-runners/self-hosted-runners/configure-the-application?platform=linux).
|
||||
|
||||
### Run the Deployment
|
||||
|
||||
When the runner is online, open the repository's **Actions** tab, select **Deploy with Docker Compose**, and select **Run workflow**.
|
||||
|
||||
## URLs
|
||||
|
||||
Replace `fastapi-project.example.com` with your domain.
|
||||
|
||||
Application (frontend and API): `https://fastapi-project.example.com`
|
||||
|
||||
Interactive API docs: `https://fastapi-project.example.com/docs`
|
||||
|
||||
Adminer: `https://adminer.fastapi-project.example.com`
|
||||
+203
-51
@@ -1,97 +1,249 @@
|
||||
# FastAPI Project - Deployment
|
||||
|
||||
Deploy the project to [FastAPI Cloud](https://fastapicloud.com) with the included GitHub Actions workflow.
|
||||
You can deploy the project using Docker Compose to a remote server.
|
||||
|
||||
## Create the FastAPI Cloud Application
|
||||
The deployment Docker Compose configuration includes Traefik to handle HTTPS and route incoming traffic to the application.
|
||||
|
||||
Create an application in FastAPI Cloud and set its [Application Directory](https://fastapicloud.com/docs/builds-and-deployments/application-directory/) to `backend`.
|
||||
You can use CI/CD (continuous integration and continuous deployment) systems to deploy automatically, there are already configurations to do it with GitHub Actions.
|
||||
|
||||
Connect a PostgreSQL database using the [Neon](https://fastapicloud.com/docs/integrations/neon-integration/) or [Supabase](https://fastapicloud.com/docs/integrations/supabase-integration/) integration. Both integrations configure a `DATABASE_URL` secret automatically. You can also configure `DATABASE_URL` manually for another PostgreSQL provider.
|
||||
But you have to configure a couple things first. 🤓
|
||||
|
||||
## Configure the Application
|
||||
## Preparation
|
||||
|
||||
### Environment Variables
|
||||
* Have a remote server ready and available. Use a separate server for each environment, for example one for staging and one for production.
|
||||
* Configure DNS records pointing to the server for the application domain and any supporting service subdomains you want to expose, e.g. `fastapi-project.example.com` and `adminer.fastapi-project.example.com`.
|
||||
* Install and configure [Docker](https://docs.docker.com/engine/install/) on the remote server (Docker Engine, not Docker Desktop).
|
||||
|
||||
Add these required [environment variables](https://fastapicloud.com/docs/builds-and-deployments/environment-variables/) to the FastAPI Cloud application:
|
||||
## Deploy the FastAPI Project
|
||||
|
||||
* `PROJECT_NAME`: The name of the project, used in the API documentation and emails.
|
||||
* `FIRST_SUPERUSER`: The email address of the first superuser.
|
||||
* `FRONTEND_HOST`: The public URL of the application, such as the generated `https://your-app.fastapicloud.dev` URL or a custom domain.
|
||||
You can deploy your FastAPI project with Docker Compose.
|
||||
|
||||
To enable emails, add these optional environment variables with values from your email provider:
|
||||
**Note**: You might want to jump ahead to the section about Continuous Deployment with GitHub Actions.
|
||||
|
||||
* `SMTP_HOST`
|
||||
* `SMTP_USER`
|
||||
* `EMAILS_FROM_EMAIL`
|
||||
## Copy the Code
|
||||
|
||||
To enable Sentry, configure `SENTRY_DSN`.
|
||||
```bash
|
||||
rsync -av --exclude=".git/" --filter=":- .gitignore" ./ root@your-server.example.com:/root/code/app/
|
||||
```
|
||||
|
||||
### Secrets
|
||||
Note: `--filter=":- .gitignore"` tells `rsync` to use the same rules as git, ignore files ignored by git, like the Python virtual environment.
|
||||
|
||||
Add these required values and mark them as secrets:
|
||||
## Environment Variables
|
||||
|
||||
* `SECRET_KEY`: A secret key used to sign security tokens.
|
||||
* `FIRST_SUPERUSER_PASSWORD`: The password of the first superuser.
|
||||
* `DATABASE_URL`: The PostgreSQL connection URL, configured automatically when using a database integration.
|
||||
You need to set some environment variables first.
|
||||
|
||||
To enable emails with an authenticated provider, add `SMTP_PASSWORD` as a secret.
|
||||
### Generate secret keys
|
||||
|
||||
You can generate secure values for `SECRET_KEY` and `FIRST_SUPERUSER_PASSWORD` with:
|
||||
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:
|
||||
|
||||
```bash
|
||||
python -c "import secrets; print(secrets.token_urlsafe(32))"
|
||||
```
|
||||
|
||||
## Configure Continuous Deployment
|
||||
Copy the content and use that as password / secret key. And run that again to generate another secure key.
|
||||
|
||||
The included `.github/workflows/deploy.yml` workflow builds the frontend, prepares the database, and deploys the application whenever changes are pushed to `master`. You can also run it manually from the **Actions** tab.
|
||||
### Required Environment Variables
|
||||
|
||||
Log in to FastAPI Cloud and configure the [deploy token](https://fastapicloud.com/docs/advanced-features/deploy-tokens/) and application ID as GitHub repository secrets:
|
||||
Set the `DOMAIN` to your own domain, for example:
|
||||
|
||||
```bash
|
||||
uv run fastapi login
|
||||
uv run fastapi cloud setup-ci --secrets-only --app-id <your-app-id>
|
||||
export DOMAIN=fastapi-project.example.com
|
||||
```
|
||||
|
||||
If the GitHub CLI is installed and authenticated, the command configures `FASTAPI_CLOUD_TOKEN` and `FASTAPI_CLOUD_APP_ID` automatically. Otherwise, it prints the values so you can add them in your repository under **Settings** > **Secrets and variables** > **Actions**.
|
||||
The deployment Docker Compose configuration also uses `DOMAIN` to set the public frontend URL used in links generated by the backend.
|
||||
|
||||
The workflow runs database migrations and creates the first superuser before deploying. In the repository's **Settings** > **Secrets and variables** > **Actions** page, add these repository variables:
|
||||
Set the `POSTGRES_PASSWORD` to a secure value:
|
||||
|
||||
* `PROJECT_NAME`
|
||||
```bash
|
||||
export POSTGRES_PASSWORD="$(python -c 'import secrets; print(secrets.token_urlsafe(32))')"
|
||||
```
|
||||
|
||||
Set the `SECRET_KEY`, used to sign tokens, to a secure value:
|
||||
|
||||
```bash
|
||||
export SECRET_KEY="$(python -c 'import secrets; print(secrets.token_urlsafe(32))')"
|
||||
```
|
||||
|
||||
Set the `FIRST_SUPERUSER_PASSWORD` to a secure value:
|
||||
|
||||
```bash
|
||||
export FIRST_SUPERUSER_PASSWORD="$(python -c 'import secrets; print(secrets.token_urlsafe(32))')"
|
||||
```
|
||||
|
||||
You can set several other environment variables:
|
||||
|
||||
* `PROJECT_NAME`: The name of the project, used in the API for the docs and emails.
|
||||
* `FIRST_SUPERUSER`: The email of the first superuser, this superuser will be the one that can create new users.
|
||||
* `SMTP_HOST`: The SMTP server host to send emails, this would come from your email provider (E.g. Mailgun, Sparkpost, Sendgrid, etc).
|
||||
* `SMTP_USER`: The SMTP server user to send emails.
|
||||
* `SMTP_PASSWORD`: The SMTP server password to send emails.
|
||||
* `EMAILS_FROM_EMAIL`: The email account to send emails from.
|
||||
* `POSTGRES_USER`: The Postgres user, you can leave the default.
|
||||
* `POSTGRES_DB`: The database name to use for this application. You can leave the default of `app`.
|
||||
* `SENTRY_DSN`: The DSN for Sentry, if you are using it.
|
||||
|
||||
## GitHub Actions Environment Variables
|
||||
|
||||
There are some environment variables only used by GitHub Actions that you can configure:
|
||||
|
||||
* `LATEST_CHANGES`: Used by the GitHub Action [latest-changes](https://github.com/tiangolo/latest-changes) to automatically add release notes based on the PRs merged. It's a personal access token, read the docs for details.
|
||||
* `SMOKESHOW_AUTH_KEY`: Used to handle and publish the code coverage using [Smokeshow](https://github.com/samuelcolvin/smokeshow), follow their instructions to create a (free) Smokeshow key.
|
||||
|
||||
### Deploy with Docker Compose
|
||||
|
||||
With the environment variables in place, you can deploy with Docker Compose:
|
||||
|
||||
```bash
|
||||
cd /root/code/app/
|
||||
docker compose -f compose.yml -f compose.deploy.yml build
|
||||
docker compose -f compose.yml -f compose.deploy.yml run --rm backend bash scripts/prestart.sh
|
||||
docker compose -f compose.yml -f compose.deploy.yml up -d
|
||||
```
|
||||
|
||||
The `compose.deploy.yml` file adds the deployment settings to the shared configuration in `compose.yml`, including HTTPS and automatic certificate handling. Explicitly listing these files also excludes the local development settings in `compose.override.yml`.
|
||||
|
||||
## Continuous Deployment (CD)
|
||||
|
||||
You can use GitHub Actions to deploy your project automatically. 😎
|
||||
|
||||
There are already two environment deployments configured, `staging` and `production`. Each environment should be deployed to a separate server. 🚀
|
||||
|
||||
### Install GitHub Actions Runner
|
||||
|
||||
* On your remote server, create a user for your GitHub Actions:
|
||||
|
||||
```bash
|
||||
sudo adduser github
|
||||
```
|
||||
|
||||
* Add Docker permissions to the `github` user:
|
||||
|
||||
```bash
|
||||
sudo usermod -aG docker github
|
||||
```
|
||||
|
||||
* Temporarily switch to the `github` user:
|
||||
|
||||
```bash
|
||||
sudo su - github
|
||||
```
|
||||
|
||||
* Go to the `github` user's home directory:
|
||||
|
||||
```bash
|
||||
cd
|
||||
```
|
||||
|
||||
* [Install a GitHub Action self-hosted runner following the official guide](https://docs.github.com/en/actions/hosting-your-own-runners/managing-self-hosted-runners/adding-self-hosted-runners#adding-a-self-hosted-runner-to-a-repository).
|
||||
|
||||
* When asked about labels, add a label for the environment, e.g. `production`. You can also add labels later.
|
||||
|
||||
After installing, the guide would tell you to run a command to start the runner. Nevertheless, it would stop once you terminate that process or if your local connection to your server is lost.
|
||||
|
||||
To make sure it runs on startup and continues running, you can install it as a service. To do that, exit the `github` user and go back to the `root` user:
|
||||
|
||||
```bash
|
||||
exit
|
||||
```
|
||||
|
||||
After you do it, you will be on the previous user again. And you will be on the previous directory, belonging to that user.
|
||||
|
||||
Before being able to go the `github` user directory, you need to become the `root` user (you might already be):
|
||||
|
||||
```bash
|
||||
sudo su
|
||||
```
|
||||
|
||||
* As the `root` user, go to the `actions-runner` directory inside of the `github` user's home directory:
|
||||
|
||||
```bash
|
||||
cd /home/github/actions-runner
|
||||
```
|
||||
|
||||
* Install the self-hosted runner as a service with the user `github`:
|
||||
|
||||
```bash
|
||||
./svc.sh install github
|
||||
```
|
||||
|
||||
* Start the service:
|
||||
|
||||
```bash
|
||||
./svc.sh start
|
||||
```
|
||||
|
||||
* Check the status of the service:
|
||||
|
||||
```bash
|
||||
./svc.sh status
|
||||
```
|
||||
|
||||
You can read more about it in the official guide: [Configuring the self-hosted runner application as a service](https://docs.github.com/en/actions/hosting-your-own-runners/managing-self-hosted-runners/configuring-the-self-hosted-runner-application-as-a-service).
|
||||
|
||||
### Configure GitHub Environments
|
||||
|
||||
The deployment workflows use [GitHub Environments](https://docs.github.com/en/actions/how-tos/deploy/configure-and-manage-deployments/manage-environments) for `staging` and `production`. This enables environment-specific secrets, deployment protection rules (e.g. required reviewers, wait timers), and deployment status tracking.
|
||||
|
||||
To configure them, go to your repository's **Settings** > **Environments** and create the `staging` and `production` environments.
|
||||
|
||||
### Set Secrets
|
||||
|
||||
For each GitHub Environment (`staging` and `production`), configure the required secrets as [environment secrets](https://docs.github.com/en/actions/how-tos/write-workflows/choose-what-workflows-do/use-secrets#creating-secrets-for-an-environment). Environment secrets are preferred over [repository secrets](https://docs.github.com/en/actions/how-tos/write-workflows/choose-what-workflows-do/use-secrets#creating-secrets-for-a-repository) because they are scoped to the specific environment, reducing exposure and aligning with any protection rules you configure.
|
||||
|
||||
The deployment workflows require these secrets:
|
||||
|
||||
* `DOMAIN`
|
||||
* `FIRST_SUPERUSER`
|
||||
|
||||
Add these repository secrets:
|
||||
|
||||
* `DATABASE_URL`
|
||||
* `SECRET_KEY`
|
||||
* `FIRST_SUPERUSER_PASSWORD`
|
||||
* `POSTGRES_PASSWORD`
|
||||
* `SECRET_KEY`
|
||||
|
||||
Use the same values configured in FastAPI Cloud. For `DATABASE_URL`, use the connection URL from your database provider. The database must be reachable from GitHub-hosted runners so the preparation step can connect to it.
|
||||
To enable emails, configure these additional secrets with the values from your email provider:
|
||||
|
||||
The deployment workflow performs these steps:
|
||||
* `SMTP_HOST`
|
||||
* `SMTP_USER`
|
||||
* `SMTP_PASSWORD`
|
||||
* `EMAILS_FROM_EMAIL`
|
||||
|
||||
1. Installs and builds the frontend into `backend/app/frontend`.
|
||||
2. Runs `backend/scripts/prestart.sh` to apply database migrations and create the first superuser.
|
||||
3. Deploys the project with `uv run fastapi deploy`.
|
||||
To enable Sentry, configure the `SENTRY_DSN` secret.
|
||||
|
||||
## GitHub Action Deployment Workflows
|
||||
|
||||
There are GitHub Action workflows in the `.github/workflows` directory already configured for deploying to the environments (GitHub Actions runners with the labels):
|
||||
|
||||
* `staging`: after pushing (or merging) to the branch `master`.
|
||||
* `production`: after publishing a release.
|
||||
|
||||
Both workflows are associated with their respective GitHub Environments, so deployments will be visible in the repository's **Environments** section and will respect any protection rules you configure.
|
||||
|
||||
### Prepare a Release
|
||||
|
||||
Install the [PR Submit GitHub App](https://github.com/apps/pr-submit) in your repository to enable the **Prepare Release** workflow.
|
||||
|
||||
Run the workflow manually from the **Actions** tab and select the version bump. It creates a pull request that updates the release notes. When you merge that pull request, the **Create Draft Release** workflow creates a draft GitHub release with the corresponding release notes.
|
||||
|
||||
Review and publish the draft release to trigger the production deployment.
|
||||
|
||||
If you need to add extra environments you could use those as a starting point.
|
||||
|
||||
## URLs
|
||||
|
||||
Replace `your-app.fastapicloud.dev` with the URL of your FastAPI Cloud application.
|
||||
Replace `fastapi-project.example.com` with your domain.
|
||||
|
||||
Application (frontend and API): `https://your-app.fastapicloud.dev`
|
||||
### Production
|
||||
|
||||
Interactive API docs: `https://your-app.fastapicloud.dev/docs`
|
||||
Application (frontend and API): `https://fastapi-project.example.com`
|
||||
|
||||
## Docker Compose
|
||||
Interactive API docs: `https://fastapi-project.example.com/docs`
|
||||
|
||||
For deployment to your own server, see the [Docker Compose deployment guide](./deployment-docker-compose.md).
|
||||
Adminer: `https://adminer.fastapi-project.example.com`
|
||||
|
||||
## GitHub Repository Automation
|
||||
### Staging
|
||||
|
||||
Install the following GitHub Apps to enable the included repository automation:
|
||||
Application (frontend and API): `https://staging.fastapi-project.example.com`
|
||||
|
||||
* [Latest Changes](https://github.com/apps/latest-changes) updates `release-notes.md` when a pull request is merged.
|
||||
* [PR Push](https://github.com/apps/pr-push) lets the pre-commit workflow push automated fixes to pull request branches.
|
||||
* [PR Submit](https://github.com/apps/pr-submit) lets the **Bump pre-commit hooks** and **Prepare Release** workflows create pull requests.
|
||||
Interactive API docs: `https://staging.fastapi-project.example.com/docs`
|
||||
|
||||
To publish code coverage with [Smokeshow](https://github.com/samuelcolvin/smokeshow), add `SMOKESHOW_AUTH_KEY` as a repository secret.
|
||||
Adminer: `https://adminer.staging.fastapi-project.example.com`
|
||||
|
||||
+59
-22
@@ -2,12 +2,12 @@
|
||||
|
||||
## Local Development
|
||||
|
||||
For local development, run PostgreSQL and Mailpit with Docker Compose, and run the FastAPI and Vite development servers locally.
|
||||
For local development, run PostgreSQL and Mailcatcher with Docker Compose, and run the FastAPI and Vite development servers locally.
|
||||
|
||||
Start the supporting services:
|
||||
|
||||
```bash
|
||||
docker compose up -d db mailpit
|
||||
docker compose up -d db mailcatcher
|
||||
```
|
||||
|
||||
Then, from the `backend` directory, install the dependencies and prepare the database:
|
||||
@@ -38,7 +38,7 @@ Backend API: <http://localhost:8000>
|
||||
|
||||
Automatic interactive API documentation with Swagger UI: <http://localhost:8000/docs>
|
||||
|
||||
Mailpit: <http://localhost:8025>
|
||||
Mailcatcher: <http://localhost:1080>
|
||||
|
||||
The frontend development server uses the backend at `http://localhost:8000`, as configured in `frontend/.env`.
|
||||
|
||||
@@ -71,21 +71,21 @@ Adminer, database web administration: <http://localhost:8080>
|
||||
|
||||
Traefik UI, to see how the routes are being handled by the proxy: <http://localhost:8090>
|
||||
|
||||
Mailpit: <http://localhost:8025>
|
||||
Mailcatcher: <http://localhost:1080>
|
||||
|
||||
Stop a locally running FastAPI server before starting the Compose backend because both use port `8000`.
|
||||
|
||||
**Note**: The first time you start the stack, it might take a minute for all the services to be ready. To monitor it, use `docker compose logs`, or `docker compose logs backend` for the backend service.
|
||||
|
||||
## Mailpit
|
||||
## Mailcatcher
|
||||
|
||||
[Mailpit](https://mailpit.axllent.org) captures emails sent during local development instead of delivering them. The local backend connects to it at `localhost:1025`, and the Compose backend connects to the `mailpit` service. Captured emails are available at <http://localhost:8025>.
|
||||
Mailcatcher captures emails sent during local development instead of delivering them. The local backend connects to it at `localhost:1025`, and the Compose backend connects to the `mailcatcher` service. Captured emails are available at <http://localhost:1080>.
|
||||
|
||||
## Docker Compose Files and Environment Variables
|
||||
## Docker Compose files and env vars
|
||||
|
||||
The main `compose.yml` file contains the configuration shared by the whole stack. Docker Compose loads it automatically.
|
||||
There is a main `compose.yml` file with all the configurations that apply to the whole stack, it is used automatically by `docker compose`.
|
||||
|
||||
The `compose.override.yml` file adds local development settings, such as mounting the source code as a volume. Docker Compose also loads it automatically and applies it on top of `compose.yml`.
|
||||
And there's also a `compose.override.yml` with overrides for development, for example to mount the source code as a volume. It is used automatically by `docker compose` to apply overrides on top of `compose.yml`.
|
||||
|
||||
The `compose.deploy.yml` file contains the deployment-specific settings, including HTTPS and automatic certificate handling. It is explicitly combined with `compose.yml` when deploying the application.
|
||||
|
||||
@@ -97,42 +97,79 @@ After changing variables, make sure you restart the stack:
|
||||
docker compose watch
|
||||
```
|
||||
|
||||
## The `.env` File
|
||||
## The .env file
|
||||
|
||||
The tracked `.env` file contains local development defaults, passwords, and other configuration. Its hostnames use `localhost` for processes running on your machine. Docker Compose overrides hostnames such as the database and SMTP server with their Compose service names.
|
||||
The `.env` file contains the shared local defaults, generated keys, passwords, and other configuration. Its hostnames use `localhost` for processes running on your machine. Docker Compose overrides hostnames such as the database and SMTP server with their Compose service names.
|
||||
|
||||
Do not store deployment secrets in `.env`. Configure them as described in the [FastAPI Cloud deployment guide](./deployment.md) or the [Docker Compose deployment guide](./deployment-docker-compose.md).
|
||||
Depending on your workflow, you could want to exclude it from Git, for example if your project is public. In that case, you would have to make sure to set up a way for your CI tools to obtain it while building or deploying your project.
|
||||
|
||||
## Pre-commit Hooks and Code Linting
|
||||
One way to do it could be to add each environment variable to your CI/CD system.
|
||||
|
||||
The project uses [prek](https://prek.j178.dev/), a modern alternative to [pre-commit](https://pre-commit.com/), for code linting and formatting.
|
||||
## Pre-commits and code linting
|
||||
|
||||
we are using a tool called [prek](https://prek.j178.dev/) (modern alternative to [Pre-commit](https://pre-commit.com/)) for code linting and formatting.
|
||||
|
||||
When you install it, it runs right before making a commit in git. This way it ensures that the code is consistent and formatted even before it is committed.
|
||||
|
||||
You can find a file `.pre-commit-config.yaml` with configurations at the root of the project.
|
||||
|
||||
### Install `prek` to Run Automatically
|
||||
#### Install prek to run automatically
|
||||
|
||||
`prek` is already part of the dependencies of the project.
|
||||
|
||||
From the project root, install the Git hook so that `prek` runs automatically before each commit:
|
||||
After having the `prek` tool installed and available, you need to "install" it in the local repository, so that it runs automatically before each commit.
|
||||
|
||||
Using `uv`, you could do it with (make sure you are inside `backend` folder):
|
||||
|
||||
```bash
|
||||
uv run prek install -f
|
||||
❯ uv run prek install -f
|
||||
prek installed at `../.git/hooks/pre-commit`
|
||||
```
|
||||
|
||||
The `-f` flag forces the installation, in case there was already a `pre-commit` hook previously installed.
|
||||
|
||||
Now whenever you try to commit, for example with:
|
||||
Now whenever you try to commit, e.g. with:
|
||||
|
||||
```bash
|
||||
git commit
|
||||
```
|
||||
|
||||
`prek` will check and format the code you are about to commit. If it modifies any files, add those files to Git again before committing.
|
||||
...prek will run and check and format the code you are about to commit, and will ask you to add that code (stage it) with git again before committing.
|
||||
|
||||
### Run `prek` Manually
|
||||
Then you can `git add` the modified/fixed files again and now you can commit.
|
||||
|
||||
You can also run `prek` manually on all files from the project root:
|
||||
#### Running prek hooks manually
|
||||
|
||||
you can also run `prek` manually on all the files, you can do it using `uv` with:
|
||||
|
||||
```bash
|
||||
uv run prek run --all-files
|
||||
❯ uv run prek run --all-files
|
||||
check for added large files..............................................Passed
|
||||
check toml...............................................................Passed
|
||||
check yaml...............................................................Passed
|
||||
fix end of files.........................................................Passed
|
||||
trim trailing whitespace.................................................Passed
|
||||
ruff.....................................................................Passed
|
||||
ruff-format..............................................................Passed
|
||||
biome check..............................................................Passed
|
||||
```
|
||||
|
||||
## URLs
|
||||
|
||||
The production or staging URLs would use these same paths, but with your own domain.
|
||||
|
||||
### Development URLs
|
||||
|
||||
Development URLs, for local development.
|
||||
|
||||
Application: <http://localhost:8000>
|
||||
|
||||
Automatic Interactive Docs (Swagger UI): <http://localhost:8000/docs>
|
||||
|
||||
Automatic Alternative Docs (ReDoc): <http://localhost:8000/redoc>
|
||||
|
||||
Adminer: <http://localhost:8080>
|
||||
|
||||
Traefik UI: <http://localhost:8090>
|
||||
|
||||
MailCatcher: <http://localhost:1080>
|
||||
|
||||
+1
-1
@@ -1,2 +1,2 @@
|
||||
VITE_API_URL=http://localhost:8000
|
||||
MAILPIT_HOST=http://localhost:8025
|
||||
MAILCATCHER_HOST=http://localhost:1080
|
||||
|
||||
+11
-18
@@ -1,29 +1,27 @@
|
||||
# FastAPI Project - Frontend
|
||||
|
||||
The frontend is built with [Vite](https://vitejs.dev/), [React](https://react.dev/), [TypeScript](https://www.typescriptlang.org/), [TanStack Query](https://tanstack.com/query), [TanStack Router](https://tanstack.com/router), [Tailwind CSS](https://tailwindcss.com/), and [shadcn/ui](https://ui.shadcn.com/).
|
||||
The frontend is built with [Vite](https://vitejs.dev/), [React](https://reactjs.org/), [TypeScript](https://www.typescriptlang.org/), [TanStack Query](https://tanstack.com/query), [TanStack Router](https://tanstack.com/router) and [Tailwind CSS](https://tailwindcss.com/).
|
||||
|
||||
## Requirements
|
||||
|
||||
- [Bun](https://bun.sh/)
|
||||
- [Bun](https://bun.sh/) (recommended) or [Node.js](https://nodejs.org/)
|
||||
|
||||
## Quick Start
|
||||
|
||||
From the project root, install the dependencies and start the frontend development server:
|
||||
|
||||
```bash
|
||||
bun install
|
||||
bun run dev
|
||||
```
|
||||
|
||||
Then open <http://localhost:5173/> in your browser.
|
||||
* Then open your browser at http://localhost:5173/.
|
||||
|
||||
Run `uv run bash scripts/prestart.sh` and `uv run fastapi dev` from the `backend` directory, with PostgreSQL running in Docker Compose. See [../development.md](../development.md) for the complete setup.
|
||||
|
||||
To serve the frontend with FastAPI, run `bun run build` from the `frontend` directory and open `http://localhost:8000`.
|
||||
|
||||
Check `frontend/package.json` to see the other available commands.
|
||||
Check the file `package.json` to see other available options.
|
||||
|
||||
## Removing the Frontend
|
||||
### Removing the frontend
|
||||
|
||||
If you are developing an API-only app and want to remove the frontend, you can do it easily:
|
||||
|
||||
@@ -35,17 +33,13 @@ If you are developing an API-only app and want to remove the frontend, you can d
|
||||
|
||||
* In the `compose.override.yml` file, remove the `playwright` service.
|
||||
|
||||
* In the `.github/workflows/deploy.yml` file, remove the **Set up Bun**, **Install frontend dependencies**, and **Build frontend** steps.
|
||||
|
||||
* In the `.fastapicloudignore` file, remove the `!backend/app/frontend/` entry.
|
||||
|
||||
Done, you now have an API-only app. 🤓
|
||||
Done, you have a frontend-less (api-only) app. 🤓
|
||||
|
||||
## Generate Client
|
||||
|
||||
### Automatically
|
||||
|
||||
* From the project root, run the script:
|
||||
* From the top level project directory, run the script:
|
||||
|
||||
```bash
|
||||
bash ./scripts/generate-client.sh
|
||||
@@ -67,7 +61,7 @@ bun run generate-client
|
||||
|
||||
* Commit the changes.
|
||||
|
||||
Regenerate the client whenever backend changes affect the OpenAPI schema.
|
||||
Notice that everytime the backend changes (changing the OpenAPI schema), you should follow these steps again to update the frontend client.
|
||||
|
||||
## Using a Remote API
|
||||
|
||||
@@ -84,12 +78,11 @@ Then, when you run the frontend, it will use that URL as the base URL for the AP
|
||||
The frontend code is structured as follows:
|
||||
|
||||
* `frontend/src` - The main frontend code.
|
||||
* `frontend/public` - Static assets.
|
||||
* `frontend/src/assets` - Static assets.
|
||||
* `frontend/src/client` - The generated OpenAPI client.
|
||||
* `frontend/src/components` - The components of the frontend, including the shadcn/ui components in `frontend/src/components/ui`.
|
||||
* `frontend/src/components` - The different components of the frontend.
|
||||
* `frontend/src/hooks` - Custom hooks.
|
||||
* `frontend/src/lib` - Shared frontend utilities.
|
||||
* `frontend/src/routes` - The frontend routes and pages.
|
||||
* `frontend/src/routes` - The different routes of the frontend which include the pages.
|
||||
|
||||
## End-to-End Testing with Playwright
|
||||
|
||||
|
||||
@@ -37,6 +37,7 @@
|
||||
"clsx": "^2.1.1",
|
||||
"form-data": "4.0.6",
|
||||
"lucide-react": "^1.28.0",
|
||||
"next-themes": "^0.4.6",
|
||||
"react": "^19.2.8",
|
||||
"react-dom": "^19.2.8",
|
||||
"react-error-boundary": "^6.1.2",
|
||||
|
||||
@@ -7,15 +7,15 @@ import {
|
||||
OctagonXIcon,
|
||||
TriangleAlertIcon,
|
||||
} from "lucide-react"
|
||||
import { useTheme } from "@/components/theme-provider"
|
||||
import { useTheme } from "next-themes"
|
||||
import { Toaster as Sonner, type ToasterProps } from "sonner"
|
||||
|
||||
const Toaster = ({ ...props }: ToasterProps) => {
|
||||
const { theme } = useTheme()
|
||||
const { theme = "system" } = useTheme()
|
||||
|
||||
return (
|
||||
<Sonner
|
||||
theme={theme}
|
||||
theme={theme as ToasterProps["theme"]}
|
||||
className="toaster group"
|
||||
icons={{
|
||||
success: <CircleCheckIcon className="size-4" />,
|
||||
|
||||
@@ -25,7 +25,7 @@ function Layout() {
|
||||
<SidebarProvider>
|
||||
<AppSidebar />
|
||||
<SidebarInset>
|
||||
<header className="sticky top-0 z-10 flex h-16 shrink-0 items-center gap-2 border-b bg-background px-4">
|
||||
<header className="sticky top-0 z-10 flex h-16 shrink-0 items-center gap-2 border-b px-4">
|
||||
<SidebarTrigger className="-ml-1 text-muted-foreground" />
|
||||
</header>
|
||||
<main className="flex-1 p-6 md:p-8">
|
||||
|
||||
@@ -1,12 +1,10 @@
|
||||
import { expect, test } from "@playwright/test"
|
||||
import { waitForEmailHtml } from "./utils/mailpit"
|
||||
import { findLastEmail } from "./utils/mailcatcher"
|
||||
import { randomEmail, randomPassword } from "./utils/random"
|
||||
import { logInUser, signUpNewUser } from "./utils/user"
|
||||
|
||||
test.use({ storageState: { cookies: [], origins: [] } })
|
||||
|
||||
const resetPath = "/reset-password?token="
|
||||
|
||||
test("Password Recovery title is visible", async ({ page }) => {
|
||||
await page.goto("/recover-password")
|
||||
|
||||
@@ -46,17 +44,23 @@ test("User can reset password successfully using the link", async ({
|
||||
|
||||
await page.getByRole("button", { name: "Continue" }).click()
|
||||
|
||||
const emailHtml = await waitForEmailHtml({
|
||||
const emailData = await findLastEmail({
|
||||
request,
|
||||
query: `to:${email}`,
|
||||
filter: (e) => e.recipients.includes(`<${email}>`),
|
||||
timeout: 5000,
|
||||
})
|
||||
|
||||
expect(emailHtml).toContain(resetPath)
|
||||
const resetUrl = emailHtml.match(/\/reset-password\?token=[^"]+/)?.[0]
|
||||
expect(resetUrl).toBeDefined()
|
||||
await page.goto(
|
||||
`${process.env.MAILCATCHER_HOST}/messages/${emailData.id}.html`,
|
||||
)
|
||||
|
||||
const selector = 'a[href*="/reset-password?token="]'
|
||||
|
||||
const url = await page.getAttribute(selector, "href")
|
||||
const resetUrl = new URL(url!)
|
||||
|
||||
// Set the new password and confirm it
|
||||
await page.goto(resetUrl!)
|
||||
await page.goto(`${resetUrl.pathname}${resetUrl.search}`)
|
||||
|
||||
await page.getByTestId("new-password-input").fill(newPassword)
|
||||
await page.getByTestId("confirm-password-input").fill(newPassword)
|
||||
@@ -93,17 +97,22 @@ test("Weak new password validation", async ({ page, request }) => {
|
||||
await page.getByTestId("email-input").fill(email)
|
||||
await page.getByRole("button", { name: "Continue" }).click()
|
||||
|
||||
const emailHtml = await waitForEmailHtml({
|
||||
const emailData = await findLastEmail({
|
||||
request,
|
||||
query: `to:${email}`,
|
||||
filter: (e) => e.recipients.includes(`<${email}>`),
|
||||
timeout: 5000,
|
||||
})
|
||||
|
||||
expect(emailHtml).toContain(resetPath)
|
||||
const resetUrl = emailHtml.match(/\/reset-password\?token=[^"]+/)?.[0]
|
||||
expect(resetUrl).toBeDefined()
|
||||
await page.goto(
|
||||
`${process.env.MAILCATCHER_HOST}/messages/${emailData.id}.html`,
|
||||
)
|
||||
|
||||
const selector = 'a[href*="/reset-password?token="]'
|
||||
const url = await page.getAttribute(selector, "href")
|
||||
const resetUrl = new URL(url!)
|
||||
|
||||
// Set a weak new password
|
||||
await page.goto(resetUrl!)
|
||||
await page.goto(`${resetUrl.pathname}${resetUrl.search}`)
|
||||
await page.getByTestId("new-password-input").fill(weakPassword)
|
||||
await page.getByTestId("confirm-password-input").fill(weakPassword)
|
||||
await page.getByRole("button", { name: "Reset Password" }).click()
|
||||
|
||||
@@ -0,0 +1,62 @@
|
||||
import type { APIRequestContext } from "@playwright/test"
|
||||
|
||||
type Email = {
|
||||
id: number
|
||||
recipients: string[]
|
||||
subject: string
|
||||
}
|
||||
|
||||
async function findEmail({
|
||||
request,
|
||||
filter,
|
||||
}: {
|
||||
request: APIRequestContext
|
||||
filter?: (email: Email) => boolean
|
||||
}) {
|
||||
const response = await request.get(`${process.env.MAILCATCHER_HOST}/messages`)
|
||||
|
||||
let emails = await response.json()
|
||||
|
||||
if (filter) {
|
||||
emails = emails.filter(filter)
|
||||
}
|
||||
|
||||
const email = emails[emails.length - 1]
|
||||
|
||||
if (email) {
|
||||
return email as Email
|
||||
}
|
||||
|
||||
return null
|
||||
}
|
||||
|
||||
export function findLastEmail({
|
||||
request,
|
||||
filter,
|
||||
timeout = 5000,
|
||||
}: {
|
||||
request: APIRequestContext
|
||||
filter?: (email: Email) => boolean
|
||||
timeout?: number
|
||||
}) {
|
||||
const timeoutPromise = new Promise<never>((_, reject) =>
|
||||
setTimeout(
|
||||
() => reject(new Error("Timeout while trying to get latest email")),
|
||||
timeout,
|
||||
),
|
||||
)
|
||||
|
||||
const checkEmails = async () => {
|
||||
while (true) {
|
||||
const emailData = await findEmail({ request, filter })
|
||||
|
||||
if (emailData) {
|
||||
return emailData
|
||||
}
|
||||
// Wait for 100ms before checking again
|
||||
await new Promise((resolve) => setTimeout(resolve, 100))
|
||||
}
|
||||
}
|
||||
|
||||
return Promise.race([timeoutPromise, checkEmails()])
|
||||
}
|
||||
@@ -1,46 +0,0 @@
|
||||
import type { APIRequestContext } from "@playwright/test"
|
||||
|
||||
type EmailSummary = {
|
||||
ID: string
|
||||
}
|
||||
|
||||
export async function waitForEmailHtml({
|
||||
request,
|
||||
query,
|
||||
timeout = 5000,
|
||||
}: {
|
||||
request: APIRequestContext
|
||||
query: string
|
||||
timeout?: number
|
||||
}) {
|
||||
const deadline = Date.now() + timeout
|
||||
|
||||
while (Date.now() < deadline) {
|
||||
const response = await request.get(
|
||||
`${process.env.MAILPIT_HOST}/api/v1/search`,
|
||||
{
|
||||
params: { query, limit: 1 },
|
||||
},
|
||||
)
|
||||
const { messages }: { messages: EmailSummary[] } = await response.json()
|
||||
const email = messages[0]
|
||||
|
||||
if (email) {
|
||||
const htmlResponse = await request.get(
|
||||
`${process.env.MAILPIT_HOST}/view/${email.ID}.html`,
|
||||
)
|
||||
|
||||
if (!htmlResponse.ok()) {
|
||||
throw new Error(
|
||||
`Could not get the HTML for email "${email.ID}": ${htmlResponse.status()}`,
|
||||
)
|
||||
}
|
||||
|
||||
return htmlResponse.text()
|
||||
}
|
||||
|
||||
await new Promise((resolve) => setTimeout(resolve, 100))
|
||||
}
|
||||
|
||||
throw new Error(`Timeout while trying to get the latest email for "${query}"`)
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 167 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 97 KiB |
@@ -25,8 +25,8 @@ export default function NewAccount({
|
||||
project_name={project_name}
|
||||
>
|
||||
<Heading>Welcome to {project_name}!</Heading>
|
||||
<Text style={bodyTextStyle}>Hi,</Text>
|
||||
<Text style={bodyTextStyle}>
|
||||
<Text className="text-[15px] leading-7 text-body">Hi,</Text>
|
||||
<Text className="text-[15px] leading-7 text-body">
|
||||
Your account has been successfully created and is ready to use. These
|
||||
are your credentials:
|
||||
</Text>
|
||||
@@ -34,32 +34,18 @@ export default function NewAccount({
|
||||
<Detail label="Username" value={username} />
|
||||
<Detail label="Password" value={password} />
|
||||
</Callout>
|
||||
<Text style={bodyTextStyle}>
|
||||
<Text className="text-[15px] leading-7 text-body">
|
||||
Get started by signing in to your dashboard:
|
||||
</Text>
|
||||
<LinkButton href={link}>Go to Dashboard</LinkButton>
|
||||
<Text style={supportingTextStyle}>
|
||||
<Text className="text-sm leading-6 text-muted">
|
||||
Or copy and paste this link into your browser:
|
||||
<br />
|
||||
<Link href={link}>{link}</Link>
|
||||
</Text>
|
||||
<Text style={supportingTextStyle}>
|
||||
<Text className="text-sm leading-6 text-muted">
|
||||
For security reasons, change your password after your first sign in.
|
||||
</Text>
|
||||
</Layout>
|
||||
)
|
||||
}
|
||||
|
||||
const bodyTextStyle = {
|
||||
color: "#334155",
|
||||
fontSize: "15px",
|
||||
lineHeight: "26px",
|
||||
margin: "0 0 18px",
|
||||
}
|
||||
|
||||
const supportingTextStyle = {
|
||||
color: "#64748b",
|
||||
fontSize: "14px",
|
||||
lineHeight: "23px",
|
||||
margin: "0 0 16px",
|
||||
}
|
||||
|
||||
@@ -24,38 +24,24 @@ export default function ResetPassword({
|
||||
project_name={project_name}
|
||||
>
|
||||
<Heading>Reset your password</Heading>
|
||||
<Text style={bodyTextStyle}>Hi {username},</Text>
|
||||
<Text style={bodyTextStyle}>
|
||||
<Text className="text-[15px] leading-7 text-body">Hi {username},</Text>
|
||||
<Text className="text-[15px] leading-7 text-body">
|
||||
We've received a request to reset the password for your {project_name}{" "}
|
||||
account. Choose a new one by clicking the button below:
|
||||
</Text>
|
||||
<LinkButton href={link}>Reset password</LinkButton>
|
||||
<Text style={supportingTextStyle}>
|
||||
<Text className="text-sm leading-6 text-muted">
|
||||
Or copy and paste this link into your browser:
|
||||
<br />
|
||||
<Link href={link}>{link}</Link>
|
||||
</Text>
|
||||
<Text style={supportingTextStyle}>
|
||||
<Text className="text-sm leading-6 text-muted">
|
||||
This link will expire in {valid_hours} hours.
|
||||
</Text>
|
||||
<Text style={supportingTextStyle}>
|
||||
<Text className="text-sm leading-6 text-muted">
|
||||
If you didn't request a password recovery, you can safely ignore this
|
||||
email.
|
||||
</Text>
|
||||
</Layout>
|
||||
)
|
||||
}
|
||||
|
||||
const bodyTextStyle = {
|
||||
color: "#334155",
|
||||
fontSize: "15px",
|
||||
lineHeight: "26px",
|
||||
margin: "0 0 18px",
|
||||
}
|
||||
|
||||
const supportingTextStyle = {
|
||||
color: "#64748b",
|
||||
fontSize: "14px",
|
||||
lineHeight: "23px",
|
||||
margin: "0 0 16px",
|
||||
}
|
||||
|
||||
@@ -19,31 +19,17 @@ export default function TestEmail({
|
||||
project_name={project_name}
|
||||
>
|
||||
<Heading>Test email</Heading>
|
||||
<Text style={bodyTextStyle}>Hi,</Text>
|
||||
<Text style={bodyTextStyle}>
|
||||
<Text className="text-[15px] leading-7 text-body">Hi,</Text>
|
||||
<Text className="text-[15px] leading-7 text-body">
|
||||
This is a test email from {project_name}. If you're reading it, email
|
||||
delivery is configured correctly.
|
||||
</Text>
|
||||
<Callout>
|
||||
<Detail label="Sent to" value={email} />
|
||||
</Callout>
|
||||
<Text style={supportingTextStyle}>
|
||||
<Text className="text-sm leading-6 text-muted">
|
||||
If you weren't expecting this email, you can safely ignore it.
|
||||
</Text>
|
||||
</Layout>
|
||||
)
|
||||
}
|
||||
|
||||
const bodyTextStyle = {
|
||||
color: "#334155",
|
||||
fontSize: "15px",
|
||||
lineHeight: "26px",
|
||||
margin: "0 0 18px",
|
||||
}
|
||||
|
||||
const supportingTextStyle = {
|
||||
color: "#64748b",
|
||||
fontSize: "14px",
|
||||
lineHeight: "23px",
|
||||
margin: "0 0 16px",
|
||||
}
|
||||
|
||||
@@ -3,21 +3,10 @@ import { Button } from "@react-email/components"
|
||||
type ButtonProps = React.PropsWithChildren & { href: string }
|
||||
|
||||
export const LinkButton = ({ children, href }: ButtonProps) => (
|
||||
<Button href={href} style={buttonStyle}>
|
||||
<Button
|
||||
href={href}
|
||||
className="bg-brand text-white rounded-md font-semibold text-sm mt-2 mb-7 inline-block text-center no-underline px-7 py-3.5"
|
||||
>
|
||||
{children}
|
||||
</Button>
|
||||
)
|
||||
|
||||
const buttonStyle = {
|
||||
backgroundColor: "#00796b",
|
||||
borderRadius: "6px",
|
||||
color: "#ffffff",
|
||||
display: "inline-block",
|
||||
fontSize: "14px",
|
||||
fontWeight: "700",
|
||||
lineHeight: "20px",
|
||||
margin: "8px 0 28px",
|
||||
padding: "13px 28px",
|
||||
textAlign: "center" as const,
|
||||
textDecoration: "none",
|
||||
}
|
||||
|
||||
@@ -3,44 +3,20 @@ import { Section, Text } from "@react-email/components"
|
||||
type CalloutProps = React.PropsWithChildren
|
||||
|
||||
export const Callout = ({ children }: CalloutProps) => (
|
||||
<Section style={calloutStyle}>{children}</Section>
|
||||
<Section className="border-0 border-l-2 border-solid border-brand pl-5 my-7">
|
||||
{children}
|
||||
</Section>
|
||||
)
|
||||
|
||||
type DetailProps = { label: string; value: string }
|
||||
|
||||
export const Detail = ({ label, value }: DetailProps) => (
|
||||
<Text style={detailStyle}>
|
||||
<span style={labelStyle}>{label}</span>
|
||||
<br />
|
||||
<span style={valueStyle}>{value}</span>
|
||||
<Text className="m-0 my-3">
|
||||
<span className="block text-[11px] uppercase tracking-[0.08em] text-muted">
|
||||
{label}
|
||||
</span>
|
||||
<span className="block text-sm font-semibold break-all font-mono mt-1">
|
||||
{value}
|
||||
</span>
|
||||
</Text>
|
||||
)
|
||||
|
||||
const calloutStyle = {
|
||||
backgroundColor: "#f2f8f7",
|
||||
borderLeft: "3px solid #00897b",
|
||||
margin: "24px 0 28px",
|
||||
padding: "6px 18px",
|
||||
}
|
||||
|
||||
const detailStyle = {
|
||||
margin: "12px 0",
|
||||
}
|
||||
|
||||
const labelStyle = {
|
||||
color: "#64748b",
|
||||
fontSize: "11px",
|
||||
fontWeight: "700",
|
||||
letterSpacing: "1px",
|
||||
lineHeight: "16px",
|
||||
textTransform: "uppercase" as const,
|
||||
}
|
||||
|
||||
const valueStyle = {
|
||||
color: "#1e293b",
|
||||
fontFamily: 'Consolas, "Courier New", monospace',
|
||||
fontSize: "14px",
|
||||
fontWeight: "700",
|
||||
lineHeight: "22px",
|
||||
wordBreak: "break-all" as const,
|
||||
}
|
||||
|
||||
@@ -3,16 +3,10 @@ import { Heading as BaseHeading } from "@react-email/components"
|
||||
type HeadingProps = React.PropsWithChildren
|
||||
|
||||
export const Heading = ({ children }: HeadingProps) => (
|
||||
<BaseHeading as="h1" style={headingStyle}>
|
||||
<BaseHeading
|
||||
as="h1"
|
||||
className="text-2xl leading-8 font-semibold tracking-[-0.02em] text-body m-0 mb-5"
|
||||
>
|
||||
{children}
|
||||
</BaseHeading>
|
||||
)
|
||||
|
||||
const headingStyle = {
|
||||
color: "#17212b",
|
||||
fontSize: "26px",
|
||||
fontWeight: "700",
|
||||
letterSpacing: "-0.3px",
|
||||
lineHeight: "34px",
|
||||
margin: "0 0 20px",
|
||||
}
|
||||
|
||||
@@ -1,13 +1,11 @@
|
||||
import {
|
||||
Body,
|
||||
Column,
|
||||
Container,
|
||||
Head,
|
||||
Hr,
|
||||
Html,
|
||||
Preview,
|
||||
Row,
|
||||
Section,
|
||||
Tailwind,
|
||||
Text,
|
||||
} from "@react-email/components"
|
||||
|
||||
@@ -24,88 +22,64 @@ export const Layout = ({
|
||||
children,
|
||||
}: LayoutProps) => {
|
||||
return (
|
||||
<Html lang="en" dir="ltr">
|
||||
<Head>
|
||||
<title>{title}</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
</Head>
|
||||
{preview ? <Preview>{preview}</Preview> : null}
|
||||
<Body style={bodyStyle}>
|
||||
<Container style={containerStyle}>
|
||||
<Row>
|
||||
<Column style={contentStyle}>
|
||||
<Section>
|
||||
<Hr style={brandRuleStyle} />
|
||||
<Text style={brandStyle}>{project_name}</Text>
|
||||
</Section>
|
||||
<Section>{children}</Section>
|
||||
<Hr style={footerRuleStyle} />
|
||||
<Section>
|
||||
<Text style={footerStyle}>
|
||||
© {new Date().getFullYear()} {project_name}. All rights
|
||||
reserved.
|
||||
</Text>
|
||||
</Section>
|
||||
</Column>
|
||||
</Row>
|
||||
</Container>
|
||||
</Body>
|
||||
</Html>
|
||||
<Tailwind
|
||||
config={{
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
surface: "#ffffff",
|
||||
body: "#1e293b",
|
||||
muted: "#64748b",
|
||||
rule: "#e2e8f0",
|
||||
brand: {
|
||||
DEFAULT: "#009688",
|
||||
dark: "#00695c",
|
||||
},
|
||||
},
|
||||
fontFamily: {
|
||||
sans: [
|
||||
"-apple-system",
|
||||
"BlinkMacSystemFont",
|
||||
'"Segoe UI"',
|
||||
"Roboto",
|
||||
"Oxygen",
|
||||
"Ubuntu",
|
||||
"Cantarell",
|
||||
'"Fira Sans"',
|
||||
'"Droid Sans"',
|
||||
'"Helvetica Neue"',
|
||||
"sans-serif",
|
||||
],
|
||||
},
|
||||
},
|
||||
},
|
||||
}}
|
||||
>
|
||||
<Html lang="en" dir="ltr">
|
||||
<Head>
|
||||
<title>{title}</title>
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1.0"
|
||||
/>
|
||||
</Head>
|
||||
{preview ? <Preview>{preview}</Preview> : null}
|
||||
<Body className="bg-surface font-sans text-body max-w-[560px] w-full mx-auto my-0 py-12 px-6">
|
||||
<Section>
|
||||
<Hr className="border-0 border-t-2 border-solid border-brand w-8 m-0" />
|
||||
<Text className="text-body text-[13px] font-semibold uppercase tracking-[0.1em] mt-4 mb-9">
|
||||
{project_name}
|
||||
</Text>
|
||||
</Section>
|
||||
<Section>{children}</Section>
|
||||
<Hr className="border-0 border-t border-solid border-rule mt-10 mb-5" />
|
||||
<Section>
|
||||
<Text className="text-xs leading-5 text-muted m-0">
|
||||
© {new Date().getFullYear()} {project_name}. All rights reserved.
|
||||
</Text>
|
||||
</Section>
|
||||
</Body>
|
||||
</Html>
|
||||
</Tailwind>
|
||||
)
|
||||
}
|
||||
|
||||
const fontFamily =
|
||||
'-apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif'
|
||||
|
||||
const bodyStyle = {
|
||||
backgroundColor: "#f4f7f6",
|
||||
color: "#1e293b",
|
||||
fontFamily,
|
||||
margin: "0",
|
||||
padding: "32px 12px",
|
||||
}
|
||||
|
||||
const containerStyle = {
|
||||
backgroundColor: "#ffffff",
|
||||
border: "1px solid #dce7e5",
|
||||
borderRadius: "8px",
|
||||
boxSizing: "border-box" as const,
|
||||
margin: "0 auto",
|
||||
maxWidth: "560px",
|
||||
width: "100%",
|
||||
}
|
||||
|
||||
const contentStyle = {
|
||||
padding: "40px 36px 32px",
|
||||
}
|
||||
|
||||
const brandRuleStyle = {
|
||||
border: "0",
|
||||
borderTop: "3px solid #00897b",
|
||||
margin: "0 0 16px",
|
||||
width: "32px",
|
||||
}
|
||||
|
||||
const brandStyle = {
|
||||
color: "#334155",
|
||||
fontSize: "13px",
|
||||
fontWeight: "700",
|
||||
letterSpacing: "1px",
|
||||
lineHeight: "20px",
|
||||
margin: "0 0 32px",
|
||||
textTransform: "uppercase" as const,
|
||||
}
|
||||
|
||||
const footerRuleStyle = {
|
||||
border: "0",
|
||||
borderTop: "1px solid #dce7e5",
|
||||
margin: "36px 0 18px",
|
||||
width: "100%",
|
||||
}
|
||||
|
||||
const footerStyle = {
|
||||
color: "#64748b",
|
||||
fontSize: "12px",
|
||||
lineHeight: "20px",
|
||||
margin: "0",
|
||||
}
|
||||
|
||||
@@ -1,15 +1,7 @@
|
||||
import { Link as EmailLink } from "@react-email/components"
|
||||
|
||||
type LinkProps = React.PropsWithChildren & { href: string }
|
||||
|
||||
export const Link = ({ children, href }: LinkProps) => (
|
||||
<EmailLink href={href} style={linkStyle}>
|
||||
<a href={href} className="text-brand-dark underline break-all">
|
||||
{children}
|
||||
</EmailLink>
|
||||
</a>
|
||||
)
|
||||
|
||||
const linkStyle = {
|
||||
color: "#00695c",
|
||||
textDecoration: "underline",
|
||||
wordBreak: "break-all" as const,
|
||||
}
|
||||
|
||||
@@ -2,51 +2,6 @@
|
||||
|
||||
## Latest Changes
|
||||
|
||||
### Fixes
|
||||
|
||||
* 🐛 Fix Sonner toast theme sync. PR [#2450](https://github.com/fastapi/full-stack-fastapi-template/pull/2450) by [@chris-bs23](https://github.com/chris-bs23).
|
||||
* 🐛 Add background to the sticky layout header. PR [#2384](https://github.com/fastapi/full-stack-fastapi-template/pull/2384) by [@istoutjesdijk](https://github.com/istoutjesdijk).
|
||||
|
||||
### Refactors
|
||||
|
||||
* ✅ Simplify password reset E2E tests. PR [#2453](https://github.com/fastapi/full-stack-fastapi-template/pull/2453) by [@alejsdev](https://github.com/alejsdev).
|
||||
* 💄 Refactor email templates and components for improved styling. PR [#2451](https://github.com/fastapi/full-stack-fastapi-template/pull/2451) by [@alejsdev](https://github.com/alejsdev).
|
||||
* ♻️ Replace Mailcatcher with Mailpit for local email testing. PR [#2436](https://github.com/fastapi/full-stack-fastapi-template/pull/2436) by [@alejsdev](https://github.com/alejsdev).
|
||||
|
||||
### Docs
|
||||
|
||||
* 📝 Update README.md with Mailpit and React Email. PR [#2452](https://github.com/fastapi/full-stack-fastapi-template/pull/2452) by [@alejsdev](https://github.com/alejsdev).
|
||||
* 📝 Simplify project documentation. PR [#2442](https://github.com/fastapi/full-stack-fastapi-template/pull/2442) by [@tiangolo](https://github.com/tiangolo).
|
||||
|
||||
### Internal
|
||||
|
||||
* ⬆️ Bump setup-uv action to 10.0.1. PR [#2458](https://github.com/fastapi/full-stack-fastapi-template/pull/2458) by [@YuriiMotov](https://github.com/YuriiMotov).
|
||||
|
||||
## 0.12.0 (2026-08-12)
|
||||
|
||||
### Features
|
||||
|
||||
* ☁️ Add FastAPI Cloud deployment. PR [#2438](https://github.com/fastapi/full-stack-fastapi-template/pull/2438) by [@tiangolo](https://github.com/tiangolo).
|
||||
|
||||
### Fixes
|
||||
|
||||
* 🐳 Include frontend assets in Docker build context. PR [#2440](https://github.com/fastapi/full-stack-fastapi-template/pull/2440) by [@tiangolo](https://github.com/tiangolo).
|
||||
|
||||
### Internal
|
||||
|
||||
* 👷 Migrate automatic labels to Latest Changes. PR [#2439](https://github.com/fastapi/full-stack-fastapi-template/pull/2439) by [@tiangolo](https://github.com/tiangolo).
|
||||
|
||||
## 0.11.1 (2026-08-11)
|
||||
|
||||
### Refactors
|
||||
|
||||
* ♻️ Simplify Docker Compose deployment. PR [#2435](https://github.com/fastapi/full-stack-fastapi-template/pull/2435) by [@tiangolo](https://github.com/tiangolo).
|
||||
* ♻️ Migrate to `DATABASE_URL` instead of separate variables. PR [#2184](https://github.com/fastapi/full-stack-fastapi-template/pull/2184) by [@patrick91](https://github.com/patrick91).
|
||||
|
||||
### Internal
|
||||
|
||||
* ⬆ Bump the npm-packages group across 1 directory with 33 updates. PR [#2433](https://github.com/fastapi/full-stack-fastapi-template/pull/2433) by [@dependabot[bot]](https://github.com/apps/dependabot).
|
||||
|
||||
## 0.11.0 (2026-08-11)
|
||||
|
||||
### Features
|
||||
|
||||
Reference in New Issue
Block a user