Laravel 8 Dashboard with Vue Auth Setup (Laravel UI)
This guide helps you create a Laravel 8 project with login, registration, and forgot password features using Vue.js and Laravel UI.
Step 1: Install Laravel 8
Open your terminal and run the following to create a new Laravel 8 app:
composer create-project --prefer-dist laravel/laravel laravel_dashboard_version12 "8.*"
cd laravel_dashboard_version12
Step 2: Install Laravel UI and Auth Scaffolding
After entering your project folder, install Laravel UI and Vue Auth scaffolding:
composer require laravel/ui php artisan ui vue --auth
Then install the frontend dependencies and compile them:
npm install && npm run dev
This command will generate:
-
Login/Register/Forgot Password pages
-
Vue.js setup for frontend
-
Bootstrap-based styling
Step 3: Update .env
File
Open .env
in the root of your project and update the following:
1. Database Configuration
DB_CONNECTION=mysql DB_HOST=127.0.0.1 DB_PORT=3306 DB_DATABASE=your_db DB_USERNAME=root DB_PASSWORD=your_db_password
Make sure your database your_db
already exists in MySQL (or create it using phpMyAdmin or CLI).
2. Mail Configuration (For Forgot Password Emails)
MAIL_MAILER=smtp MAIL_HOST=smtp.gmail.com MAIL_PORT=587 MAIL_USERNAME=your_email@gmail.com MAIL_PASSWORD=your_email_password MAIL_ENCRYPTION=tls MAIL_FROM_ADDRESS=your_email@gmail.com MAIL_FROM_NAME="${APP_NAME}"
Tip for Gmail: If using Gmail, enable App Passwords (recommended if 2FA is enabled).
Step 4: Run Migrations
Run the following to create necessary database tables (users, password_resets, etc.):
php artisan migrate
Step 5: Run the Development Server
Start the Laravel development server:
php artisan serve
By default, it runs on:
http://127.0.0.1:8000
Or if you're using the public
folder through a local server like XAMPP or Laravel Valet:
http://localhost/laravel_dashboard_version12/public/
Result
You can now access the following pages:
-
/login
– Login page -
/register
– Registration page -
/password/reset
– Forgot password page -
/home
– Dashboard after login
Let me know if you want to:
-
Add role-based access (admin, user, etc.)
-
Customize the layout
-
Use Bootstrap 5
-
Deploy the app to shared hosting or a server
I'm happy to help!