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

Ikuti tutorial step-by-step untuk menginstal Laravel 11, mengonfigurasi Vite, Breeze, Sanctum, serta menyiapkan lingkungan pengembangan yang optimal di tahun 2026.

1. Persiapan Lingkungan

1.1. Prasyarat

• PHP >= 8.2
• Composer 2.x
• Node.js 20.x & npm 10.x
• Database MySQL 8 atau PostgreSQL 15

1.2. Instalasi Laravel Installer (opsional)

composer global require laravel/installer

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

2. Membuat Proyek Laravel 11 Baru

laravel new blog --jetstream

atau menggunakan Composer:

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

3. Mengatur Vite (Frontend Asset Bundler)

3.1. Instalasi Dependensi

cd blog
npm install

3.2. Konfigurasi vite.config.js

Laravel 11 sudah menyertakan konfigurasi default, namun tambahkan alias untuk Vue 3 (jika diperlukan):

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,
        }),
    ],
    resolve: {
        alias: {
            '@': '/resources/js',
        },
    },
});

3.3. Menjalankan Dev Server

npm run dev

Vite akan melayani aset dengan hot‑module replacement.

4. Menambahkan Laravel Breeze (Starter Kit)

4.1. Instalasi Breeze

composer require laravel/breeze --dev
php artisan breeze:install blade

Jika ingin menggunakan Inertia + Vue atau React, gunakan --inertia atau --react.

4.2. Kompilasi Asset

npm run dev
php artisan migrate

5. Konfigurasi Laravel Sanctum untuk API Authentication

5.1. Instalasi Sanctum

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

5.2. Menambahkan Middleware

Di app/Http/Kernel.php tambahkan:

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

5.3. Membuat Route API Sanctum

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

5.4. Frontend: Menggunakan Token

Contoh fetch dengan token:

fetch('/api/user', {
    headers: {
        'Authorization': `Bearer ${token}`,
        'Accept': 'application/json',
    },
})
.then(res => res.json())
.then(data => console.log(data));

6. Best Practice Modern

• Environment Segregation: Simpan rahasia di .env dan gunakan .env.example untuk tim.
• Docker Development: Buat docker-compose.yml dengan layanan php, nginx, mysql, redis. Pastikan hot reload Vite dipetakan.
• Testing: Gunakan php artisan test dengan PHPUnit 10 dan Pest untuk BDD.
• Code Style: Terapkan PHP-CS-Fixer dan Laravel Pint (built‑in) secara otomatis pada CI.
• Cache Configuration: Aktifkan OPcache di PHP‑FPM dan gunakan Redis untuk cache & queue.
• Version Control: Commit vite.config.js, composer.lock, package-lock.json, hindari commit node_modules dan vendor.

7. Deploy ke Production

1. Build assets: npm run build
2. Cache konfigurasi & routes: php artisan config:cache && php artisan route:cache
3. Migrasi DB: php artisan migrate --force
4. Set APP_ENV=production dan APP_DEBUG=false
5. Gunakan queue worker dengan php artisan queue:work --daemon atau supervisor.

Dengan mengikuti langkah-langkah di atas, Anda akan memiliki proyek Laravel 11 yang dibangun di atas stack modern: Vite untuk asset bundling, Breeze sebagai starter kit UI, dan Sanctum untuk API authentication. Praktik terbaik seperti Docker, testing, dan caching memastikan aplikasi Anda siap untuk skala produksi di 2026.

---

Tutorial lengkap setup Laravel 11 dengan Vite, Breeze, Sanctum, dan best practice modern untuk pengembangan web di 2026.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend