How to expose your development server to the Internet with ngrok

Recently I was working on a project in which I was tasked with developing a UI that would look and function rather well on feature phones. By feature phones, I mean a bad boy that looks like below 

Photo sourced from Pixabay

The problem was that I could not hop onto the Chrome dev tools to see how the front end would look like since the old browsers that come with such phones act very differently from our modern browsers. The solution, therefore, was to download an emulator and access the website. This meant that every time I made a change to the front end and needed to see how it would look like on feature phones, I had to deploy it. This soon became a very frustrating experience, which is why I did some digging into whether there were any ways in which I can open my localhost:8000 server to the internet so that I can simply reload the page on the feature phone in order to see the latest changes. 

That’s how I found ngrok, which is an application that enables developers to expose a local development server to the Internet. So your locally-hosted web server appears to be hosted on a subdomain of ngrok.com, meaning that no public IP or domain name on the local machine is needed. I’m not going to go too deep into its full features as you can find this information on their website. The goal of this blog post is to show you how you can use it as I did. 

First off, head into their website and create an account. Once you’ve done that, download ngrok to your machine, unzip and open it up. Once the set-up is done, all you have to is cd into the directory in which you downloaded the ngrok file into. Mine was in the downloads folder, so I opened my terminal and typed 

1​​cd downloads

Then I am required to connect my account via the unique ngrok ID via the command below.

1​​./ngrok authtoken type your unique ngrokid here

Once that’s done, all that we need to do is tell ngrok which local server they should grab and host on their domain. You can do this by 

1./ngrok http 8000

Note- I was working on localhost:8000, hence the 8000, but you can change this to match your development server. 

Once you provide the development server you want to open to the internet, ngrok will generate a forwarding link that will reflect any and all changes on your local server.

And that folks is how you open your local development server to the internet!