Panduan Lengkap Setup Laravel 11 dengan Best Practice Modern (Vite, Breeze, Sanctum, dan Livewire)

Ikuti tutorial step‑by‑step ini untuk menginstal Laravel 11 terbaru, menyiapkan Vite, Breeze, Sanctum, dan Livewire secara optimal di tahun 2026.

1. Persyaratan Sistem

Pastikan server Anda memenuhi persyaratan:

• PHP >= 8.3
• Composer 2.7+
• Node.js 20.x dengan npm atau Yarn
• Database MySQL 8.0 atau PostgreSQL 15

2. Instalasi Laravel 11

composer create-project laravel/laravel blog --prefer-dist "11.*"

Masuk ke folder proyek:

cd blog

Penjelasan

Perintah di atas mengunduh versi stabil Laravel 11, cocok untuk proyek baru di 2026.

3. Setup Vite (Asset Bundler Modern)

// Install dependencies
npm install --save-dev vite laravel-vite-plugin

// Tambahkan script di package.json
"scripts": {
    "dev": "vite",
    "build": "vite build"
}

Konfigurasi vite.config.js:

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
    plugins: [
        laravel({
            input: ['resources/css/app.css', 'resources/js/app.js'],
            refresh: true,
        }),
    ],
});

Penjelasan

Laravel Vite memberikan hot‑module‑replacement (HMR) cepat, menggantikan Mix yang sudah usang.

4. Instalasi Laravel Breeze (Starter Kit)

composer require laravel/breeze --dev
php artisan breeze:install vue
npm install && npm run dev

Jika ingin React, gunakan php artisan breeze:install react. Untuk API‑only, gunakan --api.

Penjelasan

Breeze menyediakan scaffolding autentikasi ringan, route, controller, dan view yang sudah terintegrasi dengan Vite.

5. Menambahkan Laravel Sanctum (SPA & API Auth)

composer require laravel/sanctum
php artisan vendor:publish --provider="Laravel\Sanctum\SanctumServiceProvider"
php artisan migrate

Konfigurasi config/sanctum.php:

'stateful' => explode(",", env('SANCTUM_STATEFUL_DOMAINS', 'localhost,127.0.0.1')),

Tambah middleware ke app/Http/Kernel.php:

\Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,

Penjelasan

Sanctum memungkinkan autentikasi cookie‑based untuk SPA yang dibangun dengan Vue/React serta token‑based untuk API.

6. Instalasi Livewire 3 (Reactive Components)

composer require livewire/livewire
npm install && npm run dev

Publikasikan asset (opsional):

php artisan livewire:publish --assets

Contoh Komponen

// app/Http/Livewire/Counter.php
namespace App\Http\Livewire;
use Livewire\Component;
class Counter extends Component {
    public $count = 0;
    public function increment() { $this->count++; }
    public function render() { return view('livewire.counter'); }
}

View resources/views/livewire/counter.blade.php:

<div>
    <h1>Count: {{ $count }}</h1>
    <button wire:click="increment">Tambah</button>
</div>

Penjelasan

Livewire 3 mendukung lazy loading, disk caching, dan integrasi penuh dengan Vite.

7. Best Practice Modern

• Environment Variables: Simpan kunci API, DB, dan Sanctum domains di .env.
• Dockerisasi: Gunakan docker-compose.yml dengan layanan php, mysql, dan node untuk konsistensi dev‑prod.
• Testing: Jalankan php artisan test dengan PHPUnit 11 & Pest untuk unit & feature test.
• Code Quality: Integrasikan PHPStan level max & Laravel Pint untuk standar kode.
• Cache & Queue: Konfigurasikan Redis (driver cache dan queue) untuk performa tinggi.

8. Deploy ke Production

# Build assets
npm run build

# Optimize Laravel
php artisan optimize:clear
php artisan config:cache
php artisan route:cache
php artisan view:cache

# Migrate database
php artisan migrate --force

Gunakan server dengan PHP‑FPM, Nginx, dan enable HTTP/2. Pastikan folder storage dan bootstrap/cache writable.

Dengan mengikuti langkah‑langkah di atas, Anda dapat membangun aplikasi Laravel 11 modern yang siap produksi di 2026. Kombinasi Vite, Breeze, Sanctum, dan Livewire memberi fondasi cepat, aman, dan mudah di‑maintain, serta selaras dengan best practice komunitas Laravel terkini.

---

Tutorial step-by-step setup Laravel 11 dengan Vite, Breeze, Sanctum, dan Livewire. Panduan modern 2026 untuk developer PHP Framework, lengkap dengan best practice.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend