Deploying a React JS Project to Heroku from GitHub
Let’s do some deployment to Heroku. I usually prefer Azure. However, students may not have access to a credit card. So, I was forced to find a simpler solution.
The repository is available here, https://github.com/Jay-study-nildana/StarterNASAAPODReactJSWithHeroku
If you need some knowledge about this react app, try this, React JS Starter — Consumes NASA APOD API with Redux and Thunks | by Jay | ProjectWT | Jul, 2022 | Medium
Okay, let’s begin.
First, I had to create an account on the heroku website. Remember to turn on 2 factor authentication when you create any account, including this one. Dont forget to keep your backup keys safe when you use 2 factor authentication.
Then, you get the dashboard:
After this, create a heroku app. Then, connect your heroku account to your GitHub account. Then, find the repository you are looking for, and link it up with the app you just created.
Here, you can trigger a manual deployment.
Also, you could setup automatic deployment, which I recommend. I went ahead and linked it up with the main branch. Any changes to the main branch, boom, app gets deployed. It’s always cool to see your app coming alive with every code change.
Note : I am assuming that you already have a ready to deploy ‘node JS react JS’ project in a single github repository. If you dont’ have one, simply, fork or clone any of my projects from the link that I have provided in the beginning of this post.
I did run into an error like this.
I deleted the conflicting lock files. Then, once I pushed the changes, the app was deployed. Easy.
That’s all there is to it. I have to confess, this was easier than I thought.
I work as a full time freelance coding tutor. Hire me at UpWork or Fiverr or Stack Overflow. My personal website is here. Find more of my art at Behance and Unsplash. Also, I have a Podcast about everyday life. And, a 2nd Podcast, where I talk about freelancing.