Deploy Angular Universal app to Heroku for Free

Deploying any web application is required more analysis about performance, cost, and whatnot. For a simple test of your application or any MVP application, I found Heroku is one of the best options. I have used it much time to verify my work or show demonstration to others.

I am assuming that you have already created an angular with Universal application. If not please check out my previous blog and create one application. The codebase which I have used for the demo has been uploaded to GitHub, feel free to check this out. Github Demo Application link


Step 1: Open the package.json file and rewrite few dependencies from ‘devDependencies’ to ‘dependencies’.

"@angular/cli": "~9.0.3",

"@angular/compiler-cli": "~9.0.2",

"@nguniversal/builders": "^9.0.2",

"@types/express": "^4.17.0",

"@types/node": "^12.11.1",

"typescript": "~3.7.5"

If you are using bootstrap 4 and installed it using npm library, the below change you need to do in angular.json file under architect > build > options section.

"scripts": [





Step 2: I hope you have a GitHub account, if not please create one account and push all code to the GitHub repository.


Step 3: Create an account in Heroku or if you have it already, please create one account.


Step 4: Create one application there as well.


Step 5: Connect your GitHub account with your Heroku application and deploy it.



That's it, please check out my video on youtube as well. 


Happy Coding!

- LP