A simple Web Application built with FastAPI, React and Websocket. This project was created to consolidate my learning in these technologies and gain confidence in using them for more complex software.

• Git
• Python 3.9+
• Docker (recommended)
• Node.js

git clone https://github.com/GabrielReira/fastapi-react-websocket-app.git
cd fastapi-react-websocket-app

To run both the backend and frontend, use the single command bellow that will build and start all services:

docker-compose up --build

You can also run the backend service separately, either with or without Docker.

1. Go to backend folder

cd backend

2. Build and run the Docker image

docker build -t app-backend-image .
docker run -dp 8000:8000 app-backend-image

To run with a Docker volume for persistent data storage:

docker volume create app-db-volume
docker build -t app-backend-image .
docker run -dp 8000:8000 -v app-db-volume:/app/data app-backend-image

1. Go to backend folder

cd backend

2. Create a virtual environment

python -m venv venv

3. Activate your virtual environment

source venv/bin/activate  # for Mac/Linux
venv\Scripts\activate  # for Windows

4. Install the required dependencies

pip install -r requirements.txt

5. Start the FastAPI server

uvicorn main:app --reload

The frontend can also be run separately, either with Docker or not.

1. Go to frontend folder

cd frontend

2. Build and run the Docker image

docker build -t app-frontend-image .
docker run -dp 3000:3000 app-frontend-image

1. Go to Frontend folder

cd frontend

2. Install dependencies and start the React server

npm install
npm start

• Backend (FastAPI): Your backend app will be running on http://localhost:8000. Take a look at the API documentation at http://localhost:8000/docs.
• Frontend (React): Your frontend app will be running on http://localhost:3000.

Feel free to connect with me on LinkedIn