Nowadays, in most cases we see that there's a backend that provides an API and various front-end technologies like React, Vue, Mobile apps use this...
For further actions, you may consider blocking this person and/or reporting abuse
Just want to say that this tutorial SAVED ME! I was struggling getting my setup to work after following other guides online, including another one from this site. This one not only fixed my issues but actually made my setup a lot more straightforward. Thank you thank you thank you!!!
Another thing to add for those using this tutorial as a skeleton for their project.
Once you update the Frontend you will need to run two commands:
Otherwise you will run into a Template not found error.
Happy Hacking!
I did all the steps but now I am getting
GET http://127.0.0.1:8000/static/css/main.ab7136cd.chunk.css net::ERR_ABORTED 404 (Not Found)This is a late reply :-), but did you manage to solve it? I have the exact same problem.
Most probably your directory structure is not right.
You can check out this repository for an example:
github.com/shakib609/django-react-...
Thank your for your answer. I have the same structure as you. I can read the index.html file, and the js-files under static/js, but for some reason not the css under static/css. I used a CDN in index.html today to make it work today, but that is a second option.
Hi there, thank you for your guide. I have followed to the end and met a problem that build success but deployment failed.
Stackflow said this is something about connection number. But it's a new app and should not have several connections. Any clue? Thank you very much!
I solved this problem by deleting this line in Procfile:
release: python manage.py migrateFollowing this stackflow Link.
Of course I don't know what happened. I would appreciate it if you explain somehow.
[SOMEWHAT SOLVED] Hi Shakib!
Great post! It was exactly what we were looking for given our tech stack.
Unfortunately I am having issues with building the project and I'm not sure what I'm doing wrong.
I get this error:
remote: -----> Build succeeded!
remote: ! Unmet dependencies don't fail yarn install but may cause runtime issues
remote: github.com/npm/npm/issues/7494
remote:
remote: -----> App not compatible with buildpack: buildpack-registry.s3.amazonaws.co...
remote: More info: devcenter.heroku.com/articles/buil...
remote:
remote: ! Push failed
remote: Verifying deploy...
remote:
remote: ! Push rejected to r-d-test.
remote:
If anyone can give any hints to what I might be doing wrong that would be great.
I followed the directions down to the key and checked the current comment suggestions as well...
The Procfile and requirements.txt are correctly in the root of the project as well...
It looks like my react part of the project works fine but something wrong with the python buildpack...
[UPDATE]
So I discovered that we needed to update the .wsgi file which I found in the source code but clearly not a part of the tutorial. I think it would be helpful to add that section after the testing of the app if it works locally.
[EDIT]
Sorry, so when I ran the deployment when I did this I did not realize my partner had changed it.
The original settings should work.
Ran into the same problem.
It was fixed when I actually committed my work before pushing to master.
Specifically, I ran the following before "$ git push heroku master" :
Hey Ryuichi,
I ran into the same error you were having. Can you please share what fixed the problems with the python buildpack in the
wsgi.pyfile?Sorry for the late reply. Can you share with me what modifications you had to make to the
wsgi.pyfile? In my case I didn't have to modify it, that's why I did not include it in the tutorial.Sorry for the late reply.
I had finished the project and then COVID happened.
I looked back and actually the default wsgi.py settings were correct.
My partner had changed it without telling me...
Thank you for this guide and repo! It was very helpful.
At first it didn't work for me, but adding this on line 12 in settings.py fixed it:
import django_heroku
Glad that you found the post useful and thanks for pointing out the mistake. I forgot to import that when I was writing the tutorial.
Hi folks, I am getting this error with blank page whiled deployed on heroku, Uncaught SyntaxError: Unexpected token '<' , though i am able to run the app on local host..could any one suggest ..:) thanks in advance
Finally !!! i fixed all the errors i encountered during the deployment 😭️ (tears of happiness). I pushed my code on bitbucket to save your hours of debugging.
Here's the link bitbucket.org/Yash-Marmat/fullstac...
I hope it helps. Good Luck 👍️
Unable to access admin.
My assumption was that heroku runs django as the main app which then routes to React. However if that were the case then I should be able to access admin since I listed 'admin/' before the index file for React.
Is there a way to access admin using your method of deployment?
I followed your method , and configured CORS too, it works in development , but when i tried it in production it says that due to CORS it cannot accessed. Can anybody explain why? What am i doing wrong?
Hi, you can use this django package to configure CORS behavior in production too.
I have a project with
Django. I am want to migrate it withReact. Is using React throughCDNis a good idea?TemplateDoesNotExist at /
index.html
can you please take a look?
TemplateDoesNotExist at /
index.html
can you please take a look?
TemplateDoesNotExist at /
index.html
can you please take a look?
dev-to-uploads.s3.amazonaws.com/up...
I create a app using method 2. Can you tell me how I can deploy project with this method?
TemplateDoesNotExist at /
index.html
can you please take a look?
prnt.sc/19jd50e
TemplateDoesNotExist at /
index.html
dev-to-uploads.s3.amazonaws.com/up...
can you please take a look?
TemplateDoesNotExist at
index.html
can you please take a look?
prnt.sc/19jd50e
Has anyone else had issues with the typescript flag? It doesn't seem to work for me when using npx create-react-app. Does it only work with yarn?
Looks like you need to use
--template typescript. Maybe it's changed since this was written.