Sharing local development with external stakeholders using NGROK

Ngrok is a software coupled with a web service that will allow you to create a tunnel from the Internet to a port on your machine locally (TCP or UDP). The interest for a developer is to be able to make a public demo without having to deploy his project on a server. It is also a relevant tool for testing on mobile, etc.

In this article we will see how to set ngrok on Windows :

1. Signup to https://ngrok.com/
2. Download ngrok (Windows version)
3. Unzip folder
4. Use the generated authtoken for the account (to be taken from https://dashboard.ngrok.com/auth/your-authtoken),

for Windows, the command is :

ngrok.exe authtoken YOUR_AUTH_KEY

5. Verify that a config file is generated

6. Edit the YAML file

authtoken: YOUR_AUTH_KEY
tunnels:
  # Our front-end app
  first-app:
    addr: 3000
    proto: http
    host_header: first-app.example.ngrok.com
  # Our back-end app   
  second-app:
    addr: 8080
    proto: http
    host_header: second-app.example.ngrok.com

7. Start ngrok tunnels

ngrok.exe start --all

8. Specify Forwarded URL to the back-end as the API URL in the front-end source code

9. Connect to the website from any device using the front-end forwarding URL