How to Run .NET on Heroku

.NET Core continues Microsoft’s shift towards a more open development philosophy. It is open-source and cross-platform. With a little bit of setup, you can get a .NET Core web app running on Linux-powered Heroku. This guide will walk you through it.

This guide is catered for development on Windows, even though the resulting web app runs on Linux via Heroku. .NET Core (the framework) is cross-platform, but Visual Studio (the IDE) is not… yet. However, there are solutions for running Visual Studio on Mac.

.NET Core and Heroku logos

Prerequisites

Make sure you have all of the following prerequisites ready to go.

Create the Solution

Fire up Visual Studio, then go to File > New > Project.

Navigate to Installed > Templates > Visual C# (or Visual Basic, if that’s your thing) > Web. Select ASP.NET Core Web Application (.NET Core). Pick your Name (I’m using “dot-net-heroku” here) and set Location to the directory you want the solution directory to be created within. Check both Create directory for solution and Create new Git repository. Click OK to proceed.

Visual Studio new project dialog

On the next screen, select Web Application (Web API works too, if that’s what you want). Click OK.

Visual Studio template selection dialog

At this point you have a brand new solution. We’ll need to tweak it a bit, though.

Modify the Solution

Still in Visual Studio, go to View > Other Windows > Package Manager Console. This will give you a console with a PM> prompt. Execute the following command.

Now open up Program.cs for some edits. Near the top, add the following using directive.

Then update the Main() function as seen below.

Your Program.cs should look like mine. With that, the solution is ready for deployment. Now to take care of things on the Heroku side.

Create the Heroku App

Open up your command line terminal of choice and navigate to the solution directory. Make sure you’re logged into Heroku.

Create the Heroku app with whatever name you want.

Now to add the buildpack. I’ve had the best results with noliar’s fork, so that’s what I’m using here.

Finally, set up Git to deploy to Heroku and push.

Give the deployment some time to finish up, and there you have it. Go to http://your-app-name.herokuapp.com/ (with your app name, obviously) and you’ll see your .NET web app running on Heroku. It should look like mine.

Chrome screenshot of a .NET Core web app running on Heroku

What you’re seeing is the default index page for the template we used. At this point you’re ready to delete the default pages and start working on your own.

Bonus: Hooking up to GitHub

You’ve got your .NET web app inside a local Git repo, but maybe now you want to add it to GitHub. Start by creating a new repo. To avoid conflicts, don’t initialize with the readme, license, or .gitignore files (you can add these later).

Creating a new GitHub repo

Back in your terminal, run these commands. Replace “your-username” and “your-repo-name” as appropriate.

If you get a pop-up about security credentials, cancel out of it and enter your credentials in the terminal.

If the terminal won’t accept your credentials, it may be because, like me, you have 2-factor authentication enabled. In this case, create a personal access token with repo access and use it in place of your password.

Closing Remarks

It’s great seeing .NET break out of its Windows-only ecosystem to embrace the more open and cross-platform community of modern web development. Also, big thanks to noliar and all the other contributors for maintaining the .NET buildpack I’m using in this guide.

Regex Storm Goes Open Source

I love regex. So four years ago, I dedicated dozens upon dozens of hours to create the best regex testing and reference site I could. I called it Regex Storm. I’ve already talked about the experience in a previous retrospective.

Regex Storm screenshot

Still Kicking

The site is still online and still fully functional, as far as I know. In fact, despite doing barely anything for it in the past few years, traffic is actually growing.

Regex Storm visits per month

I still get email now and then from someone telling me how useful it is. I’m glad! I plan to keep it online as long as I can, but I still have no plans to continue development on it. The thing is, Regex Storm is woefully outdated. The markup is XHTML! The CSS has browser-specific hacks for Firefox 3! The ajax is an antiquated mess of .NET postbacks via UpdatePanels! At this point, it would be better to start from scratch, but that’s not something I’m willing to take on right now.

Open Sourced

