Allowing remote access to your local dev app.
The Problem(s)
You may have encountered one or more of the following problems when developing a web app in your local dev environment:
- You need to make your dev copy available to an external service during the development process e.g. to test out an API integration that uses webhooks.
- You need to test the dev copy of the web app on a different physical device e.g. an unusual handheld device.
- Your sales guy phones up from a client site in a panic and wants to demo the latest dev version to a client right now.
The Simple Solution
There are a number of solutions to these problems, and I’ve used a selection of them over the years, and they have consistently proven to be a total faff.
However, I have recently discovered a super-simple solution to all of these problems, and it’s an awesome little service called ngrok.
ngrok is basically an elegantly packaged proxy service. They provide you with a client to run on your local machine, which acts as a proxy between your local environment and a temporary ngrok address like https://abcd1234.ngrok.io.
You can then use that address as your webhook address for your API integration; Or key it into the browser on the weird handheld device that you’re testing; Or email it to your Sales guy so that he can demo the app to your client while you go and grab a coffee.
Just to give you a quick feel for how simple it is, if I am running a dev app on localhost port 4000, I can simply run:
ngrok http 4000
and I get presented with:
I can then use (or give out) either of the two “Forwarding” addresses, depending on whether I want HTTPS or HTTP. (Hint: Use the HTTPS address unless you have a good reason not to.)
ngrok follows a freemium billing model, so in its simplest form it’s free, and it also has some paid plans which offer more advance features.
I’ve only used the free version to date, but I would happily pay for the more advanced features if/when I need them.
In summary, it’s a great service. Check it out!