Setting Up Laravel with Ngrok: A Step-by-Step Guide

3 min readAug 29, 2023

Introduction

In today’s dynamic development landscape, sharing your locally hosted web applications is crucial for effective collaboration and testing. Ngrok, a powerful tool, comes to the rescue by creating secure tunnels to expose your local server to the internet. In this comprehensive tutorial, we’ll guide you through setting up Laravel with Ngrok on various platforms, covering the installation process and token authentication in detail.

Prerequisites

Before diving into the setup process, ensure you have the following prerequisites in place:

PHP and Composer installed
Laravel Installer
An existing Laravel project
Command-line terminal or shell

Installing Laravel

If you’re starting from scratch without a Laravel project, follow these steps:

composer global require laravel/installer

laravel new YourProjectName

cd YourProjectName

Downloading and Installing Ngrok

Begin by signing up for an Ngrok account on their official website.

After registering and logging in, you can download the Ngrok executable suitable for your platform.

Ngrok Token Authentication

Once the Ngrok executable is downloaded, authenticate your account using the provided authentication token. This token ensures secure and authorized access to Ngrok’s features.

1. Place the downloaded Ngrok executable in a directory of your choice (for instance, ~/ngrok).

2. Open a terminal window and navigate to the directory where Ngrok is located:

cd ~/ngrok

3. Authenticate your Ngrok account with the token:

./ngrok authtoken YOUR_AUTH_TOKEN

Replace YOUR_AUTH_TOKEN with the actual Ngrok authentication token you received during registration.

Configuring Ngrok with Laravel

With Ngrok authenticated, you can now configure it to work seamlessly with your Laravel project.

1. Start your Laravel development server:

php artisan serve

2. Open a new terminal window and navigate to the Ngrok directory:

cd ~/ngrok

Running Laravel with Ngrok

Expose your Laravel server to the internet using the following command:

./ngrok http 8000

OR

./ngrok http http://127.0.0.1:8000

Remember that 8000 refers to the default port on which Laravel serves applications.

Platform-Specific Guidelines

1. Windows
If you’re using Windows, remember to adjust the navigation to the Ngrok directory by using cd path\to\ngrok.

2. macOS and Linux
For macOS and Linux users, the correct navigation is cd ~/ngrok.

Conclusion

Congratulations! You’ve successfully established a bridge between Laravel and Ngrok, making your locally hosted applications accessible to a wider audience. This seamless setup facilitates collaboration and accelerates testing cycles.

Always remember to keep your Ngrok authentication token secure and refrain from sharing it publicly. Both Laravel and Ngrok are actively maintained projects, so it’s wise to consult their official documentation for any updates or changes.

By following the outlined steps in this guide, you’re well-equipped to enhance your development workflow and foster productive collaboration. Happy coding!

Go forth and get more out of your content. Go forth and conquer Medium! (and while you’re at it, follow me on Medium!)

Found this post useful? Kindly tap the 👏 button below! :)

🌟 Enjoy my blogging content? Support my work by buying me a virtual coffee on BuyMeACoffee! Your contributions help fuel insightful tech articles. Join hands in making coding more accessible and exciting for all. https://www.buymeacoffee.com/arjunamrutiya🚀