I’ve decided to release the codebase for Regex Storm, even if it is a bit outdated. Not that I expect anyone to pick up development. I just don’t have a good reason to keep it closed source. And maybe there are still some good nuggets of code in there somewhere — or at the very least, something for people to rummage through for nostalgia’s sake. Also, to be honest, it’s been taking up one of my paid private repo slots on GitHub, so I may as well.

Feel free to poke around in the Regex Storm GitHub repo.

My Website Talks to Itself

This post talks about how I sped up a good chunk of my page loads by 6-10 seconds (no joke) and why I had such terrible load times to begin with.

What Happened?

My blog pages run on PHP, but every other page on my site is part of a .NET web app. By default, IIS will shutdown a web app after 20 minutes of idle time to save resources. Shared hosting providers often crank that time down even further as a cost saving measure. My host uses a timeout of 5 minutes.

In other words, if no one visits my site for 5 minutes, it shuts down, and the next person to visit gets to wait for IIS to start it back up. Unfortunately, Coder’s Block does some pretty heavy lifting on startup:

  • It uses SuperFeed to reach out to 6 social media APIs, parse the results, and display them as a feed on my home page.
  • It dynamically resizes and crops the images shown within the feed.

This is where the 6-10 second delay comes from. I cache the results, but the cache is wiped every time IIS shuts down my site — which is pretty often, given that short 5 minute window.

The Game Plan

Here’s the plan: make something that pings my site every 4 minutes. In theory, this ensures my site is never idle for 5 minutes, so IIS won’t shut it down, the cache stays alive, which means subsequent page loads don’t have to redo all that heavy lifting, cutting out that 6-10 second delay. How’s that for cause and effect?

And so I wrote a tiny utility that lets my site ping itself every 4 minutes. My site is basically talking to itself to stay awake.

Introducing EverPing

All it does is hit a URL, repeatedly, on a given time interval. Here’s how you use it:

Yep. Seriously, that’s it. Check out the EverPing GitHub repo and you’ll see there’s not much under the hood, either.

The Results

Results were… Alright. The average startup-to-shutdown time of my site went from about 5-10 minutes to about 1-2 hours. A nice improvement, although it’s clear my site is still getting the occasional shutdown for reasons other than being idle. That’s life on a shared host, I guess.

Also, it’s worth noting that I could just use a service like Uptime Robot, even if it is overkill for what I need. But hey, sometimes it’s more fun to make something yourself.

1 comment » Related topics:

Coder’s Block v4

I am happy to announce that Coder’s Block v4 is finally live. Coded in .NET 4.0 MVC 3. It took me a ridiculous amount of time (4 months!) to make. I guess that’s what happens when you have a personal project with no deadline and an endless stream of tangents to go off on.

CBv4 is going to be a big source of blog fodder for the coming weeks. I learned a lot of new tricks and built a couple nifty things that I really want to share. But for now, I’ll just give some highlights.

Responsive Web Design

The entire site was built using mobile-first responsive web design. This means that every page is naturally mobile friendly. When more screen space is available, the pages will automatically adjust their layouts for a better viewing experience. Go ahead, open any of the pages in a desktop browser and then resize the window to be bigger or smaller. You’ll see what I’m talking about.

SuperFeed

One of my earliest ideas for CBv4 was to pull my activity from various sites around the net and show them in a single combined “super feed”. I built my own custom solution to do exactly that. It runs as a continuous server-side process, grabbing feeds and mixing them together. This is something I plan to release as open-source very soon.

Update: Super Feed on GitHub.

Social Icons

I decided to try my hand at making my own social icons. You can see one set I made in the super feed, and another set in the footer. I crafted them using Illustrator and Photoshop. Eventually, I want to add a few more icons for other popular sites and then release both sets for free.

Update: Mini Social Icons on Dribbble.

Image Fix

Some images on the site (like my Flickr photos in the super feed) needed to be dynamically scaled and cropped to fit into the layout. So I whipped up a little utility that could do this on the fly. Simple, but very useful. This is also something I plan to open-source.