Breeze: Installation and Authentication Guide for Laravel 11, 12, and 13

- Andrés Cruz - ES En español

Video thumbnail

When you start a project in Laravel and need authentication, one of the first important decisions is which solution to use. For years I have seen many developers jump straight to Jetstream or more complex solutions, when in reality Laravel Breeze is usually the best starting point.

That said, it is important to clarify something from the beginning: Laravel Breeze is no longer the recommended authentication package for new projects in Laravel 13 without Livewire or Inertia. If you are starting a modern project, I would recommend creating the project with Livewire and taking advantage of its built-in authentication module, or using Fortify directly. Still, understanding Breeze remains very valuable, both for maintaining existing projects and for understanding how authentication works in Laravel from the ground up.

In this guide I will show you the first steps with Laravel Breeze: what it is, when it makes sense to use it, how to install it in Laravel 11, 12, and 13, the most common errors, and what to check once you have it up and running. It is not just theory; it is exactly the workflow I use and teach in my projects, courses, and books.

What is Laravel Breeze and when to use it

Laravel Breeze is Laravel's official starter kit for implementing basic authentication quickly and cleanly. It includes everything you need to get started without bloating the project with features you might not need.

The official Laravel documentation defines it as follows:

"Laravel Breeze is a minimal, simple implementation of all of Laravel's authentication features, including login, registration, password reset, email verification, and password confirmation. Laravel Breeze's default view layer is made up of simple Blade templates styled with Tailwind CSS."

In practical terms, by installing Breeze in your project you get two fundamental things:

  1. The configuration of Tailwind CSS and Alpine.js in the project (although in modern versions of Laravel this already comes included by default).
  2. A complete authentication setup: registration, login, password recovery, and middleware for access control.

What Laravel Breeze includes by default

By installing Breeze you get, among other things:

  • User registration
  • Login and logout
  • Password recovery
  • Email verification
  • User profile page
  • Authentication middleware (auth, verified)
  • Ready-to-use views with Tailwind CSS

All this code is published directly into your project, which means you can read, modify, and adapt it without relying on any hidden layer. That is precisely what makes it so valuable for learning.

Differences between Breeze, Jetstream, and Fortify

This is where many get confused when starting out. All three options solve the same problem (authentication), but from very different angles:

  • Fortify: backend only, no views. Ideal if you want to build the entire frontend from scratch or integrate it with Vue, React, or another framework. It does not generate any view files.
  • Jetstream: very comprehensive, featuring teams, two-factor authentication (2FA), session management, and more. Perfect for large applications that need all of this from day one.
  • Breeze: the ideal balance between functionality and control. Generates actual views that you can edit, without adding unnecessary complexity.

Breeze is the best choice for learning and for small to medium projects, including MVPs. If you don't know which one to pick, start with Breeze.

What types of projects I recommend Laravel Breeze for

I recommend Breeze when:

  • You are taking your first steps with Laravel
  • You want quick authentication without complexity
  • You need a clear foundation to customize later
  • You prefer to understand what happens “under the hood” before trusting more abstract solutions

An important clarification: the goal of this chapter is not to learn Tailwind CSS or Alpine.js in depth. It is assumed that the reader has prior knowledge of these technologies. We will try to use them in a simple way, but if at any point you feel lost, the recommendation is to pause here and study them a bit before continuing. On my YouTube channel you will find introductions to both tools.

The official package page is located at:

https://laravel.com/docs/master/starter-kits

Prerequisites before installing Laravel Breeze

Before installing Breeze, it is worth reviewing some basic points that often cause issues if overlooked.

Compatible Laravel Version (Laravel 11, 12, and 13)

Laravel Breeze works perfectly in Laravel 11 and Laravel 12. Starting with Laravel 13, Breeze no longer appears as a direct option when creating the project with laravel new, but this is not an obstacle: it simply changes the installation method, which we will cover in detail below.

Node.js, NPM, and Vite: the minimum required

This is where most people get stuck. Breeze uses Vite to compile frontend assets, which means you need a modern version of Node.js. In real-world projects, I have seen constant errors caused by outdated Node versions.

For example, if you see errors like Cannot find module 'node:path', it is not an issue with Breeze itself, but rather that your Node version is too old. Versions v14.x are no longer sufficient. In my projects, I usually work with Node 18+, and with that there are no problems.

Local Environment (Laragon, Sail, Herd, or others)

You can use Breeze without any issues in any of these environments:

  • Laragon
  • XAMPP
  • Laravel Sail
  • Laravel Herd
  • Custom Docker

If you use Sail and do not have Node installed locally, you can also compile assets directly from inside the container using ./vendor/bin/sail npm run dev, as we will see later.

How to install Laravel Breeze step by step

Installing Breeze with Composer

From the root of your Laravel project, run the following command to add Breeze as a development dependency:

$ composer require laravel/breeze --dev

By using the --dev flag, Breeze is installed only as a development dependency. This makes sense because the package publishes its code directly into your project and is no longer required in production.

Running the Breeze installer

Once the package is installed, run the Artisan installer command:

$ php artisan breeze:install

The installer will ask which stack you would like to use. If you have experience with other frameworks, you can choose vue or react, but to start step by step, the recommended option is blade:

 Which Breeze stack would you like to install?
  Blade with Alpine ........................................ blade
  Livewire (Volt Class API) with Alpine ................... livewire
  Livewire (Volt Functional API) with Alpine .............. livewire-functional
  React with Inertia ...................................... react
  Vue with Inertia ........................................ vue
  API only ................................................ api

Select blade to continue. Next, the installer will offer to enable dark mode support:

Would you like to install dark mode support?
  (yes/no) [no]

Answer yes if you wish. It is an option that adds no real complexity and comes in handy for projects that need dark theme support from the beginning.

Then it will ask if you prefer to use Pest instead of PHPUnit for testing:

Would you prefer Pest tests instead of PHPUnit?
  (yes/no) [no]

If you are starting out, answer no. You can add tests later once the project workflow is clear. Finally, wait for the process to finish installing and compiling dependencies:

INFO  Installing and building Node dependencies.

Compiling assets and running the project

After installing Breeze, you need to compile the frontend assets. Run:

$ npm install
$ npm run dev

These commands do the following:

  • Install the Node.js dependencies declared in package.json
  • Compile Tailwind CSS and the JavaScript for Alpine.js
  • Start a Hot Module Replacement (HMR) process that automatically synchronizes source code changes with the browser

Using npm with Laravel Sail

If you use Sail and do not have Node installed locally, you can compile assets directly from the container:

./vendor/bin/sail npm run dev

Handling errors with Node

If you see an error like the following when running npm run dev:

failed to load config from C:\laragon\www\testlara11\vite.config.js
Error: Cannot find module 'node:path'
Require stack:
- C:\laragon\www\testlara11\node_modules\vite\dist\node-cjs\publicUtils.cjs
- C:\laragon\www\testlara11\node_modules\vite\index.cjs
- C:\laragon\www\testlara11\vite.config.js

It means you have an outdated version of Node. Check your current version with:

$ node -v

If the result is similar to or lower than:

v14.16.1

You need to update. In this project we work with:

v18.8.0

Once Node is updated, run again:

$ npm run dev

And if you are using Laravel Sail without local Node:

$ ./vendor/bin/sail npm run dev
Route::get('/dashboard', function () {
    return view('dashboard');
})->middleware(['auth', 'verified'])->name('dashboard');

Configuring your routes after installing Breeze

Upon installing Breeze, your routes file is overwritten and you will see something like this in routes/web.php:

Route::get('/dashboard', function () {
    return view('dashboard');
})->middleware(['auth', 'verified'])->name('dashboard');

This is completely normal. Remember to re-add your custom routes. For example, if you already had resource controllers:

use App\Http\Controllers\Dashboard\CategoryController;
use App\Http\Controllers\Dashboard\PostController;

Route::group(['prefix' => 'dashboard'], function () {
    Route::resources([
        'post' => PostController::class,
        'category' => CategoryController::class,
    ]);
});

CSS and JavaScript resources generated by Breeze

