When you need to practice continuous deployment on a mini cloud with less or small effort — Heroku comes as handy platform to be used (+ it comes as free for many basic stuff).
So in this post you will have step by step instructions how to setup a the basics for a NodeJS project in less than 20 minutes.
Git repository
Heroku offers: two more basic integrations with Git (Heroku CLI and GitHub) and one a bit more advanced (Container Registry). Depends on your project you will choose the appropriate one. If you prefer to work with a simple solution and to avoid your code to be dependent on Heroku repository, I would suggest using GitHub, since from there you can place git hooks on many different platforms.
Therefore make your new git repository on GitHub, initialize it and move to Heroku to start with the integration.
Heroku
Once you login to your Heroku account, click on “New” button and select “create new pipeline”.
On the pipeline configuration screen, enter :
- Pipeline name — which refers to the name of the new project.
- Connect GitHub (if not connected)
- Enter repository name (in small case) as named in GitHub
https://github.com/<YOUR_USERNAME>/<REPO_NAME> - Click on “Search” button, and once repository is found, it will be listed below.
- Click on “Connect”
If everything goes well you can proceed by clicking on “Create pipeline” button at the end of the screen.
Before you continue with further configurations of the pipeline, make sure you have branches for dev/test/production on your git repository (if needed).
Once pipeline is synced between GitHub and Heroku, you can start with modifications on the environments and review settings for CI/CD.
Enable App Reviews (PR)
If you want to enable automatic build for each pull request on a specific branch, where you can test the app before merge is made with master branch you can click on “Enable App Reviews”
In the side menu you can specify your needs by clicking on the checkboxes, were each of them does the following:
- “Create new review apps for new pull request…” — once the developer make new pull request in git, the pipeline will trigger to the event, and it will create new image of your project, that you can use for testing.
- “Wait for CI to pass” — this feature will provide good logs for you of how the application is deployed to Heroku and in case of error why isn’t working.
- “Destroy stale review apps automatically” — once PR is created and no one pays attention to it, or it is tested but not handled properly in git, using this feature the build image will be auto removed from Heroku.
- To gain on efficiency and avoid extra hoops in the traffic, select the region that fits the best for your location.
Once you are done, you can continue with further modifications and settings of the environment, by clicking on “Configure” and then selecting “More settings”.
For you to be able to see all the updates from this configuration, and have them tested, on the same screen card, click on “+ New app”, where you will have to select the branch from which build will be made, once you make PR to that specific branch.
You will get new info at the bottom of how, the deployment went and status for it. While also if you click on “Open app” you can see the app in browser.
Once you configure the reviews, you can follow the same steps for the stage and production environment, but notice that you will have to provide proper branch for these apps.
NodeJS Project
It is now time to prepare the NodeJS project that will be deployed to the pipeline. You can work with source code directly or create Docker image that will be deployed. In our case we will use the source code approach.
Package.json
In the package.json file it is necessary that you have included dependencies and devDependencies properly, but also to execute (start) the project using npm scripts, hence Heroku uses them to init the project.
Heroku by defaults executes the “npm start” script from package.json in order to start the project.
Example package.json file
you can change the start script with proper command that needs to be executed for your app.
Server.js
We will use minimal server configuration for NodeJS with Express for the purpose of this demo.
In the file you can see that all static content is served from a folder called “public” and also there is a route “/params” that will display all node environment variables for the purpose of testing — *remove this line in production
So now, once I’ve pushed the files to the branch, new build was made. You can see the log of the build and see what went well or bad while building process.
Now I have a successful build and I’m ready to test it in browser.
For my project, I have following url: https://medium-heroku-story-gu7mmlqlxf.herokuapp.com/ . Opening this URL should default to the index.html page from /public folder, so the expected result would
while if I navigate to the https://medium-heroku-story-gu7mmlqlxf.herokuapp.com/params url, I should be able to see all heroku environment parameters that are used with Node.js server.
As you can see from the image above, the Heroku is using port 20805 for internal purpose, while it is auto exposed to port 80. You will need to make extra configuration into the server.js file in case you want to use another port, or create Procfile for Heroku to specify which port should be exposed for your app.
With all of these you are ready to deploy you application using Heroku, and it will be auto deployed every time you push new stuff to the selected branches in Heroku for build.
Link to the git repo with all files used, you can find at following url: https://github.com/igorjos/medium/tree/heroku-story
Feel free to ping me for more info.
Other stories from me: https://medium.com/@yoshevski
Thanks for reading.
