Laravel 10 vue 3 js Login Registration Authentication Example

Laravel 10 vue js ui provides a default auth package for login, register, logout, reset password, forget the password, and email verification.

In this tutorial, you will learn how to create a login, register, logout, forget password, profile, and reset password by using laravel 10 vue js ui auth scaffolding.

Laravel 10 vue 3 js Login Registration Authentication Example

Steps to create a login, register, logout, forget password, profile, and reset password in laravel 10 using vue js ui auth scaffolding.

• Step 1 – Create New Laravel 10 Project
• Step 2 – Setup Database
• Step 3 – Install Laravel UI
• Step 4 – Setup Vue Js Auth Scaffolding
• Step 5 – Install NPM packages
• Step 6 – Run Development Server

Step 1 – Create New Laravel 10 Project

First of all, open your cmd or terminal and navigate to your local web server directory by using the following command:

//for windows user
cd xampp/htdocs

//for ubuntu user
cd var/www/html

Next, run the following command on cmd to install laravel latest application:

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

Step 2 – Setup Database

Once you have installed Laravel on your server. Next, you need to set up a database with Laravel project. So, open your downloaded Laravel app in any text editor and find the .env file & set database like:

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=db name
DB_USERNAME=db user name
DB_PASSWORD=db password

Step 3 – Install Laravel UI

Next run the following command on cmd to install LARAVEL ui package:

composer require laravel/ui

Step 4 – Setup Vue Auth Scaffolding

Once you have install laravel ui, now you need to run the following command on cmd to install auth scaffolding vue package in laravel:

php artisan ui vue --auth

Step 5 – Install NPM packages

Next, open again cmd and run the following command into it to install node js:

npm install

Then type the following command on cmd to run npm:

npm run dev

And run the following command on cmd to create database table:

php artisan migrate

Step 6 – Run Development Server

Finally, run the following command on cmd to start the development server:

php artisan serve

Open web browser and hit the following url on it:

http://127.0.0.1:8000/

Conclusion

That’s it; You have learned how to create a login, register, logout, forget password, profile, and reset password in laravel 10 using vue js ui auth scaffolding.

Recommended Laravel Tutorials