Skip to content

Instantly share code, notes, and snippets.

@adnan360

adnan360/how to setup ngrok.md

Last active August 23, 2017 02:04
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save adnan360/0fc382509cdf0aff32a90a53becac9c2 to your computer and use it in GitHub Desktop.
Save adnan360/0fc382509cdf0aff32a90a53becac9c2 to your computer and use it in GitHub Desktop.
Download ZIP
How to setup NGROK
Raw
how to setup ngrok.md

NGROK - A nifty little program to share your localhost with everyone

We have live sites for running client sites, we have staging sites for testing. But what about localhost sites. We sometimes have some test code running in local that we want the world to see!

NGROK is a tiny program that let's you temporarily create an url for your localhost! And anybody with the URL can visit this and enjoy the goodness within!

Moreover it does not need install, runs on Windows, Linux, Mac, BSD or ARM, plus its open source. How cool can it get?!

Basics (for geeks)

To run NGROK is easy. Just download from https://ngrok.com/download, cd to that directory and run: ngrok http

And this will give you an url to access the localhost on your machine. Please keep in mind that the url will work only if the command line window is running, so you cannot close it while you want others to see it.

Also, make sure that you have entered the correct port number in the command that the apache running in. In a typical Windows installation with XAMPP installed, it runs in port 80. If not sure you can check in the XAMPP Control panel to see its port or check on httpd.conf.

Detailed Instructions (for beginners)

  1. Run apache + mysql + whatever you have!
  2. Determine the port in which apache is running. Usually it is 80. But to make sure you can:
  • In Windows: Check the XAMPP Control Panel GUI. It should have the port number under Port(s).
  • In Linux/LAMPP: Check /opt/lampp/etc/httpd.conf This should have the port number listed there somewhere. You can search for port and a line like Listen 80 will be there. 80 is the port number here in this example.
  • In other cases, run httpd -V and this will show the path of the httpd.conf. Check that file for the port in a Listen line.

Take a note of this port number.

  1. Download NGROK: https://ngrok.com/download
  2. Extract it. You will then have the ngrok executable file ready for your testing.
  3. cd to that directory.
  • In Windows: Go to the directory where the executable (exe) file is. Keep pressing shift and right click on empty space, then choose Open command window here.
  • In Linux: Visit the file in your File Manager, right click on empty space, then choose Open in terminal. This option maybe also available in the Tools menu. You can also type cd and then a space, then drag and drop the folder in a terminal window and press enter.
  1. Run ngrok in Command prompt/Terminal: ngrok http 80 (replace 80 with your port number, if your port number is different)

This will eventually connect and show you an url, something like this: https://65f6sc3b.ngrok.io

Take note of this url.

Keep this window open up to the time that you want the url to work.

  1. Open the URL in your browser to test if this can be accessed correctly.

  2. For Wordpress sites, you may see that the URL changing to "localhost" sometimes. If this is the case, then you would need to install this plugin: https://wordpress.org/plugins/root-relative-urls/ (This plugin is intended for use in development environment only, not for live or production use.)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment