🚀 NextJS with FastAPI Backend Starter

🌟 Overview

This project is a full-stack web application built with:

FastAPI for the backend.
Next.js for the frontend.
PostgreSQL for the database.
Redis as a caching layer and task broker.
Celery for task management and background jobs.
Docker for containerization and deployment.
Ngnix as Reverse Proxy Server.

🛠️ Features

User authentication (Built-in/Google) with role-based access control.
Frontend and Backend services are automatically proxied in a single port 8000 through Nginx.
API endpoints for different user roles (e.g., Admin, User, Doctor).
Applying Caching using Redis.
Asynchronous task processing with Celery.
Fully containerized setup using Docker.
All sensitive data is encrypted using AES (Advanced Encryption Standard) in GCM (Galois/Counter Mode) for robust data protection, ensuring confidentiality, integrity, and authenticity both in backend and frontend.
Storing Hashed Passowords for security enhancement.
General users receive short, unique URLs generated securely from UIDs. This ensures user-friendly links while maintaining data security.
rest will be updated

📂 Directory Structure

├── backend
│   ├── alembic
│   ├── app
│   │   ├── db           # Postgres Database
│   │   ├── routers      # API Endpoints
│   │   ├── workers      # Celery Tasks
│   │   ├── main.py      # FastAPI Application
│   ├── main.py          # Declared Main FasAPI Application
│   ├── .env             # Environment variables for the backend
│   ├── alembic.ini      # Generated Alembic file
│   └── Dockerfile       # Docker configuration for the backend
├── frontend
│   ├── app              # Next.js app router
│   ├── .env             # Environment variables for the frontend
│   └── Dockerfile       # Docker configuration for the frontend
├── nginx
│   └── nginx.conf       # Nginx configuration for backend and frontend
├── .env                 # Environment variables for the root
└── compose.yaml         # Multi-container orchestration

⚙️ Setup and Installation

1. Prerequisites

Ensure you have the following installed:

docker
nodejs (Optional)
python (Optional)

2. Clone the repository

git clone https://github.com/firedev99/glucoguide.git glucoguide
cd glucoguide

3. Environment Variables

Create a .env file the root directory

POSTGRES_USER=
POSTGRES_PASS=
POSTGRES_DATABASE_NAME=
PGADMIN_DEFAULT_EMAIL=
PGADMIN_DEFAULT_PASS=
REDIS_PASSWORD=
FLOWER_BASIC_AUTH=

Navigate to backend folder and create another .env file in that directory.

cd backend

FRONTEND_ORIGINS=
ACCESS_TOKEN_EXPIRES=
REFRESH_TOKEN_EXPIRES=
HASHING_SECRET_KEY=
JWT_SECRET_KEY=
JWT_ALGORITHM=
GOOGLE_CLIENT_ID=
GOOGLE_CLIENT_SECRET=
GOOGLE_REDIRECT_URI=
OWNER_EMAIL=
SMTP_PASSWORD=
SMTP_HOST=
SMTP_PORT=
POSTGRES_USER=
POSTGRES_PASS=
POSTGRES_HOST=
POSTGRES_PORT=
POSTGRES_DATABASE_NAME=
PGADMIN_DEFAULT_EMAIL=
PGADMIN_DEFAULT_PASS=
REDIS_PASSWORD=
REDIS_HOST=
REDIS_PORT=
FLOWER_BASIC_AUTH=
CELERY_BROKER_URL=
CELERY_RESULT_BACKEND=

Navigate to frontend folder and create another .env file in that directory.

cd frontend

NEXT_PUBLIC_MAPBOX_TOKEN=
NEXT_PUBLIC_ENCRYPTION_SECRET_KEY=
NEXT_PUBLIC_API=
NEXT_PUBLIC_URL=http://localhost:8000
# this is needed for nextjs middleware, cause the actual frontend is getting redirected from port 3000 to 8000 through nginx
NEXT_PUBLIC_OG_URL=http://localhost:3000

4. Create a `virtualenv` in the backend folder (Optional)

python3 -m venv venv

on mac activate using command source venv/bin/acitvate
on windows activate using command venv/Scripts/acitvate

5. Start the application

Run the application from the root folder using docker-compose command:

cd glucoguide
docker-compose up

After loading all the resources and databases you can visit http://localhost:8000 where Frontend and Backend services are automatically proxied through Nginx.

6. Run the Applications Locally (Optional / Will take other additional steps)

Frontend:

cd frontend
yarn dev

Backend:

make sure the backend virtual env is activated check this instruction.

cd backend
python main.py

7. Connect the PostgreSQL Database

Dpage/PgAdmin4:

Go to http:/localhost:8080 and add the following stuffs:

host: postgres
port: 5433
user: postgres
db: gluco_guide

Localhost Machine

If you intend to use the database with your locally installed applications like dbeaver or pgAdmin (desktop) just change the host to localhost

