In this section we will see how to authentication in laravel 9 with Next JS. Laravel breeze provide auth api, So it easy to setup laravel sanctum auth api, For nextjs frontend we will use breeze next js kit.
Setup Laravel Authentication API
Create laravel project
composer create-project Laravel/laravel laravel-auth-api
Setup your .env file
.env
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=database_name
DB_USERNAME=database_user_name
DB_PASSWORD=database_password
Install Laravel Breeze
composer require laravel/breeze --dev
Install laravel breeze api command to create auth api.
php artisan breeze:install api
After install breeze api, you can see .env file two url for backend and frontend. You can change url in production, for local leave it.
.env
APP_URL=http://localhost:8000
FRONTEND_URL=http://localhost:3000
run project and leave it.
php artisan serve
Note: Open two terminal one for run laravel application & second to create nextjs project and run.
Setup Next js Auth Frontend
You need to just clone or download breeze-next repo.
You need to clone or download breeze-next .
Clone breeze-next repository
run below command to clone repo. you can check repository link.
git clone https://github.com/laravel/breeze-next.git
Install npm dependencies.
npm install
Copy env file
cp .env.example .env
.env
you can change url in production.
NEXT_PUBLIC_BACKEND_URL=http://localhost:8000
run next js project
npm run dev
Next js register page
http://localhost:3000/register
next js auth register page
Next js login page
http://localhost:3000/login
next js auth login page
Next js dashboard page
http://localhost:3000/dashboard
next js auth dashboard page
Read Also
Laravel 9 Add Simple Sidebar with Tailwind CSS Example
How to Use Carousel Slider in Laravel 9 Example
Laravel 9 Posts with Tags Many to Many Relationships Example
Laravel 9 Insert Category in Posts CRUD Example
How to Use Ckeditor 5 in Laravel 9 Vite with Tailwind CSS
Laravel 9 Simple Image Upload in Ckeditor 5 Example
Laravel 9 Flash Message Timeout and Hide Message Example
Install & Setup Markdown Editor in Laravel 9
Nuxt 3 Data Fetching Using Laravel 9 Api Example
Laravel 9 Image Upload with Preview using Tailwind CSS & Alpine JS
Laravel 9 with Tailwind CSS Form Validation Example
Laravel 9 Backend Api Connect with Vue 3 Using Axios Example
Laravel 9 Authentication with Next js Example
Laravel 9 Sanctum Authentication with Nuxt JS Example
Laravel 9 Simple Search with Pagination Example
Laravel 9 Install Setup TALL(Tailwind, Alpinejs, Livewire) Admin Panel
How to Fix and Clean Code Style in laravel 9
Laravel 9 Image File Upload Example
