Hosting your react-native express.js backend on Heroku.
Usaid
Posted on May 19, 2021
You have created an app in react native and written backend in expressjs/nodejs and you want to host your backend so you can get or post data on your app from anywhere?
Answer: Heroku.
Here's how:
- Create a Heroku account on www.heroku.com
- Install Heroku CLI.
// for mac:
brew tap heroku/brew && brew install heroku
// for ubuntu:
sudo snap install --classic heroku
- After Heroku CLI has been installed, open the terminal and just login with your credentials
// type this in your terminal to login:
heroku login
- When you have logged in you can create a heroku app by executing this command:
heroku create
Once the heroku app has been created you will see the app name, remote git link and the site url.
Add heroku remote branch:
heroku git:remote -a your-app-name
- Heroku git remote will be added and you can check that by:
git remote -v
- Add Procfile to the root of your backend folder, eg:
-ReactNativeAppFolder
-MainBackendFolder
-routesFolder
-Routes.js
-modelsFolder
-Schema.js
-app.js
-package.json
-package-lock.json
-Procfile
Procfile is needed to tell heroku to run node app.js on it's server, so your app can start and run.
You don't need to push the whole react-native app to heroku you can just push your backend folder to it, here's how:
git subtree push --prefix MainBackendFolder heroku master
// this specific command makes sure that only backend folder gets pushed to heroku.
After the build and push is successful heroku will tell you that your app is being hosted on a specific url.
You can then add the specific url however you want to on your get and post request urls. That is it.
Posted on May 19, 2021
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.