host: localhost
port: 5433
user: postgres
db: gluco_guide

Migrations

Run the backend cli container from docker desktop application or use the following command from terminal.

docker exec -it <container name> /bin/bash

Then run the following migration command:

alembic upgrade head

Seeding

Intially the database is empty, therefore after a successful migration we need to seed data into the database itself. Run the backend cli container from docker desktop application or use the following command from terminal.

docker exec -it <container name> /bin/bash

Then run the following seeding command:

python seed.py

Windows Users: Adjustment (for development mode) 🔧

Docker handles volumes differently in windows and if your platform is windows, inorder to view the changes in development mode you have to adjust a few steps in the frontend and backend containers from compose.yaml file.

# other containers
frontend:
  # ...other specifications
  # remove volume
  # volumes:
  #   - "./frontend:/app"
  # add this lines (enable watch mode)
  develop:
    watch:
      - action: sync
        path: "./frontend"
        target: "/app"
      - action: rebuild
        path: "./frontend/package.json"
      - action: rebuild
        path: "./frontend/next.config.mjs"
backend:
  # ...other specifications
  # remove volume
  # volumes:
  #   - "./backend:/app"
  # add this lines (enable watch mode)
  develop:
    watch:
      - action: sync
        path: "./backend"
        target: "/code"
      - action: rebuild
        path: "./backend/requirements.txt"

👻 API Endpoints

Endpoints	Method	Description	Params	Auth	Role
api/v1/auth/login	POST	Login with credentials	None	No	General
api/v1/auth/signup	POST	Signup with credentials	None	No	General
api/v1/auth/logout	POST	Log out the user	None	No	General
api/v1/auth/google	GET	Google redirect URL	Custom	No	General
api/v1/auth/google/callback	GET	Google callback URL	Custom	No	General
api/v1/send-email	GET	Send mail using Celery	None	No	General
api/v1/tasks/{task_id}	GET	Retrive the task details	id	No	General
`🏥 HOSPITALS`
api/v1/hospitals/all	GET	Retrieve all the hospitals	offset, limit	No	General
api/v1/hospitals/profile	GET	Retrieve all the hospitals	id	No	General
`🧜🏻‍♂️ DOCTORS`
api/v1/users/doctor/all	GET	Retrieve all the doctors	offset, limit	No	General
api/v1/users/doctors/profile	GET	Retrieve specific doctor profile	id	No	General
api/v1/users/doctors/{hospital_id}/all	GET	Retrieve all the doctors of a specific hospital	id	No	General
`🥶 PATIENTS`
api/v1/users/patients/profile	GET	Retrieve specific patient profile	id	Yes	Patient
api/v1/users/patients/profile	PUT	Update specific patient profile	id	Yes	Patient
api/v1/users/patients/profile/password	PUT	Update specific patient profile password	None	Yes	Patient
`❤️‍🩹 PATIENT HEALTH RECORDS`
api/v1/users/patients/health/records	Get	Retrieve Specific patient health records	id	Yes	Patient
api/v1/users/patients/health/records	POST	Create health records for specific patient	id	Yes	Patient
api/v1/users/patients/health/records	PUT	Update specific patient health records	id	Yes	Patient
api/v1/users/patients/health/records/glucoose	PUT	Update specific patient blood glucose records	id	Yes	Patient
api/v1/users/patients/health/records/pressure	PUT	Update specific patient blood pressure records	id	Yes	Patient
`🦹🏻 ADMIN USERS`
api/v1/admin/users/new	POST	Create new user	None	Yes	Admin
api/v1/admin/users/all	GET	Retrieve all the users	offset, limit	Yes	Admin
api/v1/admin/users/profile	GET	Retrieve specific user profile	id	Yes	Admin
api/v1/admin/users/profile	PUT	Update specific user profile	id	Yes	Admin
api/v1/admin/users/profile	DELETE	Delete specific user profile	id / [ids]	Yes	Admin
api/v1/admin/users/patients/new	POST	Create new patient	None	Yes	Admin
api/v1/admin/users/patients/all	GET	Retrieve all the patinets	offset, limit	Yes	Admin
api/v1/admin/users/patients/profile	GET	Retrieve specific patient profile	id	Yes	Admin
api/v1/admin/users/patients/profile	PUT	Update specific patient profile	id	Yes	Admin
api/v1/admin/users/patients/profile	DELETE	Delete specific patient profile	id / [ids]	Yes	Admin
api/v1/admin/users/doctors/{hospital_id}/new	POST	Create new doctor	id	Yes	Admin
api/v1/admin/users/doctors/all	GET	Retrieve all the doctors	offset, limit	Yes	Admin
api/v1/admin/users/doctors/profile	GET	Retrieve specific doctor profile	id	Yes	Admin
api/v1/admin/users/doctors/profile	PUT	Update specific doctor profile	id	Yes	Admin
api/v1/admin/users/doctors/profile	DELETE	Delete specific doctor profile	id / [ids]	Yes	Admin
api/v1/admin/users/doctors/{hospital_id}/all	GET	Retrieve all the doctors of a specific hospital	id	Yes	Admin
`❤️‍🩹 ADMIN PATIENT HEALTH RECORDS`
api/v1/admin/users/patients/health/records/new	POST	Create specific patient health records	id	Yes	Admin
api/v1/admin/users/patients/health/records/all	GET	Retrieve all the patient health records	offset, limit	Yes	Admin
api/v1/admin/users/patients/health/records	GET	Retrieve specific patient health records	id	Yes	Admin
api/v1/admin/users/patients/health/records	PUT	Update specific patient health records	id	Yes	Admin
api/v1/admin/users/patients/health/records	DELETE	Delete specific patient health records	id / [ids]	Yes	Admin
`🏥 ADMIN HOSPITALS`
api/v1/admin/hospitals/new	POST	Create new hospital	None	Yes	Admin
api/v1/admin/hospitals/all	GET	Retrieve all the hospitals	offset, limit	Yes	Admin
api/v1/admin/hospitals/profile	GET	Retrieve specific hospital information	id	Yes	Admin
api/v1/admin/hospitals/profile	PUT	Update specific hospital information	id	Yes	Admin
api/v1/admin/hospitals/profile	DELETE	Delete specific hospital information	id / [ids]	Yes	Admin

