Connecting-React-Frontend-to-a-Flask-Backend
Connecting-React-Frontend-to-a-Flask-Backend copied to clipboard
Connecting a React frontend to a Flask backend, then performing a fetch from the Flask backend.
Requirements ,Usage and Installation
Backend - Flask
Installation
1 .Clone the git repo and create an environment
Depending on your operating system,make a virtual environment to avoid messing with your machine's primary dependencies
Windows
git clone https://github.com/Dev-Elie/Connecting-React-Frontend-to-a-Flask-Backend.git
cd Connecting-React-Frontend-to-a-Flask-Backend/backend
py -3 -m venv venv
macOS/Linux
git clone https://github.com/Dev-Elie/Connecting-React-Frontend-to-a-Flask-Backend.git
cd Connecting-React-Frontend-to-a-Flask-Backend/backend
python3 -m venv venv
2 .Activate the environment
Windows
venv\Scripts\activate
macOS/Linux
. venv/bin/activate
or
source venv/bin/activate
3 .Install the requirements
Applies for windows/macOS/Linux
pip install -r requirements.txt
4 .Migrate/Create a database - Optional during initial set up
Applies for windows/macOS/Linux
python manage.py
5. Run the application
For linux and macOS Make the run file executable by running the code
chmod 777 run
Then start the application by executing the run file
./run
On windows
set FLASK_APP=routes
flask run
OR
python routes.py
Frontend - React
Installation
You just need to install the packages listed on package.json, on the frontend folder.
cd Connecting-React-Frontend-to-a-Flask-Backend/frontend
npm install
npm start
Updating pip packages
In an active virtual environment install updates using the command:
pip list --outdated --format=freeze | grep -v '^\-e' | cut -d = -f 1 | xargs -n1 pip install -U
Update the reqirements.txt file.
pip freeze > requirements.txt