Laravel 11 Breeze Multi-Authentication tutorial

In this Laravel 11 tutorial, we learn how to create a Laravel 11 multi authentication application using breeze and livewire.

Laravel Breeze is a minimal, simple implementation of all of Laravel's authentication features, including login, registration, password reset, email verification, and password confirmation. In addition, Breeze includes a simple "profile" page where the user may update their name, email address, and password.

Laravel Breeze's default view layer is made up of simple Blade templates styled with Tailwind CSS. Additionally, Breeze provides scaffolding options based on Livewire or Inertia, with the choice of using Vue or React for the Inertia-based scaffolding.

Laravel Bootcamp

If you're new to Laravel, feel free to jump into the Laravel Bootcamp. The Laravel Bootcamp will walk you through building your first Laravel application using Breeze. It's a great way to get a tour of everything that Laravel and Breeze have to offer.

Installation

First, you should create a new Laravel application. If you create your application using the Laravel installer, you will be prompted to install Laravel Breeze during the installation process. Otherwise, you will need to follow the manual installation instructions below.

If you have already created a new Laravel application without a starter kit, you may manually install Laravel Breeze using Composer:

composer require laravel/breeze --dev

After Composer has installed the Laravel Breeze package, you should run the breeze:install Artisan command. This command publishes the authentication views, routes, controllers, and other resources to your application. Laravel Breeze publishes all of its code to your application so that you have full control and visibility over its features and implementation.

The breeze:install command will prompt you for your preferred frontend stack and testing framework:

php artisan breeze:installphp artisan migratenpm installnpm run dev

Breeze and Blade

The default Breeze "stack" is the Blade stack, which utilizes simple Blade templates to render your application's frontend. The Blade stack may be installed by invoking the breeze:install command with no other additional arguments and selecting the Blade frontend stack. After Breeze's scaffolding is installed, you should also compile your application's frontend assets:

php artisan breeze:installphp artisan migratenpm installnpm run dev

Next, you may navigate to your application's /login or /register URLs in your web browser. All of Breeze's routes are defined within the routes/auth.php file.

To learn more about compiling your application's CSS and JavaScript, check out Laravel's Vite documentation.

Breeze and Livewire

Laravel Breeze also offers Livewire scaffolding. Livewire is a powerful way of building dynamic, reactive, front-end UIs using just PHP.

Livewire is a great fit for teams that primarily use Blade templates and are looking for a simpler alternative to JavaScript-driven SPA frameworks like Vue and React.

To use the Livewire stack, you may select the Livewire frontend stack when executing the breeze:install Artisan command. After Breeze's scaffolding is installed, you should run your database migrations:

php artisan breeze:installphp artisan migrate

Breeze and React / Vue

Laravel Breeze also offers React and Vue scaffolding via an Inertia frontend implementation. Inertia allows you to build modern, single-page React and Vue applications using classic server-side routing and controllers.

Inertia lets you enjoy the frontend power of React and Vue combined with the incredible backend productivity of Laravel and lightning-fast Vite compilation. To use an Inertia stack, you may select the Vue or React frontend stacks when executing the breeze:install Artisan command.

When selecting the Vue or React frontend stack, the Breeze installer will also prompt you to determine if you would like Inertia SSR or TypeScript support. After Breeze's scaffolding is installed, you should also compile your application's frontend assets:

php artisan breeze:installphp artisan migratenpm installnpm run dev

Next, you may navigate to your application's /login or /register URLs in your web browser. All of Breeze's routes are defined within the routes/auth.php file.

Breeze and Next.js / API

Laravel Breeze can also scaffold an authentication API that is ready to authenticate modern JavaScript applications such as those powered by Next, Nuxt, and others. To get started, select the API stack as your desired stack when executing the breeze:install Artisan command:

php artisan breeze:installphp artisan migrate

During installation, Breeze will add a FRONTEND_URL environment variable to your application's .env file. This URL should be the URL of your JavaScript application. This will typically be http://localhost:3000 during local development. In addition, you should ensure that your APP_URL is set to http://localhost:8000, which is the default URL used by the serve Artisan command.

Next.js Reference Implementation

Finally, you are ready to pair this backend with the frontend of your choice. A Next reference implementation of the Breeze frontend is available on GitHub. This frontend is maintained by Laravel and contains the same user interface as the traditional Blade and Inertia stacks provided by Breeze.

#laravel #laravel11 #php 

Laravel 11 Tutorial - Breeze Multi-Authentication
1.05 GEEK