🤝 Contributing

1. Create a Branch

Create a new branch for your feature or bug fix:

git checkout -b feature/your-feature-name

2. Commit Your Changes

Commit your changes with descriptive message:

git add .
git commit -m "description of your feature"
git push origin feature/your-feature-name

3. Open a Pull Request

Navigate to the original repository on GitHub.
Click the Pull Requests tab.
Click New Pull Request and select your branch.
Provide a clear title and description of your changes, and submit the pull request.

👨🏻‍🍳 Merging and Syncing Updates

To add upstream remote to the forked repository, run the following command

git remote add upstream https://github.com/firedev99/nextjs-fastapi-docker.git

To synchronized with the original repository, run the following command

git fetch upstream
git merge upstream/master

👨‍🎨 Some Useful Commands to Help with inpecting this project

🔌 Github

Commit Changes

git add .
git commit -m "commit description"
git push -u origin master

View Existing Remote URL

git remote -v

Change the "origin" Remote's URL

git remote set-url origin https://github.com/user/repo2.git

📦 Docker Compose

If you want to run your services in the background, you can pass the -d flag (for "detached" mode) to docker compose up and use docker compose ps

Initialize or Run containers in detached mode w/o building new images:

docker-compose up -d

Rebuild containers and run the docker instance:

docker-compose --build

If you started Compose with docker compose up -d, stop your services once you've finished with them

docker-compose stop

You can bring everything down, removing the containers entirely, with the command:

docker-compose down

List the local volumes, images, containers:

docker volume ls
docker image ls
docker container ls

Remove all dangling images. If -a is specified, also remove all images not referenced by any container, remove all the containers, remove volume.

docker image prune -a
docker container prune
docker volume prune
docker volume rm <volume name>

🛠️ IP Address Listing

# for mac users
cat /etc/hosts
sudo lsof -iTCP -sTCP:LISTEN -P -n
sudo lsof -i TCP:PORTNUMBER (PORTNUMBER e.g, 3000)
# or
sudo lsof -i :PORTNUMBER (PORTNUMBER e.g, 3000)

The /etc/hosts file is a plain text file that maps hostnames to IP addresses for the local host and other hosts on the internet.

# for windows users

netstat -a -n -o

🫙 PostgreSQL Cluster

Check if the port is accepting connection or not from PostgreSQL Cluster with the following command:

pg_isready -h localhost -p 5433

📄 License

This project is licensed under the MIT License. See the LICENSE for details.

⚓️ Ports

Main Application / Nginx: http://localhost:8000
Backend Server: http://localhost:8001
Frontend Client: http://localhost:3000
PgAdmin (DB Software): http://localhost:8080
Redis Insight (DB Software): http://localhost:5540
Flower Task/Worker Monitor: http://localhost:5555
PostgreSQL Hosting Port: 5433
Redist Hosting Port: 6379

💬 Contact

If you have any questions, feel free to reach out:

Github - @firedev99
Twitter - @firethedev99
Email - firethedev@gmail.com

Name		Name	Last commit message	Last commit date
Latest commit History 82 Commits
backend		backend
frontend		frontend
nginx		nginx
.dockerignore		.dockerignore
.gitignore		.gitignore
README.md		README.md
compose.yaml		compose.yaml

firedev99/glucoguide

Folders and files

Latest commit

History

Repository files navigation