README

LaraVibe-Vue

A modern Laravel + Inertia.js + Vue 3 starter kit — skip the boilerplate, build your app.

Introduction

LaraVibe-Vue is an open-source starter kit that combines the backend power of Laravel 13 with a fully typed Vue 3 frontend via Inertia.js v3 — giving you a modern SPA feel without sacrificing the simplicity of classic server-side routing and controllers.

Out of the box you get authentication, account management, an administration area, SSR support, a toast notification system, type-safe route helpers, and a curated set of developer tooling — all wired together and ready to go.

Tech Stack

Backend

Package	Version	Purpose
Laravel	13	Application framework
Inertia Laravel	3	Server-side Inertia adapter
Laravel Wayfinder	0.x	Type-safe route & action generation
Pest	4	Testing framework
Larastan	3	Static analysis (PHPStan for Laravel)
Laravel Pint	1	Opinionated PHP code formatter
Rector	2	Automated PHP refactoring
Laravel Sail	1	Docker development environment
Laravel Pail	1	Real-time log tailing

Frontend

Package	Version	Purpose
Vue 3	3	UI framework (Composition API)
Inertia Vue	3	Client-side Inertia adapter
Tailwind CSS	4	Utility-first CSS framework
Reka UI	2	Headless UI components (shadcn-vue base)
VueUse	12	Vue composition utilities
Lucide Vue	latest	Icon library
vue-sonner	2	Toast notifications
Vite	8	Frontend build tool
TypeScript	5	Type safety
ESLint + Prettier	9 / 3	Linting & formatting

Features

Authentication

User registration and login
Password reset via email
Email verification
Confirmable password (sudo mode) for sensitive operations

Account Management

General — update name and email address
Security — change password
Appearance — light/dark/system theme switcher

Administration Area

Protected /administration prefix with a ready-to-extend Dashboard page

Developer Experience

Laravel Wayfinder — auto-generated, fully-typed TypeScript functions for every controller action and named route. No more hardcoded URLs on the frontend.
SSR out of the box — server-side rendering powered by @inertiajs/vite with cluster mode.
Toast notification system — a first-class PHP Toast facade/helper flashes notifications that surface automatically in Vue via vue-sonner.
LaraTweaks — opinionated Laravel defaults applied at boot: strict Eloquent mode, CarbonImmutable dates, HTTPS-forced URLs, Vite asset prefetching, and destructive command protection in production.
Global helper functions — vue(), optionalProp(), deferProp(), alwaysProp(), authUser() to keep controllers clean and expressive.
PageMeta DTO — pass page titles and meta from the server to Vue in a typed, consistent way.
Breadcrumbs DTO — a structured way to define breadcrumb trails server-side.
shadcn-vue component library — pre-configured via components.json and reka-ui.

Project Structure

app/
├── Actions/            # Single-responsibility action classes
├── DTOs/               # Typed data transfer objects (PageMeta, BreadCrumb)
├── Enums/              # Backed enums (ToastType, ToastActionType)
├── Http/
│   ├── Controllers/    # Auth & Account controllers
│   ├── Middleware/     # Custom middleware
│   ├── Requests/       # Form request validation
│   └── Resources/      # Eloquent API resources
├── Models/             # Eloquent models
├── Support/            # Helpers, LaraTweaks, CarbonImmutable
├── Toast/              # Self-contained toast notification system
└── Traits/             # Reusable traits (ArrayableEnum, FlexibleJsonResource)

resources/
├── components/         # Shared Vue components & shadcn-vue UI
├── composables/        # Vue composables (useAuth, useAppearance, …)
├── layouts/            # Page layouts (Account, Auth, Guest, Administration)
├── views/              # Inertia pages (auth/, account/, administration/)
├── wayfinder/          # Auto-generated Wayfinder route/action files
└── app.ts              # Frontend entry point

Requirements

PHP 8.4+
Composer
Node.js 20+ & npm
SQLite / MySQL / PostgreSQL

Installation

1. Create the project

composer create-project softpulze/laravibe-vue my-app
cd my-app

Or clone the repository:

git clone https://github.com/softpulze/laravibe-vue.git my-app
cd my-app
cp .env.example .env
composer install
php artisan key:generate

2. Configure your environment

Edit .env and set your database connection (SQLite is the default):

DB_CONNECTION=sqlite
# DB_CONNECTION=mysql
# DB_HOST=127.0.0.1
# DB_DATABASE=laravibe
# DB_USERNAME=root
# DB_PASSWORD=

Set your application URL and mail settings as needed.

3. Run migrations

php artisan migrate

4. Install frontend dependencies

npm install

5. Start the development server

composer run dev

This starts the Laravel server, Vite dev server, and Pail log watcher concurrently. Visit http://localhost:8000 in your browser.

Available Scripts

PHP / Composer

Command	Description
`composer run dev`	Start Laravel + Vite + Pail together
`php artisan test --compact`	Run the Pest test suite
`vendor/bin/pint`	Format PHP code with Laravel Pint
`vendor/bin/phpstan`	Run Larastan static analysis
`vendor/bin/rector`	Run Rector refactoring
`php artisan wayfinder:generate`	Regenerate Wayfinder TypeScript files

Node / npm

Command	Description
`npm run dev`	Start the Vite development server
`npm run build`	Build frontend assets for production
`npm run build:ssr`	Build frontend + SSR bundle
`npm run lint`	Lint with ESLint (auto-fix)
`npm run format`	Format frontend files with Prettier
`npm run format:check`	Check formatting without writing changes

Using Laravel Wayfinder

Wayfinder auto-generates typed TypeScript helpers for all your controllers and named routes. After adding a new controller or route, regenerate them:

php artisan wayfinder:generate

Import and use them in your Vue components:

import { AccountController } from '@/actions/Account/AccountController'
import { route } from '@/routes/web'

// In a template
<Link :href="AccountController.edit().url()">Account</Link>

Toast Notifications

Flash a toast from any controller or action using the global toast() helper:

use App\Toast\Toast;

toast()->success('Profile updated.');
toast()->error('Something went wrong.');
toast()->warning('Check your input.');

Toasts are automatically forwarded to the Vue frontend via Inertia shared data and rendered by vue-sonner.

Testing

Tests are written with Pest 4. Run the full suite:

php artisan test --compact

Run a specific test file or filter by name:

php artisan test --compact --filter=AccountController

Code Quality

This project enforces code quality through three tools:

# Format PHP code
vendor/bin/pint

# Static analysis
vendor/bin/phpstan analyse

# Automated refactoring
vendor/bin/rector

For frontend code:

npm run lint      # ESLint
npm run format    # Prettier

Docker (Laravel Sail)

If you prefer Docker, Laravel Sail is included:

./vendor/bin/sail up -d
./vendor/bin/sail artisan migrate
./vendor/bin/sail npm run dev

Deployment

LaraVibe-Vue can be deployed to any environment that supports PHP 8.4. For the fastest path to production, use Laravel Cloud.

Before deploying, build your frontend assets and run:

npm run build:ssr   # build with SSR support
php artisan config:cache
php artisan route:cache
php artisan view:cache

Contributing

Contributions are welcome! Please open an issue or pull request on GitHub.

Fork the repository
Create a feature branch: git checkout -b feature/my-feature
Commit your changes
Push and open a pull request

License

LaraVibe-Vue is open-sourced software licensed under the MIT license.

softpulze / laravibe-vue

Maintainers

Package info

Statistics

Security