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

Tutorial step‑by‑step ini membantu Anda menginstal Laravel 11 terbaru, mengkonfigurasi Vite, Breeze, Sanctum, serta menambahkan Livewire untuk pengalaman full‑stack yang modern dan aman.

1. Prasyarat

• PHP >= 8.2
• Composer 2.x
• Node.js >= 20 dan npm atau Yarn
• Database MySQL/PostgreSQL/SQLite

2. Instalasi Laravel 11

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

Pastikan .env berisi kredensial database yang tepat, lalu jalankan migrasi:

php artisan migrate

3. Konfigurasi Vite (frontend bundler)

Laravel 11 sudah menggunakan Vite secara default. Instalasi dependensi:

npm install
npm run dev

Untuk produksi:

npm run build

4. Menambahkan Laravel Breeze (starter kit auth)

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

Breeze menyediakan route, controller, dan view dasar dengan autentikasi berbasis session.

4.1. Menjalankan migrasi auth

php artisan migrate

5. Menyiapkan Laravel Sanctum (API token & SPA authentication)

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

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

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

Konfigurasi CORS di config/cors.php agar domain frontend (misal http://localhost:5173) di‑allow.

5.1. Contoh penggunaan token di controller

use Laravel\Sanctum\HasApiTokens;

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

6. Menambahkan Livewire (komponen interaktif tanpa JavaScript berlebih)

composer require livewire/livewire
php artisan livewire:install
npm run dev

Livewire otomatis mendaftar script Vite. Buat contoh komponen:

php artisan make:livewire Counter

File app/Http/Livewire/Counter.php:

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>
    <button wire:click="increment">Tambah</button>
    <span>{{ $count }}</span>
</div>

Masukkan ke halaman Blade:

@livewire('counter')

7. Best Practice Modern

• Environment variables: gunakan .env.example yang lengkap dan jangan commit .env ke repo.
• Docker: bangun container PHP‑FPM, Nginx, dan MySQL untuk konsistensi lingkungan.
• Testing: tulis unit & feature test dengan PHPUnit & Pest; jalankan php artisan test dalam CI.
• Code style: terapkan PHP‑CS‑Fixer dan Laravel Pint untuk standar kode.
• Cache config & routes: php artisan config:cache & php artisan route:cache sebelum deploy.
• Security: aktifkan APP_DEBUG=false di produksi, gunakan HTTPS & HSTS, serta set Sanctum cookie same_site=lax.

8. Deploy ke Production

# contoh dengan Laravel Forge atau Vapor
git push production main
ssh user@server
cd /var/www/html
composer install --optimize-autoloader --no-dev
npm ci && npm run build
php artisan migrate --force
php artisan config:cache
php artisan route:cache
php artisan view:cache

Setelah selesai, pastikan queue dan scheduler berjalan via Supervisor atau systemd.

Dengan mengikuti langkah‑langkah di atas, Anda memiliki proyek Laravel 11 yang modern, aman, dan siap dikembangkan lebih lanjut menggunakan Vite, Breeze, Sanctum, dan Livewire. Praktik terbaik seperti pengelolaan environment, testing, dan deployment otomatis akan memastikan aplikasi Anda skalabel dan mudah dipelihara.

---

Tutorial lengkap setup Laravel 11 dengan Vite, Breeze, Sanctum, dan Livewire. Langkah demi langkah, 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