2023-04-02

Localhost subdomains for development

When making things for the web we first run them on our machines at a local port. We start a server from the command line and browse to localhost:8080 or similar. The port number is not important, any high port that is not in use will do. But it is one more thing to keep in mind, one more subtle difference between development and production. The browser’s address suggestion doesn’t work the same. Using SSL certificates might not be as straightforward.

Maybe you’ve developed an app that you want to use on this machine without deploying it anywhere else. It doesn’t have or need authentication since you’ll be the only user. You could have made a desktop app, or used something like electron, but why bother? You know how to make webapps, and the browser you have will run your app just fine, no need to install another browser just for this.

There’s a nice solution to this problem. Run an nginx server on port 80 or 443 and have it proxy traffic to each of your apps by giving each of them a subdomain of localhost. Then you can browse to http://projectx.localhost, or https://wiki.localhost, etc. instead of using ports. Your servers are still listening and accessible at the high numbered ports, but the UX for them is now the same as that of any other website.

noport

noport ui

I did this by hand for a while and it works great, but configuring nginx for each of the sites get’s a bit repetitive. So I built noport, a web UI you can run locally to configure nginx to assign localhost subdomains to your servers.

I only worked on it for a couple of days, so there’s much to improve, but it already does the minimum I need it to do. The readme has a list of features that I’d like to implement at some point. It doesn’t do SSL yet. Everything is built into a single static binary, so it trivial to install by downloading the binary to a folder on your PATH.