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

Tutorial step‑by‑step ini mengajarkan cara menginstal Laravel 11 terbaru, mengkonfigurasi Vite sebagai bundler aset, menambahkan Breeze untuk scaffolding UI, serta mengamankan API dengan Sanctum – semua dengan praktik terbaik tahun 2026.

1. Prasyarat

• PHP >= 8.3
• Composer 2.x
• Node.js >= 20 dengan npm atau Yarn
• Database MySQL 8 atau PostgreSQL 15
• Git

2. Instalasi Laravel 11

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

Masuk ke folder proyek:

cd blog

2.1. Inisialisasi Git

git init && git add . && git commit -m "Initial commit - Laravel 11"

3. Konfigurasi Vite (Asset Bundler bawaan)

Laravel 11 sudah menyertakan Vite. Pastikan vite.config.js berisi preset Laravel.

npm install && npm run dev

Jika menggunakan yarn:

yarn install && yarn dev

3.1. Optimasi Production

npm run build

Perintah ini menghasilkan berkas ter‑minify di public/build dan menambahkan hash untuk cache‑busting.

4. Menambahkan Laravel Breeze (Livewire atau Blade)

Untuk UI cepat gunakan Breeze. Pilih stack Blade (default) atau Livewire jika interaktivitas diperlukan.

composer require laravel/breeze --dev
php artisan breeze:install blade
# atau untuk Livewire
# php artisan breeze:install livewire
npm run dev

Jalankan migrasi:

php artisan migrate

4.1. Customisasi Tailwind

• Instalasi Tailwind (sudah disertakan oleh Breeze).
• Ubah tailwind.config.js untuk menambah darkMode: ['class'] demi dukungan dark mode.

5. Mengamankan API dengan Laravel Sanctum

Sanctum memungkinkan token‑based atau session‑based authentication untuk SPA.

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

5.1. Middleware

Tambahkan EnsureFrontendRequestsAreStateful::class ke grup api di app/Http/Kernel.php:

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

5.2. Contoh Route API

Route::middleware('auth:sanctum')->get('/user', function (Request $request) {
    return $request->user();
});

5.3. Frontend (Axios)

import axios from 'axios';
axios.defaults.withCredentials = true;
axios.get('/sanctum/csrf-cookie').then(() => {
    axios.post('/login', {email, password}).then(res => {
        // authenticated
    });
});

6. Best Practice Modern (2026)

• Environment Variables: Simpan semua secret di .env dan gunakan phpdotenv 5.x untuk tipe casting.
• Database Migration & Seeding: Jalankan php artisan migrate --step untuk rollback granular dan gunakan factories berbasis fakerphp/faker v2.
• Testing: Pakai PestPHP 2.x bersama Laravel Testbench; contoh: pest untuk unit & feature test.
• Code Quality: Integrasikan PHPStan 2.x dan Pint untuk format otomatis pada CI GitHub Actions.
• Cache Strategy: Gunakan Redis (Laravel 11 default) untuk session, cache, dan queue; set CACHE_DRIVER=redis dan QUEUE_CONNECTION=redis.
• Deployment: Containerize dengan Docker multi‑stage, gunakan php-fpm + caddy sebagai reverse proxy, dan jalankan php artisan schedule:run via cron container.

7. Verifikasi Instalasi

1. Buka http://localhost:8000 – tampilan Breeze welcome.
2. Register & login, pastikan session berfungsi.
3. Buka http://localhost:8000/api/user dengan token Sanctum – harus mengembalikan JSON user.

Dengan mengikuti langkah‑langkah di atas, Anda akan mendapatkan proyek Laravel 11 yang modern, terstruktur, dan siap untuk produksi. Menggunakan Vite, Breeze, dan Sanctum memastikan performa front‑end optimal, UI cepat, serta keamanan API yang sesuai standar 2026. Terapkan best practice yang disebutkan untuk mempermudah pemeliharaan, scaling, dan kolaborasi tim.

---

Tutorial lengkap setup Laravel 11 tahun 2026 dengan Vite, Breeze, dan Sanctum. Langkah instalasi, konfigurasi, contoh kode, dan best practice modern untuk pengembangan web PHP Framework.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend