https://github.com/spaceshaman/full-stack-fastapi-nuxt-jwt-auth-orm-free-template
ORM Free Full Stack, modern web application template. Using FastAPI, Nuxt.js, JWT Authentication, SQLite, Docker compose and more.
https://github.com/spaceshaman/full-stack-fastapi-nuxt-jwt-auth-orm-free-template
backend docker docker-compose fastapi frontend full-stack fullstack jwt jwt-auth jwt-authentication jwt-token nuxt nuxt3 nuxtjs python python3 sqlite sqlite3 template typescript
Last synced: 3 months ago
JSON representation
ORM Free Full Stack, modern web application template. Using FastAPI, Nuxt.js, JWT Authentication, SQLite, Docker compose and more.
- Host: GitHub
- URL: https://github.com/spaceshaman/full-stack-fastapi-nuxt-jwt-auth-orm-free-template
- Owner: SpaceShaman
- License: mit
- Created: 2025-01-25T15:45:58.000Z (over 1 year ago)
- Default Branch: master
- Last Pushed: 2025-03-24T19:20:46.000Z (over 1 year ago)
- Last Synced: 2025-03-24T19:33:53.925Z (over 1 year ago)
- Topics: backend, docker, docker-compose, fastapi, frontend, full-stack, fullstack, jwt, jwt-auth, jwt-authentication, jwt-token, nuxt, nuxt3, nuxtjs, python, python3, sqlite, sqlite3, template, typescript
- Language: Python
- Homepage:
- Size: 1.09 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Full Stack FastAPI Nuxt.js JWT Auth ORM Free Template
[](https://github.com/SpaceShaman/full-stack-fastapi-nuxt-jwt-auth-orm-free-template?tab=MIT-1-ov-file)
[](https://github.com/SpaceShaman/full-stack-fastapi-nuxt-jwt-auth-orm-free-template/blob/master/.github/workflows/tests.yml)
[](https://codecov.io/gh/SpaceShaman/full-stack-fastapi-nuxt-jwt-auth-orm-free-template)
[](https://www.python.org/)
[](https://www.typescriptlang.org/)
[](https://fastapi.tiangolo.com/)
[](https://nuxt.com/)
[](https://www.docker.com/)
[](https://docs.docker.com/compose/)
[](https://python-poetry.org)
[](https://docs.pydantic.dev)
[](https://tailwindcss.com/)
[](https://daisyui.com/)
[](https://vee-validate.logaretm.com)
[](https://yup-docs.vercel.app/)
[](https://jinja.palletsprojects.com/)
[](https://jwt.io/)
[](https://docs.pytest.org/)
[](https://www.sqlite.org/)
[](https://github.com/SpaceShaman/SQLift)
[](https://github.com/psf/black)
[](https://github.com/astral-sh/ruff)
[](https://prettier.io/)
[](https://eslint.org/)
## Technology Stack and Features
### Backend
- โก [**FastAPI**](https://fastapi.tiangolo.com) as the backend framework.
- ๐ฆ Dependency management with [**Poetry**](https://python-poetry.org).
- ๐ถ Code linting using [**Ruff**](https://github.com/astral-sh/ruff).
- ๐ Data validation with [**Pydantic**](https://docs.pydantic.dev).
- ๐ [**SQLite**](https://www.sqlite.org) as the database.
- ๐ **ORM free** approach using raw SQL queries with the repository pattern.
- ๐ Database migrations with [**SQLift**](https://github.com/SpaceShaman/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**](https://pytest.org).
### Frontend
- ๐ [**Nuxt.js**](https://nuxt.com) as the frontend framework.
- ๐ฆ [**TypeScript**](https://www.typescriptlang.org) for static type checking.
- ๐ Code formatting with [**Prettier**](https://prettier.io).
- โจ Code linting using [**ESLint**](https://eslint.org).
- ๐จ Styling with [**TailwindCSS**](https://tailwindcss.com).
- ๐งฉ Ready-to-use components from [**daisyUI**](https://daisyui.com).
- ๐ Middleware for authentication handling.
- ๐ Form validation with [**VeeValidate**](https://vee-validate.logaretm.com) and [**Yup**](https://yup-docs.vercel.app/).
- ๐จ Theme selector with 32 themes from [**daisyUI**](https://daisyui.com).
- ๐จ 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**](https://about.codecov.io)
- ๐ Ready-to-use workflow configurations in [.github/workflows/](.github/workflows/)
### Deployment
- ๐ข Deployment instructions using [**Docker Compose**](https://docs.docker.com/compose).
- ๐ฆ [**Traefik**](https://doc.traefik.io/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:
```bash
cp .env.default .env
```
And then edit the `.env` file and set your own values.
### Run
#### Run in development environment
```bash
docker-compose -f docker-compose.dev.yml up
```
#### Run in production environment
```bash
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/](.github/workflows/).
To use it, you need to set the following secrets in your repository settings:
```bash
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](frontend/app/plugins/api.ts).
This plugin uses the [$fetch](https://nuxt.com/docs/getting-started/data-fetching) to make requests to the FastAPI backend.
You can use this plugin in two ways:
#### Like useFetch
```typescript
const { data: users } = await useAPI('/users', {
method: 'get',
...
})
```
#### Like $fetch
```typescript
await useNuxtApp().$api<{ token: string }>('/auth/login', {
method: 'POST',
...
})
```
## License
This project is licensed under the terms of the [MIT license](/LICENSE).