Laravel 12 – Real-Time Visitor Geolocation with Geo Genius.
Laravel 12 – Real-Time Visitor Geolocation with Geo Genius.
In this tutorial, we will learn how to detect and display visitor geolocation in Laravel 12 using the Geo Genius package, showing IP, city, country, latitude, and longitude in real-time.
Quick Overview
This guide walks you through adding visitor geolocation detection to a Laravel 12 project using the Laravel Geo Genius package. You start by creating a fresh Laravel 12 application and navigating into the project directory. Next, you install the Geo Genius package via Composer and publish its configuration file to enable customization. A route is then added to web.php to retrieve visitor location details, which are passed to a Blade view. The geo.blade.php view is set up with Tailwind CSS to display information such as IP address, city, region, country, country code, latitude, longitude, timezone, and the country flag. Finally, by running the Laravel development server and visiting /geo, you can see the visitor’s location data rendered in real time.
Step # 1 : Create a Fresh Laravel 12 Project.
Let’s begin by setting up a fresh Laravel 12 application.If you have the Laravel Installer installed, run.
laravel new geo-genius
Or, if you prefer using Composer, run.
composer create-project laravel/laravel geo-genius
When using Composer, Laravel generates a clean project without any interactive setup. You can configure everything later as needed. If you use the Laravel Installer, it will guide you through a short setup wizard. Use the following options during installation.
- Starter Kit: Select None to keep the project minimal and unopinionated.
- Testing Framework: Choose Pest for a modern and expressive testing experience.
- Database: Select MySQL as the default database.
- Run Migrations: Type Yes to execute the default migrations immediately.
- Frontend Dependencies: Choose Yes to automatically install the required frontend packages.
Once the installation is complete, you’ll have a clean Laravel 12 project named geo-genius, configured with Pest for testing, MySQL as the database, frontend dependencies installed, and default migrations already executed.
Step # 2 : Navigate to the Project Directory.
After creating the project, open your terminal (such as Git Bash, Command Prompt, or Terminal) and move into the newly created project folder by running.
cd geo-genius
This is important because all upcoming Composer, Artisan, and other development commands must be executed from the root directory of your Laravel application. Working inside the correct folder ensures everything runs smoothly and targets the right project.
Step # 3 : Install the Laravel Geo Genius Package.
Now, let’s install the Geo Genius package into our Laravel project using Composer. Run the following command inside your project directory.
composer require devrabiul/laravel-geo-genius
Composer will automatically download the package and register it with your Laravel application. The Laravel Geo Genius package enables you to detect a user’s location based on their IP address. It provides useful details such as: Country, City, Latitude, Longitude. With this package installed, your application will be able to retrieve accurate geographic information for incoming users.
Step # 4 : Publish the Package Configuration File.
After installing the package, you need to publish its configuration file so you can customize the settings. Run the following command.
php artisan vendor:publish --provider="Devrabiul\LaravelGeoGenius\LaravelGeoGeniusServiceProvider"
This command publishes the package configuration file to your project and creates: config/laravel-geo-genius.php. It also publishes a migration file that adds a timezone column to the users table. If you are going to save timezone or location details in the database, you must rerun the migration using the following command.
php artisan migrate
For this example, we will rerun the migration, but we are not going to save anything in the database.
Step # 5 : Add a Route.
Open routes/web.php and add the following route.
Route::get('/geo', function () {
$geo = laravelGeoGenius()->geo()->locateVisitor();
return view('geo', compact('geo'));
});
The laravelGeoGenius()->geo()->locateVisitor(); helper automatically detects the visitor’s location based on their IP address. By using compact('geo'), we pass this location data to a Blade view named geo. The view will then handle displaying the details such as country, city, latitude, and longitude in a clear and readable format.
Step # 6: Create a Blade View to Display Location.
Create a new Blade file called geo.blade.php inside the resources/views folder, and then add the following content.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Laravel 12 - Code Shotcut Visitor Location</title>
<!-- Tailwind CSS CDN -->
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="bg-gray-900 text-gray-100 flex items-center justify-center min-h-screen p-4">
<div class="bg-gray-800 p-8 rounded-2xl shadow-xl w-full max-w-xl">
<h1 class="text-3xl font-bold mb-6 text-center text-indigo-400">Code Shotcut - Visitor Location</h1>
<div class="grid grid-cols-2 gap-y-3 gap-x-4">
<div class="font-semibold text-gray-300">IP:</div>
<div class="text-gray-100">{{ $geo['ip'] }}</div>
<div class="font-semibold text-gray-300">City:</div>
<div class="text-gray-100">{{ $geo['city'] }}</div>
<div class="font-semibold text-gray-300">Region:</div>
<div class="text-gray-100">{{ $geo['region'] }}</div>
<div class="font-semibold text-gray-300">Country:</div>
<div class="text-gray-100">{{ $geo['country'] }}</div>
<div class="font-semibold text-gray-300">Country Code:</div>
<div class="text-gray-100">{{ $geo['countryCode'] }}</div>
<div class="font-semibold text-gray-300">Country Flag:</div>
<div class="text-gray-100 text-xl">{{ $geo['country_flag'] }}</div>
<div class="font-semibold text-gray-300">Latitude:</div>
<div class="text-gray-100">{{ $geo['latitude'] }}</div>
<div class="font-semibold text-gray-300">Longitude:</div>
<div class="text-gray-100">{{ $geo['longitude'] }}</div>
<div class="font-semibold text-gray-300">Timezone:</div>
<div class="text-gray-100">{{ $geo['timezone'] }}</div>
</div>
<p class="mt-6 text-sm text-gray-400 text-center">
Location detected automatically using Laravel Geo Genius package.
</p>
</div>
</body>
</html>
This Blade view creates a clean, responsive web page that displays the visitor’s geolocation details in a structured two-column layout. Using Tailwind CSS for styling, it shows key information like the visitor’s IP address, city, region, country, country code, latitude, longitude, timezone, and country flag (displayed as the country code, e.g., “DE”), all organized neatly in a visually appealing card.
Step # 7 : Test Laravel Geo Genius Package.
Now it’s time to see everything in action. Start the Laravel development server by running.
php artisan serve
Once the server is running, open your browser and navigate to: http://127.0.0.1:8000/geo. When you visit this URL, Laravel will render the geo-test.blade.php view you created. The page will display your current visitor location details, including IP address, city, region, country, country code, latitude, longitude, timezone, and the country flag (shown as the country code, e.g., “DE”). Essentially, this confirms that the Laravel Geo Genius package is correctly detecting and passing location data to your view, giving you a live preview of visitor geolocation information.
Note: If you want to capture a user’s location when they create an account, you can detect their geolocation during the registration process and store it in your database. Later, you can display these stored details privately in the user’s profile, just like we did for live visitors, allowing each user to see their own location. This approach is useful for analytics, customizing user experiences, or showing location-specific content. You can also update their location on each login to keep it current. By storing location data securely, you can gain insights into user distribution, understand regional engagement patterns, and provide personalized features based on each user’s location.
Conclusion
By following this guide, you’ve successfully added visitor geolocation detection to your Laravel application using the Geo Genius package. This approach provides a simple and effective way to capture and display visitor location details, including IP, city, region, country, latitude, longitude, and timezone, in a clean Blade view. The setup is easy to follow and can be customized to fit your application’s design and requirements, giving you real-time insights into visitor locations.
For more details and advanced options, check out the official Laravel Geo Genius documentation.
Share this with friends!
To engage in commentary, kindly proceed by logging in or registering
Subscribe to Our Newsletter
Stay ahead of the curve! Join our newsletter to see what everyone’s talking about.
Continue with Google
0 Comments