Laravel 13 - Build Barcode & QR Code Generator Using Milon Package.
Laravel 13 - Build Barcode & QR Code Generator Using Milon Package.
In this tutorial, we will learn how to build a Barcode and QR Code generator in Laravel 13 using the Milon package with step-by-step setup, controller, and Blade view to generate dynamic barcodes for real-world use.
Quick Overview
This guide walks you through setting up a fresh Laravel 13 application and integrating the Milon Barcode package to generate both 1D barcodes and QR codes. You start by installing Laravel globally, creating a new project, and selecting basic setup options like MySQL database and Pest testing framework while keeping a minimal configuration to keep the project clean. After moving into the project directory, you install the milon/barcode package, enable required PHP extensions if needed, and publish the package configuration. Next, you create a controller to handle barcode generation, define routes, and build a Blade view using Tailwind CSS to display different barcode formats such as PHARMA, PHARMA2T, CODABAR, and QR code in a structured layout. After running the Laravel development server and opening the project in the browser, you first see barcodes generated using static values. Finally, you update the controller to generate all barcodes dynamically instead of hardcoding them in the Blade file, including both 1D barcodes and a QR code generated from controller data, making the application more practical and closer to real-world usage where barcode values come from products, orders, or user input.
Step # 1 : Create and Configure a Fresh Laravel 13 Application.
Before starting, make sure Composer is installed on your system because Laravel depends on it for managing packages and project setup. It is also recommended to have the Laravel Installer installed globally so you can create new Laravel applications quickly from the terminal. If the Laravel Installer is not available yet, run the following command first.
composer global require laravel/installer
After the Installer is ready, create a fresh Laravel 13 project by running.
laravel new codes
During the installation, Laravel will ask you to choose several setup options. Use the following selections to keep the project clean, simple, and ready for customization later.
- Which starter kit would you like to install? → Choose None so the project starts without any built-in authentication scaffolding..
- Which testing framework do you prefer? → Choose Pest since it offers a simpler and more modern syntax for writing tests compared to traditional PHPUnit.
- Do you want to install Laravel Boost to improve AI-assisted coding? → Select No to keep the application lightweight and avoid unnecessary extra packages.
- Which database will your application use? → Select MySQL since we will use MySQL for the project database configuration.
- Would you like to run the default database migrations? Select Yes. If Laravel shows a warning that the database does not exist for the current MySQL connection, choose Yes again so Laravel can create it automatically.
- Would you like to run npm install and npm run build? → Select Yes so all frontend dependencies are installed and the assets are compiled during the initial setup.
By selecting these options, your Laravel 13 project remains clean and minimal without unnecessary starter files or pre-configured authentication. This gives you a flexible foundation and makes it easier to build the project step by step without conflicts later.
Step # 2 : Navigate to Your Laravel 13 Project Directory.
After successfully creating your Laravel 13 project, the next step is to move into the project folder using your terminal (Git Bash, Command Prompt, or any terminal you prefer). Run the following command.
cd c:/xampp/htdocs/codes
This places you inside your Laravel project folder, where all further setup and development work such as installing packages and running the application will continue from here.
Step # 3 : Install Barcode Package for Laravel 13.
To add barcode generation functionality to your Laravel 13 application, you need to install the milon/barcode package. This is a widely used library that allows you to generate different types of barcodes such as Code128, QR codes, and more with ease. Run the following command in your project’s root directory.
composer require milon/barcode:^13.0
This will install the package along with all required dependencies into your Laravel project. If you encounter an error related to the GD extension, open your php.ini file and look for this line.
;extension=gd
It will usually be commented out by default. Simply remove the semicolon ; to uncomment it like this.
extension=gd
After saving the file, restart your server or terminal and run the command again. Once the installation completes successfully, you can continue setting up the package in your application.
Step # 4 : Publish the Barcode Configuration.
After installing the barcode package, the next step is to publish its configuration file so you can adjust its settings according to your needs. Run the following Artisan command.
php artisan vendor:publish --provider="Milon\Barcode\BarcodeServiceProvider"
This will add the package configuration file into your Laravel project’s config directory.
Step # 5 : Create a Barcode Controller.
Now we’ll create a controller to handle all barcode-related logic in our application. Run the following Artisan command.
php artisan make:controller BarcodeController
Once created, you’ll find the file inside the app/Http/Controllers folder. Open it and add the following method.
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class BarcodeController extends Controller
{
public function generateCode()
{
return view('codes');
}
}
At this stage, the method simply returns the view where the barcode will be handled and displayed.
Step # 6 : Set Up the Barcode Route.
To display the barcode in the browser, we need to connect a route to the controller method we created earlier. First, import the controller in your routes/web.php file.
use App\Http\Controllers\BarcodeController;
Then add the route.
Route::get('/', [BarcodeController::class, 'generateCode']);
This makes Laravel call the generateCode method when someone visits the home URL (/), which will load the view responsible for showing the barcode.
Step # 7 : Create a Blade View to Display Barcodes.
Now we’ll create the view that will display the barcodes generated using the Milon Barcode package. Inside the resources/views directory, create a file named codes.blade.php and paste the provided HTML structure into it.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Code Shotcut - Laravel 13 Milon Barcode Example</title>
<script src="https://cdn.tailwindcss.com"></script>
<style>
body {
background: radial-gradient(circle at top, #0f172a, #020617);
}
</style>
</head>
<body class="text-gray-200 min-h-screen flex items-center justify-center p-6">
<div class="backdrop-blur-lg bg-white/5 border border-white/10
rounded-2xl shadow-2xl w-full max-w-5xl p-8">
<h2 class="text-3xl font-bold text-center
bg-gradient-to-r from-indigo-400 to-purple-500
bg-clip-text text-transparent">
Code Shotcut
</h2>
<h4 class="text-center text-lg mt-2 text-gray-300 font-medium">
Laravel 13 Milon Barcode Example
</h4>
<p class="text-center text-sm text-gray-400 mt-3 mb-8">
Different barcode formats rendered in Laravel 13 using the Milon Barcode package with static values.
</p>
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<div class="group bg-white/5 border border-white/10 rounded-xl p-6
flex flex-col items-center transition duration-300
hover:scale-105 hover:border-indigo-400/40 hover:shadow-indigo-500/20">
<h3 class="text-sm tracking-widest text-indigo-400 mb-3">PHARMA</h3>
<div class="bg-white p-3 rounded-md">
{!! DNS1D::getBarcodeHTML('4445645656', 'PHARMA') !!}
</div>
</div>
<div class="group bg-white/5 border border-white/10 rounded-xl p-6
flex flex-col items-center transition duration-300
hover:scale-105 hover:border-purple-400/40 hover:shadow-purple-500/20">
<h3 class="text-sm tracking-widest text-purple-400 mb-3">QRCODE</h3>
<div class="bg-white p-3 rounded-md">
{!! DNS2D::getBarcodeHTML('https://www.youtube.com/@CodeShotcut', 'QRCODE') !!}
</div>
</div>
<div class="group bg-white/5 border border-white/10 rounded-xl p-6
flex flex-col items-center transition duration-300
hover:scale-105 hover:border-indigo-400/40 hover:shadow-indigo-500/20">
<h3 class="text-sm tracking-widest text-indigo-400 mb-3">PHARMA2T</h3>
<div class="bg-white p-3 rounded-md">
{!! DNS1D::getBarcodeHTML('4445645656', 'PHARMA2T') !!}
</div>
</div>
<div class="group bg-white/5 border border-white/10 rounded-xl p-6
flex flex-col items-center transition duration-300
hover:scale-105 hover:border-purple-400/40 hover:shadow-purple-500/20">
<h3 class="text-sm tracking-widest text-purple-400 mb-3">CODABAR</h3>
<div class="bg-white p-3 rounded-md">
{!! DNS1D::getBarcodeHTML('4445645656', 'CODABAR') !!}
</div>
</div>
</div>
<p class="text-center text-xs text-gray-500 mt-8">
Laravel 13 + Milon Barcode - Demonstration of different barcode formats using static values
</p>
</div>
</body>
</html>
The view uses Tailwind CSS for styling along with the milon/barcode package to display different barcode formats. It supports both 1D and 2D barcodes using the DNS1D and DNS2D facades. When you open the homepage, you’ll see barcodes like PHARMA, PHARMA2T, CODABAR, and a QR Code displayed in a structured layout.
Step # 8 : Run the Application and Verify the Barcode Output.
Now it’s time to test your Laravel 13 barcode project and make sure everything is working correctly. Start the Laravel development server by running the following command in your terminal.
php artisan serve
Once the server starts successfully, open your browser and visit the following URL: http://127.0.0.1:8000. Laravel will load the codes.blade.php view, where you’ll see the barcode examples displayed on the screen. This includes different barcode formats such as PHARMA, PHARMA2T, CODABAR, and a QR Code, all rendered using the Milon Barcode package. If everything appears correctly, your barcode integration has been completed successfully.
Step # 9 : Generate Dynamic Barcodes and QR Code in Laravel 13.
Now let’s improve our project by moving all barcode generation logic into the controller instead of keeping static values inside the Blade file. This is how real applications work, where barcode values usually come from products, orders, invoices, or user data. We will dynamically generate PHARMA, PHARMA2T, CODABAR, and a QR Code using the Milon Barcode package. Update your controller with the following code.
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Milon\Barcode\DNS1D;
use Milon\Barcode\DNS2D;
class BarcodeController extends Controller
{
public function generateCode()
{
// 1D Barcode instance
$barcode = new DNS1D();
$barcode->setStorPath(__DIR__.'/cache/');
$pharma = $barcode->getBarcodeHTML('4445645656', 'PHARMA');
$pharma2t = $barcode->getBarcodeHTML('4445645656', 'PHARMA2T');
$codabar = $barcode->getBarcodeHTML('4445645656', 'CODABAR');
// 2D QR Code instance
$qrcode = new DNS2D();
$qrcode->setStorPath(__DIR__.'/cache/');
$qrCodeHtml = $qrcode->getBarcodeHTML(
'https://www.youtube.com/@codeshotcut',
'QRCODE'
);
return view('codes', compact(
'pharma',
'pharma2t',
'codabar',
'qrCodeHtml'
));
}
}
Now update your codes.blade.php file to display all dynamically generated barcodes.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Code Shotcut - Laravel 13 Milon Barcode Example</title>
<script src="https://cdn.tailwindcss.com"></script>
<style>
body {
background: radial-gradient(circle at top, #0f172a, #020617);
}
</style>
</head>
<body class="text-gray-200 min-h-screen flex items-center justify-center p-6">
<div class="backdrop-blur-lg bg-white/5 border border-white/10
rounded-2xl shadow-2xl w-full max-w-5xl p-8">
<h2 class="text-3xl font-bold text-center
bg-gradient-to-r from-indigo-400 to-purple-500
bg-clip-text text-transparent">
Code Shotcut
</h2>
<h4 class="text-center text-lg mt-2 text-gray-300 font-medium">
Laravel 13 Milon Barcode Example
</h4>
<p class="text-center text-sm text-gray-400 mt-3 mb-8">
Now all barcode values are generated dynamically from the controller instead of using static values.
</p>
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<div class="group bg-white/5 border border-white/10 rounded-xl p-6
flex flex-col items-center transition duration-300
hover:scale-105 hover:border-indigo-400/40 hover:shadow-indigo-500/20">
<h3 class="text-sm tracking-widest text-indigo-400 mb-3">PHARMA</h3>
<div class="bg-white p-3 rounded-md">
{!! $pharma !!}
</div>
</div>
<div class="group bg-white/5 border border-white/10 rounded-xl p-6
flex flex-col items-center transition duration-300
hover:scale-105 hover:border-purple-400/40 hover:shadow-purple-500/20">
<h3 class="text-sm tracking-widest text-purple-400 mb-3">QRCODE</h3>
<div class="bg-white p-3 rounded-md">
{!! $qrCodeHtml !!}
</div>
</div>
<div class="group bg-white/5 border border-white/10 rounded-xl p-6
flex flex-col items-center transition duration-300
hover:scale-105 hover:border-indigo-400/40 hover:shadow-indigo-500/20">
<h3 class="text-sm tracking-widest text-indigo-400 mb-3">PHARMA2T</h3>
<div class="bg-white p-3 rounded-md">
{!! $pharma2t !!}
</div>
</div>
<div class="group bg-white/5 border border-white/10 rounded-xl p-6
flex flex-col items-center transition duration-300
hover:scale-105 hover:border-purple-400/40 hover:shadow-purple-500/20">
<h3 class="text-sm tracking-widest text-purple-400 mb-3">CODABAR</h3>
<div class="bg-white p-3 rounded-md">
{!! $codabar !!}
</div>
</div>
</div>
<p class="text-center text-xs text-gray-500 mt-8">
Laravel 13 + Milon Barcode - Demonstration of dynamic barcode generation using controller data
</p>
</div>
</body>
</html>
After refreshing the page at: http://127.0.0.1:8000, you will see all barcodes and the QR Code generated dynamically from the controller.
Instead of hardcoded values in the Blade file, everything is now handled through backend logic, making the setup more flexible and closer to real-world usage. This approach is especially useful when working with products, invoices, orders, or any system where barcode values need to be generated dynamically based on user or database data.
Conclusion
By following this guide, you have successfully set up a Laravel 13 application and integrated the Milon Barcode package to generate both 1D barcodes and 2D QR codes. You learned how to install and configure the package, create a controller and routes, build a Blade view with static barcode examples, and then upgrade it to dynamic barcode generation using controller data. This gives you a solid starting point to build real-world barcode features where data can come from products, orders, or user input. From here, you can extend the project based on your needs and turn it into a more complete system.
For more details, refer to the official Milon Barcode package documentation: https://github.com/milon/barcode.
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