Thank you for this! I just completed it and it worked. I ran into a depreciation inside of the .flaskenv file
FLASK_APP=base.py
FLASK_ENV=development
The variable FLASK_ENV wasn't supported anymore but the terminal recommended a working solution which was:
FLASK_APP=base.py
FLASK_DEBUGGER=true
I also ran into some issues because I placed my folders inside of the wrong folders. What ended up working for me was
Base_Directory_named_whatever
-frontend_directory
-backend_directory
and I placed all the flask stuff inside of the backend (including my virtual env)
and all of the react stuff inside of the front end.
I also had a git issue where things started to get a little bit messy. It was because I ran a git init in the wrong folder. SO i made sure that I deleted the .git filed to reset it all. Then I went into the basedirectory (the folder that contains frontend and backend) and created a git init from there.
Finally on the package.json edit. It wouldn't work for me unless I deleted the grey newline text from the images above. I added the //newline at the ends of the 2 lines we added in and it caused an error every time I tried to launch my react page. Also make sure not to forget that comma from the image because I did and it also caused a crash.
Lastly I was having a hard time getting the "start-backend" part to work correctly. It was because I had to make sure the the cd part correctly pointed to the exact location of my virtual environment. So for me it was up a directory and inside of the backend folder then to my virtual env.
something like "start-backend": "cd ../backend && backend_env/bin/flask run --no-debugger",
The npm install axios command worked like a charm when I did it inside of my frontend directory.
Lastly the .gitignore worked great from my basedirectory. I thought to I had duplicated one because I'd found one inside of my frontend directory as well but it seems like that one has it's own automated gitignore that react creates. So I ended up with 2 total. The one you created and the one that react created.
It took about 48 hours of tinkering and making sure my paths and syntax were correct but it all worked out! I'm REALLY REALLY REALLY happy that you put this up!
My next step is to deploy it to a platform like Heroku or AWS.
Faruq,
Thank you SO MUCH!! This walkthrough was great and the pictures were a HUGE help. Also the explanations about WHY you did things helped me even more.
Sorry for the long message and I hope this helps anybody with any issues that they might have ran into.
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Thank you for this! I just completed it and it worked. I ran into a depreciation inside of the .flaskenv file
FLASK_APP=base.py
FLASK_ENV=development
The variable FLASK_ENV wasn't supported anymore but the terminal recommended a working solution which was:
FLASK_APP=base.py
FLASK_DEBUGGER=true
I also ran into some issues because I placed my folders inside of the wrong folders. What ended up working for me was
Base_Directory_named_whatever
-frontend_directory
-backend_directory
and I placed all the flask stuff inside of the backend (including my virtual env)
and all of the react stuff inside of the front end.
I also had a git issue where things started to get a little bit messy. It was because I ran a git init in the wrong folder. SO i made sure that I deleted the .git filed to reset it all. Then I went into the basedirectory (the folder that contains frontend and backend) and created a git init from there.
Finally on the package.json edit. It wouldn't work for me unless I deleted the grey newline text from the images above. I added the //newline at the ends of the 2 lines we added in and it caused an error every time I tried to launch my react page. Also make sure not to forget that comma from the image because I did and it also caused a crash.
Lastly I was having a hard time getting the "start-backend" part to work correctly. It was because I had to make sure the the cd part correctly pointed to the exact location of my virtual environment. So for me it was up a directory and inside of the backend folder then to my virtual env.
something like
"start-backend": "cd ../backend && backend_env/bin/flask run --no-debugger",
The npm install axios command worked like a charm when I did it inside of my frontend directory.
Lastly the .gitignore worked great from my basedirectory. I thought to I had duplicated one because I'd found one inside of my frontend directory as well but it seems like that one has it's own automated gitignore that react creates. So I ended up with 2 total. The one you created and the one that react created.
It took about 48 hours of tinkering and making sure my paths and syntax were correct but it all worked out! I'm REALLY REALLY REALLY happy that you put this up!
My next step is to deploy it to a platform like Heroku or AWS.
Faruq,
Thank you SO MUCH!! This walkthrough was great and the pictures were a HUGE help. Also the explanations about WHY you did things helped me even more.
Sorry for the long message and I hope this helps anybody with any issues that they might have ran into.