0% found this document useful (0 votes)
147 views1 page

Ngrok Setup Guide

The Ngrok setup guide provides instructions for exposing your localhost to the internet using a public URL, which is beneficial during hackathons. Key steps include installing Ngrok, signing up for an account to obtain an Auth Token, starting your local server, and running the Ngrok tunnel with the appropriate port number. Additional notes emphasize the changing nature of free Ngrok URLs and the importance of testing the link on another device before sharing it with judges.

Uploaded by

r47202535
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
147 views1 page

Ngrok Setup Guide

The Ngrok setup guide provides instructions for exposing your localhost to the internet using a public URL, which is beneficial during hackathons. Key steps include installing Ngrok, signing up for an account to obtain an Auth Token, starting your local server, and running the Ngrok tunnel with the appropriate port number. Additional notes emphasize the changing nature of free Ngrok URLs and the importance of testing the link on another device before sharing it with judges.

Uploaded by

r47202535
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 1

NGROK SETUP GUIDE FOR HACKATHONS

Ngrok allows you to expose your localhost to the internet via a public URL. This is super
useful in hackathons when judges want to test your project on their own devices.

Step-by-Step Setup

1. Install Ngrok
- Option 1: Download from https://ngrok.com/download and unzip.
- Option 2: Install via npm: npm install -g ngrok

2. Sign Up & Get Auth Token


- Go to sign up for a free account.
- Copy your Auth Token from the Dashboard.

3. Connect Ngrok to Your Account


Run the following command (replace YOUR_TOKEN with your actual token):
ngrok config add-authtoken YOUR_TOKEN

4. Start Your Local Server


- Example for React/Vite:
npm install
npm run dev
- Note the port number (e.g., 5173).

5. Start Ngrok Tunnel


Run:
ngrok http PORT_NO

Replace PORT_NO with your server port (e.g., 5173).


Ngrok will give you a public HTTP and HTTPS URL.

6. (Optional) Fix for Vite 'Blocked Host' Error


Edit vite.config.js and add:

export default {
server: {
allowedHosts: ['.ngrok-free.app']
}
}

Then restart your dev server.

Notes
- Free Ngrok URLs change every time you restart Ngrok. Consider using a reserved domain
with a paid plan if you want a static URL.
- Make sure your firewall allows incoming connections.
- In hackathons, always test your Ngrok link on another device before sharing with judges.

You might also like