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

Tutorial step-by-step ini menjelaskan cara menginstal Laravel 11, mengonfigurasi Vite, menambahkan Laravel Breeze untuk otentikasi, serta mengamankan API dengan Sanctum, lengkap dengan contoh kode dan best practice terkini.

1. Persiapan Lingkungan

1.1. Pastikan Sistem Memenuhi Syarat

• PHP >= 8.2
• Composer terbaru
• Node.js >= 20 & npm atau Yarn
• Database (MySQL 8+, PostgreSQL, atau SQLite)

1.2. Instalasi Laravel Installer (Opsional)

composer global require laravel/installer

Pastikan ~/.composer/vendor/bin ada di PATH.

2. Membuat Proyek Laravel 11 Baru

laravel new blog --jetstream
# atau jika tidak pakai installer
composer create-project laravel/laravel blog "11.*"

Perintah di atas menghasilkan folder blog dengan Laravel 11.

3. Mengganti Mix dengan Vite (Default di Laravel 11)

3.1. Instalasi Dependensi Frontend

cd blog
npm install

3.2. Struktur Direktori

Pastikan file vite.config.js dan resources/js/app.js ada. Laravel 11 telah menyertakan konfigurasi Vite secara default.

3.3. Menjalankan Server Vite

npm run dev

Vite akan menampilkan URL hot-reload, biasanya http://localhost:5173.

4. Menambahkan Laravel Breeze (Frontend Minimal)

4.1. Instalasi Package Breeze

composer require laravel/breeze --dev
php artisan breeze:install vue
# atau react, blade, svelte sesuai kebutuhan

4.2. Install Dependencies & Build

npm install && npm run dev

4.3. Migrasi Database

php artisan migrate

Setelah migrasi, rute otentikasi (/login, /register) siap dipakai.

5. Mengamankan API dengan Laravel Sanctum

5.1. Instalasi Sanctum

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

5.2. Konfigurasi Middleware

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

'api' => [
    \Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
    'throttle:api',
    \Illuminate\Routing\Middleware\SubstituteBindings::class,
],

5.3. Membuat Token API

use App\Models\User;

$token = User::find(1)->createToken('mobile-app')->plainTextToken;

Gunakan token ini pada header Authorization: Bearer <token> untuk panggilan API.

6. Penataan Folder & Best Practice

• Domain‑Driven Structure: Buat folder App/Domain untuk layanan bisnis, App/Models tetap untuk entitas.
• Service Container: Daftarkan binding di App/Providers/AppServiceProvider.php untuk memudahkan testing.
• Form Request Validation: Hindari validasi di controller; gunakan php artisan make:request StorePostRequest.
• Resource Classes: Gunakan php artisan make:resource PostResource untuk respons API konsisten.
• Environment Variables: Simpan rahasia di .env dan gunakan config:cache untuk produksi.
• Cache & Queue: Aktifkan Redis atau Memcached di .env, set CACHE_DRIVER=redis dan QUEUE_CONNECTION=redis.

7. Deploy ke Production

7.1. Optimasi Config & Routes

php artisan config:cache
php artisan route:cache
php artisan view:cache

7.2. Build Assets untuk Production

npm run build
# menghasilkan /public/build

7.3. Set Permission

chmod -R 775 storage bootstrap/cache
chown -R www-data:www-data .

7.4. Restart Queue Workers (jika memakai)

php artisan queue:restart

8. Testing & Debugging

• Jalankan php artisan test untuk unit & feature test.
• Gunakan Laravel Telescope (composer require laravel/telescope) untuk inspeksi request, query, dan error di development.

Dengan mengikuti langkah‑langkah di atas, Anda memiliki aplikasi Laravel 11 yang modern, cepat berkat Vite, memiliki otentikasi standar lewat Breeze, serta API yang aman menggunakan Sanctum. Struktur folder yang terorganisir dan praktik caching/queue membuat aplikasi siap produksi skalabel dan mudah dipelihara.

---

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

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend