Winner's Excogitations

A chronicle of the thoughts, learning experiences, ideas and actions of a tech junkie, .NET, JS and Mobile dev, aspiring entrepreneur, devout Christian and travel enthusiast.

[HOW TO] Deploy an ASP.NET Core SPA app to Heroku

6 years ago ยท 2 minutes read

Recently decided to try my hands at ASP.NET Core with an SPA, Angular to be precise. It was pretty simple to set up in fact. It was as simple as running dotnet new angular in the target folder and tada I had a fully formed template in the folder with a few goodies baked in. The folder structure generated is shown below

After making minor tweaks, I decided to deploy it and decided on Heroku. Now, while Heroku does not have official support for .NET Core, there are a few great open source buildpacks out there in the wild. The one I have worked with for over a year is developed and maintained by @jincod over at GitHub. Over the year i have been working with the build pack I have seen several advances made, from support for projects with migrations to the huge reduction in the generate slug size and a host of other things. Therefore, in trying to get this project deployed, I defaulted to that again and hit a few roadblocks which I was able to work through or around and why I am writing this guide.

Before getting into the meat of this guide, I would assume that you have created your heroku app, linked the app to your local git repo and have logged in to heroku on your machine via the heroku CLI. If you have not, please run heroku login and follow the prompt. That done, change into the heroku app directory and lets proceed:

Add the official node JS buildpack to your app:

 heroku buildpacks:set --index 1 heroku/nodejs

Add the .NET buildpack to your app

heroku buildpacks:set --index 2 https://github.com/jincod/dotnetcore-buildpack

If you tried deploying your code to heroku at thige.jso9ns point, you would get a build error. That is because the nodejs build pack looks for a package.json file in the root of the repo and since there is none, it fails. To combat that, run

npm init -y

this adds a basic package.json file and we are good to go. Deploy your app by running

git push heroku master

(this assumes that you named your heroku remote heroku). That is all people, now go forth and build awesome things.

Cheers

Share on:
[HOW TO] Perform CRUD Operations with C# and MongoDB using LINQ
How to store, update and retrieve data from MongoDB using LINQ.
Clustering in NodeJS
A walkthrough showing how to make use of the cluster module in nodejs
Winner-Timothy Bolorunduro
Winner-Timothy Bolorunduro is a senior .NET developer with over 6 years experience helping organizations and individuals build compelling, stable and scalable web applications. Having spent the last three years in a fast-paced startup environment working remotely, he understands what goes into being part of a team that produces value for clients.

Comments