In this section we will see how to use tailwind css admin dashboard in laravel 10 with inertia vue 3 using Larastarters.
Step 1: Create Laravel Project
Installing a fresh new laravel application, so head over to the terminal, type the command, and create a new laravel app.
composer create-project --prefer-dist laravel/laravel project_name
Now, you have to connect the laravel app to the database, hence open the .env configuration file and add the database credentials as suggested below.
.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
Step 2: Install Larastarters
Install Larastarters via composer in laravel 10.
composer require laraveldaily/larastarters --dev
Step 3: Step up & Configure Larastarters
Run the command below configure.
php artisan larastarters:install
Now Select breeze inertia with Tailwind CSS (Select number 1).
Which Laravel starter kit you want to use? [Laravel Breeze (Tailwind)] Laravel Breeze (Tailwind) ....................................................... 0 Laravel Breeze & Inertia (Tailwind) ............................................. 1 Laravel UI (Bootstrap) .......................................................... 2 ❯ 1
After selecting number 1, Next Select tailwind css admin design theme(0,1,2).
Which design theme you want to use? [windmill]
windmill ...................................................................... 0
notusjs ....................................................................... 1
tailwindcomponents ............................................................ 2
❯ 2
Step 4: Compile Project Assets
Compile starter kit if you are using laravel 10 you don't need to run or install npm. if any case you got error then run.
npm install && npm run dev
Next, run this command
php artisan migrate
Step 5: Test Dashboard in Laravel 10 Inertia Vue 3
Now you need to log in or register.
http://127.0.0.1:8000/register
integrate tailwind css admin dashboard in laravel 10 with inertia vue 3
After register http://127.0.0.1:8000/dashboard
laravel 10 inertia vue 3 dashboard