If you check the generated files in the resources folder, you will find the following:

resources/css/app.css

@import 'tailwindcss/base';
@import 'tailwindcss/components';
@import 'tailwindcss/utilities';

resources/js/app.js

import './bootstrap';

import Alpine from 'alpinejs';

window.Alpine = Alpine;

Alpine.start();

Breeze configured Tailwind CSS and Alpine.js in your project with the corresponding imports. The command npm run dev generates the output files and starts the Hot Reload process so changes automatically reflect in the browser.

Which stack to choose when starting: Blade vs Vue vs React

Although Breeze supports blade, vue, react, livewire, and even api, for your first steps I always recommend blade.

Blade allows you to:

  • Better understand Laravel's internal structure
  • Avoid unnecessary complexity at the beginning
  • Customize views without having to learn a full JavaScript framework at the same time

If you already have experience with Vue or React, you can choose them without issue. But if you are learning, blade is the most sensible option to avoid mixing too many new technologies at once.

Authentication system

Video thumbnail

Besides configuring Tailwind CSS and Alpine.js, Laravel Breeze installs a full authentication scheme that we will explore below.

If you navigate to:

http://larafirststeps.test/login

You will see the login screen:

Login page in light mode
Login page in light mode

Before logging in, you need to create a user. To do that, go to the registration route:

http://larafirststeps.test/register

Fill out the form and create your first user:

Registration page in light mode
Registration page in light mode

And if we check the database:

Create a user
Create a user

Once registered, by default the user is automatically authenticated and redirected to /dashboard, where you will see the layout Breeze generates for the application:

Breeze Dashboard
Breeze Dashboard

Breeze also generates a set of views in the resources/views folder that you can explore and modify freely:

Layouts included by Breeze
Layouts included by Breeze

I recommend giving them a thorough review. You will find the views for signing up, logging in, resetting passwords, and logging out, all ready to customize:

User options
User options
Video thumbnail

Breeze installer options explained

During the Breeze installation you will see several questions. Here is an explanation of what each one means:

  • Dark mode support: You can enable dark mode support right from the installer. It is not mandatory, nor does it add real complexity. If your project might need it, enable it from the start; it is easier to do now than adding it later.
  • Testing with Pest or PHPUnit: If you are starting out, you don't need to configure tests right away. In many initial projects I prefer answering no and adding tests later when the project flow is well defined. Both Pest and PHPUnit are good options; in modern Laravel projects I usually prefer Pest for its more expressive syntax.
  • What each option actually generates: Regardless of the stack you choose, Breeze publishes into your project:
    • Authentication routes in routes/auth.php
    • Controllers in app/Http/Controllers/Auth/
    • Views in resources/views/auth/
    • Blade components in resources/views/components/
    • Frontend configuration (vite.config.js, tailwind.config.js)
  • None of this is “magic”. All generated code remains in your project for you to read, understand, and modify without restrictions.

Common errors when installing Laravel Breeze (and how to fix them)

  • Error Cannot find module 'node:path': This error indicates that your Node version is too old. Check your version with:

    node -v

    If you see something like v14.x, you need to update. In real-world projects, I work with v18.x or higher without any problems.

  • Incompatible Node versions: Modern Laravel along with Vite require updated versions of Node.js. Updating Node solves 90% of initial frontend-related errors.
  • Issues with Vite on Windows environments: On Windows, misconfigured paths or permission issues can cause build errors. Most of these problems can be resolved with the following steps:
    • Update Node.js to a modern LTS version (v18+ or v20+)
    • Delete the node_modules folder
    • Run npm install again and then npm run dev
  • Overwritten routes in routes/web.php: Breeze modifies your routes file upon installation. Check the file after installation and restore any custom routes you had previously.

Guide to installing and configuring Laravel Breeze on Laravel 13. Stack Blade, Tailwind CSS and Alpine.js with real-world examples and solutions to common errors.


Únete a la comunidad de desarrolladores que han decidido dejar de picar código y empezar a construir productos reales. Recibe mis mejores trucos de arquitectura cada semana:

I agree to receive announcements of interest about this Blog.