In this installation page we'll show you the steps to install using the Breeze starter kit.
Create a new Breeze application
If you are using the Laravel installer, you may be prompted to install a starter kit. In this prompt you can select Laravel Breeze to install the Breeze starter kit. Alternatively, if you're in a new Laravel app you can install Breeze by following the installation steps here.
If you are using the Laravel installer you can select any of these stacks:
- ✅ Blade with Alpine
- ✅ Livewire (Volt Class API) with Alpine
- ✅ Livewire (Volt Functional API) with Alpine
- ✅ React with Inertia
- ✅ Vue with Inertia
Install the Auth Package
After you've created a new Breeze app you'll want to require the auth package:
Next, you'll need to publish the assets, configs, ci workflow, and migrations:
Next, you'll want to run the new migrations:
Finally, you need to extend the DevDojo User model.
Your default User model needs the methods that handle 2FA and Email Verification.
To do this we want extend the DevDojo User Model from your default App\Models\User.php, navigate to the App\Models\User.php file and add the following class to the top:
use Devdojo\Auth\Models\User as AuthUser;
and extend the AuthUser class:
class User extends AuthUser
Here is what your default User Model should look like:
<?php
namespace App\Models;
use Devdojo\Auth\Models\User as AuthUser;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Foundation\Auth\User as Authenticatable;
use Illuminate\Notifications\Notifiable;
class User extends AuthUser
{
...
}
Now that we have DevDojo Auth setup there are a handful of things that we need to update.
Remove the Guest Authentication Routes
Inside of the routes/auth.php you'll need to remove all the guest authentication routes. Remove all content from this middleware group:
Route::middleware('guest')->group(function () {
// remove all these routes
});
You can remove the whole middleware group as well
Enable the Name Field for Registration
As Breeze depends on the name field for registration, you'll want to enable this option in the setup page.
You can do that by visiting the /auth/setup route, clicking on Settings, and enabling the Registration Include Name Field option.
Modify Inertia Links
Only applicable when using Inertia Stack
By default your application Welcome.vue file located inside of resources/js/Pages/Welcome.* will have the following component links using the Link component:
<Link
:href="route('login')"
class="..."
>
Log in
</Link>
<Link
v-if="canRegister"
:href="route('register')"
class="..."
>
Register
</Link>
You will need to replace these Link elements with an a element, so that it looks like this instead:
<a
:href="route('login')"
class="..."
>
Log in
</a>
<a
v-if="canRegister"
:href="route('register')"
class="..."
>
Register
</a>
This is because when the application uses the Link element, Inertia will open these links via XHR requests, but we need them to perform their own request and function like normal links (the traditional a tags).
Remove the Breeze Auth Views & Controllers
Since we are now using the DevDojo Auth package we no longer need the Breeze authentication views and controllers.
Depending on the stack that you chose you may find the Breeze views in the assets folder or the views folder. These assets will have a parent folder called auth which you can remove. You'll want to remove the views and controllers that handle the Breeze authentication.
You could always leave the views and controllers inside of your application and everything will still function correctly; however, for organization purposes and a cleaner structure you'll probably want to remove these unneccessary files.