Laravel 9 Authentication Using Inertia JS

Websolutionstuff | Dec-05-2022 | Categories : Laravel

In this article, we will see laravel 9 authentication using inertia js. Here, you can learn how to authenticate using jetstream inertia js in laravel 8/9. Laravel jetstream provides login, register, email verification, two-factor authentication, and team management features. You can authenticate using livewire and inertia JS using laravel jetstream.

Jetstream is designed using Tailwind CSS and offers your choice of Livewire or Inertia scaffolding. Here, we will use inertia js for authentication in laravel 9. 

Inertia.js lets you quickly build modern single-page React, Vue, and Svelte apps using classic server-side routing and controllers. Inertia isn't a framework, nor is it a replacement for your existing server-side or client-side frameworks.

The inertia  JS uses vue.js as templating language which is provided by the jetstream. Inertia.js gives you the full power of Vue.js without the complexity of client-side routing.

So, let's see jetstream inertia js authentication in laravel 9, laravel 8/9 jetstream inertia js authentication, and laravel 9 inertia auth example.

 

Step 1: Install Laravel 9

In this step, we will install the laravel 9 application using the following command.

composer create-project laravel/laravel laravel_9_auth_inertia_js

 

 

Step 2: Install Jetstream

In this step, we will install laravel jetstream using the composer command.

composer require laravel/jetstream

 

Step 3: Create Authentication with Inertia

Now, we will create auth with help of the jetstream inertia js package. you can create basic login, register, and email verification is given the composer command. In advance, you can create team management if pass the inertia with the --team parameter.

php artisan jetstream:install inertia
  
OR
  
php artisan jetstream:install inertia --teams

Now, we will install the npm package using the following command.

npm install

After that, run the npm package using the following command.

npm run dev

Now, we will migrate the default table using the migration command.

php artisan migrate

 

Laravel 9 Jetstream Features

Laravel jetstreams are customized or configurable. When Jetstream is installed, the config/fortify.php configuration file is installed into your application. Within this configuration file, you can customize various aspects of Fortify's behavior. Within the fortify configuration file, you can also disable entire features of Fortify.

config/fortify.php

'features' => [
        Features::registration(),
        Features::resetPasswords(),
        Features::emailVerification(),
        Features::updateProfileInformation(),
        Features::updatePasswords(),
        Features::twoFactorAuthentication(),
    ],

config/jetstream.php

'features' => [
        Features::profilePhotos(),
        Features::api(),
        Features::teams(),
    ],

 

 

Step 4: Run Laravel 9 Inertia Application

Now, we will run the laravel 9 application using the following command.

php artisan serve

 

Output:

laravel_jetstream_inertia_js_login_page

laravel_jetstream_inertia_js_register_page

 


You might also like:

Recommended Post
Featured Post
How To Resize Image Before Upload In Laravel 10
How To Resize Image Before Upl...

In this article, we will see how to resize images before uploading in laravel 10. Here, we will learn about laravel 10&n...

Read More

Mar-29-2023

How To Setup 404 Page In Angular 12
How To Setup 404 Page In Angul...

In this article, we will see how to set up a 404 page in angular 12.  To set up a 404 page in the angular...

Read More

May-11-2022

How to Manage Time Zones in React.js Applications
How to Manage Time Zones in Re...

In the interconnected world of web development, where applications are accessed by users spanning multiple time zones, t...

Read More

Sep-04-2023

How To Add Toastr Notification In Laravel 10
How To Add Toastr Notification...

In this article, we will see how to add toastr notification in laravel 10. Here, we will learn about toastr notification...

Read More

Mar-06-2023