Panduan Lengkap Setup Laravel 11 dengan Praktik Modern: Vite, Breeze, Sanctum, dan Jetstream

Tutorial step‑by‑step untuk menginstal Laravel 11 terbaru, mengkonfigurasi Vite, menambahkan Breeze sebagai starter kit, mengamankan API dengan Sanctum, serta menerapkan best practice modern pada 2026.

1. Prasyarat

• PHP 8.3 atau lebih tinggi
• Composer 2.x
• Node.js 20+ dan npm 10+
• Database MySQL 8 atau PostgreSQL 15

2. Instalasi Laravel 11

Step 1: Buat project baru

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

Perintah ini mengunduh Laravel 11 stabil.

Step 2: Masuk ke directory

cd blog

3. Konfigurasi Vite (Asset Bundler Modern)

Step 1: Install dependensi

npm install

Laravel 11 sudah menyertakan vite dan laravel-vite-plugin secara default.

Step 2: Build dan serve

npm run dev   // mode development dengan hot‑reload

Untuk production gunakan npm run build.

4. Menambahkan Laravel Breeze (Starter Kit)

Step 1: Install package Breeze

composer require laravel/breeze --dev

Step 2: Install scaffolding dengan Vite

php artisan breeze:install vue

Anda bisa pilih blade, react, atau vue. Contoh ini menggunakan Vue 3.

Step 3: Compile assets

npm install && npm run dev

5. Mengamankan API dengan Laravel Sanctum

Step 1: Install Sanctum

composer require laravel/sanctum

Step 2: Publikasi konfigurasi & migrasi

php artisan vendor:publish --provider="Laravel\Sanctum\SanctumServiceProvider"
php artisan migrate

Step 3: Tambahkan middleware pada api guard

// app/Http/Kernel.php
'api' => [
    \Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
    'throttle:api',
    \Illuminate\Routing\Middleware\SubstituteBindings::class,
],

Step 4: Buat route login API

use AppModelsUser;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Hash;

Route::post('/login', function (Request $request) {
    $user = User::where('email', $request->email)->first();
    if (! $user || ! Hash::check($request->password, $user->password)) {
        return response()->json(['message' => 'Invalid credentials'], 401);
    }
    return $user->createToken('api-token')->plainTextToken;
});

Step 5: Konsumsi token di frontend (Vue)

axios.post('/api/login', {email, password})
     .then(r => localStorage.setItem('token', r.data));

axios.get('/api/user', { headers: { Authorization: `Bearer ${localStorage.getItem('token')}` } });

6. Best Practice Modern (2026)

• Environment Variables: Simpan semua secret di .env dan gunakan config:cache untuk produksi.
• Cache Config & Routes: php artisan config:cache dan php artisan route:cache setelah deploy.
• Queue & Jobs: Untuk email verifikasi atau notifikasi, gunakan queue:work dengan driver redis.
• Testing: Laravel Pint + PestPHP untuk standar kode dan unit testing.
• Static Analysis: Tambahkan phpstan dan psalm ke pipeline CI.

Dengan mengikuti langkah‑langkah di atas, Anda memiliki proyek Laravel 11 yang siap produksi, menggunakan Vite untuk front‑end modern, Breeze sebagai UI starter, dan Sanctum untuk API yang aman. Terapkan best practice seperti caching, queue, dan testing untuk memastikan aplikasi scalable dan maintainable di 2026.

---

Panduan lengkap setup Laravel 11 dengan Vite, Breeze, Sanctum, dan best practice modern. Ikuti tutorial step‑by‑step untuk memulai proyek Laravel terbaru di 2026.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend