Scaffolding for react auth in Laravel 9; In this article, I'll demonstrate how to use the Laravel UI and React Auth scaffolding to create login, register, logout, forget password, profile, and reset password pages.

React ui and auth packages are provided by Laravel 9 by default for login, register, logout, reset password, forget password, and email verification. Installing this package only requires one short command.

Table of Contents

1. Install Laravel 9 App
2. Database Configuration
3. Install Laravel UI
4. Setup React Auth Scaffolding
5. Install Npm Packages
6. Run PHP artisan Migrate
7. Run Development Server

Install Laravel 9 App

In step 1, open your terminal and use the following command to browse to your local web server directory:

//for windows user
cd xampp/htdocs

//for ubuntu user
cd var/www/html

Then run the following command to install the most recent Laravel application:

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

Database Configuration

In step 2, open any text editor and paste your downloaded laravel app. Then locate the .env file and specify the database details as follows:

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

Install Laravel UI

In step 3, use the following command to install the LARAVEL ui package in the laravel app:

composer require laravel/ui

Setup React Auth Scaffolding

Install the auth scaffolding react package in the Laravel project in step 4 by running the command below:

php artisan ui react --auth

Install Npm Packages

In step 5, restart the command prompt and enter the following line to install node js:

npm install

Then, on cmd, enter the following command to launch npm:

npm run dev

Run php artisan Migrate

Step 6: Open a terminal and enter the following command to create a database table:

php artisan migrate

Run Development Server

Start the development server using the following command

php artisan serve

Open your browser now and go to this URL:

http://127.0.0.1:8000/