Full Stack FastAPI Nuxt.js JWT Auth ORM Free Template

Technology Stack and Features

Backend

• ⚡ FastAPI as the backend framework.
• 📦 Dependency management with Poetry.
• 🐶 Code linting using Ruff.
• 📝 Data validation with Pydantic.
• 🗃 SQLite as the database.
• 🆓 ORM free approach using raw SQL queries with the repository pattern.
• 🛠 Database migrations with SQLift.
• 🔑 JWT (JSON Web Token) authentication.
• 📝 Registration with email based account activation.
• 🔒 Secure password hashing.
• 📫 Password recovery via email.
• 📧 SMTP integration for sending emails.
• ✉️ Email templates using Jinja.
• ✅ Unit testing with Pytest.

Frontend

• 🚀 Nuxt.js as the frontend framework.
• 🟦 TypeScript for static type checking.
• 🖌 Code formatting with Prettier.
• ✨ Code linting using ESLint.
• 🎨 Styling with TailwindCSS.
• 🧩 Ready-to-use components from daisyUI.
• 🔐 Middleware for authentication handling.
• 📝 Form validation with VeeValidate and Yup.
• 🎨 Theme selector with 32 themes from daisyUI.
• 🚨 Utility functions for alerts and notifications.
  • ❌ Call showErrorAlert('message') to show an error message.
  • ✅ Call showSuccessAlert('message') to show a success message.
  • 💡 Call showInfoAlert('message') to show an info message.
  • ⚠️ Call showWarningAlert('message') to show a warning message.

CI/CD

• 🔄 CI/CD pipeline with GitHub Actions.
• 🧪 Automated testing before deployment.
• 📊 Code coverage reporting with Codecov
• 🚀 Ready-to-use workflow configurations in .github/workflows/

Deployment

• 🚢 Deployment instructions using Docker Compose.
• 🚦 Traefik as a reverse proxy.

Screenshots

Login Page

Register Page

Password Recovery

Theme Selector

Alerts and Toasts

Validation

Simple Dashboard

Activation Email

How To Use It

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

✨ It just works. ✨

Configure

You need to configure the environment variables to set your own values. You can copy the example .env files:

cp .env.default .env

And then edit the .env file and set your own values.

Run

Run in development environment

docker-compose -f docker-compose.dev.yml up

Run in production environment

docker-compose up

CI/CD configuration

This project has a CI/CD pipeline with GitHub Actions. You can see the workflow configuration in .github/workflows/. To use it, you need to set the following secrets in your repository settings:

CODECOV_TOKEN   # Your Codecov token
HOST            # Your SSH host
SSH_KEY         # Your SSH private key
USERNAME        # Your SSH username

Comunication between FastAPI and Nuxt.js

The communication between FastAPI and Nuxt.js is done via plugin `api' which is located in frontend/app/plugins/api.ts. This plugin uses the $fetch to make requests to the FastAPI backend. You can use this plugin in two ways:

Like useFetch

const { data: users } = await useAPI<User[]>('/users', {
    method: 'get',
    ...
})

Like $fetch

await useNuxtApp().$api<{ token: string }>('/auth/login', {
    method: 'POST',
    ...
})

License

This project is licensed under the terms of the MIT license.