How to Deploy A React App To A Shared Web Hosting (CPanel) - Explained
HTML-код
- Опубликовано: 28 сен 2024
- #React #ReactJS #JavaScript #100DaysOfCode
For deploying a react app on a shared hosting you need to create a production build. Production build is a pack of all your react code and its dependencies. in most shared hosting we put our site/app inside a public_html directory so if we hit www.yourdomain.com it serves the code from public_html directory. Follow along with this short video to get your react project up and running in less than 4 minutes.
- Run React App Build command: npm run build
- Remember to zip the build folder in order to successfully upload the project to any hosting platform.
- Congratulations, your is now up and running.
Support the Channel:
Host Your Application: hostinger.com?REFERRALCODE=1CASULEMARC11
Items Used in This Channel:
Surge Protector Power Strip: amzn.to/3Z7iWzQ
Solatek Plugin Dusk to Dawn LED lights: amzn.to/3CfFl3Y
Phone Tempered Glass: amzn.to/3VEq5UY
Phone Case: amzn.to/3G5xI1f
Maxpower Pet Brush: amzn.to/3GyOZRM
Follow and Reach me at:
Website: devmarkcodes.n...
Github Repo: github.com/mka...
Twitter: / elitebytecode
Dev Community: dev.to/casulemarc
HOW TO DEPLOY A REACT APP WITH REACT ROUTER DOM TO A SHARED WEB HOSTING VIDEO - ruclips.net/video/9wwdIyzX6cY/видео.html
where is env file?
Great video🎉🎉🎉, was wondering if you could help me out with this. I tried updating a website using this same process but it doesn't seem to be working, any ideas please? I've cleared my cache by the way, used incognito and all that.
Did you rebuild the application after you made changes? If not you may want to do so before uploading it to host
hello friend, thank you for this amazing content. if its possible, can you say why the routes i create with react-router-dom dont work when i hosting with this method?
This can be a number of reasons but I suspect it’s possibly how you are linking to your page components. Also make sure you deploy the production app with in build directory. You can achieve this by running - ‘npm run build’ before you deploy
Hope this resolves your issue
Thank you brother
No problem 😊
Great video❤..... Can you create a video like this using hostinger shared web hosting. It will be so helpful
I believe the process would be the same. Are you facing any particular challenge to host it on that platform using this guide? Please share, thanks for the feedback!
@@elitebytecode It was the absolute same…. Thank you so much❤️
@@tikki1683 excited to know that you resolved it. Let me know if you need any further assistance. Happy coding!
Do you plan to release full stack tuts?
Yes! there is a full-stack course coming in the near future.
What if you have JSON data that runs as backend
@mhthodol, you will have to host your db as well separately. MongoDB is pretty good at this, also hosting platforms offer this service as well in the control panel. Yet to upload another video that explains this in detail.
Good content!
Thank you, Racheal!
Learn Javascript ES6+: ruclips.net/video/auQOtgxj1nk/видео.html
vl
Hi there!,
i have uploaded my build using filezilla now routes are not working, someone knows how to fix it
This could be due to how you added the links, please share a snippet of where you used router in your code.
I have uploaded my files and I don't want them on a subdomain but on a page. I assigned that page as homepage but its not showing on the front end.what should I do
Are you uploading the files to the actual domain name directory? If possible an you reach to me via Twitter (X) with photos so we can track and fix this up?
@elitebytecode
when hosting like that, where do I place env variables?
normally some variables are updated in the Hosting Database. these should be updated in your local app. I can upload a video for this
hi there, what about I want to utilise the Yoast SEO service in wordpress? it keeps on telling me JSON error etc when I trying to configure it at Wordpress panel...
Bluehost Shared Hosting plan
Hi there, sorry to hear that you have this issue, try uninstalling the the last installed plugins one at a time and investigate whether the issue persists, note down each plugin you uninstall for future reference/re-installation. When the error goes after un installing a particular plugin, then it’s that plugin with the issue
For creating shared hosting required to buy any of the plane , nobady giving free..
Netlify gives frontend static applications for free. Here is tutorial on how to do this - ruclips.net/video/6B4vgWYb0p4/видео.htmlsi=TF1-unocvOrBNvkW
Nice content Elite...
Love your terminal, how did you do that
Thank you, Godson, I.m using iterm2 and OMZsh. here is an installation process please reach out or comment back here once you are stuck in the process of installation. it can be confusing at first. - github.com/ohmyzsh/ohmyzsh
you helped me alot
Thank you, glad i helped out
I have been looking for this, thanks mKasule coder
Glad it was helpful
How did i miss this one, in anycase good stuff mac
thank you Shakirah
This has a problem.
If you try and use React routing then visiting subdirectors on that site will return error 404.. this is the problem I am having right now and cannot get a working solution for
Please let me if you’re still running into issues. I’ll upload a video with React router dom
@@elitebytecode I think I found my problem. My host does not support react. So it was a me problem after all.
Here is a my new walk-through to fix your issue - HOW TO DEPLOY A REACT APP WITH REACT ROUTER DOM TO A SHARED WEB HOSTING VIDEO - ruclips.net/video/9wwdIyzX6cY/видео.html
@@elitebytecode You gained a subscriber! an da like! Thank you, I an watching your new video now.
@@scriptles I hope this solves the problem you're running into. Please let me know if you still run into any issues.
Great content bro ,keep it up
Thank you for the kind words Milgo
thank you
your welcome Josh
I have project idea, lets keep in touch, thanks for you content
Please reach out to via Twitter or Instagram - mKasule Coder, Thanks