Authentication Using Jetstream and Livewire in Laravel

Authentication Using Jetstream and Livewire in Laravel

Laravel Jetstream is good starter kit which provide implementation for login, registration, two factor authentication, etc. You can use Jetstream with two available frontend stack Livewire and inertia.js. We are using Laravel Livewire in this tutorial with Laravel Blade templating language.

Before You Start make sure you system is ready for Laravel

Create Application

I am using the ” AuthJetstreamLivewire ” name for this application. Enter the following command and hit enter

composer create-project --prefer-dist laravel/laravel AuthJetstreamLivewire

Create Database

Create one database as shown in the following screen.

I have created the ” AuthJetstreamLivewire ” database but you can give any name to the database.

Connect this Laravel Jetstram Authentication Application with Database

To connect this application with newly created database enter your database credentials in the .env file as shown in the following image. The credentials I am using here are only for demo purpose. You have to use your own credentials as per you development environment setup.

Important : Never share your credentials with unauthorized persons or on unauthorized platforms

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=AuthJetstreamLivewire
DB_USERNAME=root
DB_PASSWORD=*******

Quick Check

Run the following command to check if the Application is created successfully and things are working fine till now

php artisan serve

Enter the following url in the browser

http://localhost:8000/

Install Jetstream Library

Open the command prompt and type the following command to install Laravel Jetstream library

composer require laravel/jetstream

Install Jetstream With Livewire / Livewire Scaffolding Installation

We have installed Jetstream using composer hence frontend stacks installation is required, We are using livewire in this Laravel 8 authentication tutorial. Type the following command in the command prompt and press enter.

php artisan jetstream:install livewire


OR livewire with team functionality

php artisan jetstream:install livewire --teams

As you can see in the following screen some new folders and files added after the above command

i.

ii.

ii.

Install npm dependencies for this Laravel 8 Jetstream Authentication Application

Open the command prompt and type the following command to build your asset

npm install && npm run dev

Once installed successfully you will see the following screen

Quick check after the npm install && npm run dev command

Run the following command to check what will happen if you try to run the application

Php artisan serve

Type the following url in the browser and press enter

http://localhost:8000/

You may see the following screen because we have not run the migration yet

Run the Migration

Type the following command to run the Migratio

php artisan migrate

You will see the following screen after successful migration

Database and tables after migration

You will see all default tables after the migrate command as shown in the following image

Run the Laravel 8 Application & Final Test

Type the following command in the command prompt

Php artisan serve

Type the following url in your browser

http://localhost:8000/

or

http://127.0.0.1:8000/

You will see the following screen with Login and Registration link buttons

Click on the Register link button and create one user of you choice

Login using the credentials created during the above registration process

After successful login you will the following screen

User profile page view and available default options

As you can see in the following screen the profile page has following options

1. Update Your Profile Information
2. Update or Change Password
3. Two Factor Authentication – Enable and disable 2fa
4. Browser Sessions – You can logout the users from different devices and browsers
5. Delete Account

Learn more about Jetstream

Want to Learn about Laravel 8 Authentication Tutorial using Breeze

Thank you for reading this tutorial
Have a great learning !