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

Tutorial step‑by‑step ini menjelaskan cara menginstal Laravel 11 terbaru, mengintegrasikan Vite, Breeze, serta Sanctum untuk API authentication, dengan konfigurasi optimal yang siap produksi.

1. Persiapan Lingkungan

Pastikan server Anda memenuhi persyaratan minimum Laravel 11:

• PHP >= 8.2
• Ekstensi: OpenSSL, PDO, Mbstring, Tokenizer, XML, Ctype, JSON, BCMath
• Composer 2.x
• Node.js 20.x & npm 10.x

1.1 Install Composer & Node

curl -sS https://getcomposer.org/installer | php
npm install -g npm@latest

2. Instalasi Laravel 11

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

2.1 Verifikasi Instalasi

php artisan --version
# output: Laravel Framework 11.x.x

3. Mengganti Laravel Mix dengan Vite (default Laravel 11)

Laravel 11 sudah menyertakan Vite. Pastikan vite.config.js ada dan package.json berisi:

{
  "scripts": {
    "dev": "vite",
    "build": "vite build"
  }
}

3.1 Jalankan Dev Server

npm install
npm run dev

4. Instalasi Laravel Breeze (Starter Kit)

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

4.1 Struktur Direktori

Breeze menambahkan:

• resources/js/Pages – Vue components
• app/Http/Controllers/Auth – controller autentikasi
• routes/web.php – route UI

5. Menambahkan Laravel Sanctum untuk API Authentication

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

5.1 Konfigurasi Middleware

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

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

5.2 Menggunakan Token Personal

// App/Models/User.php
use Laravel\Sanctum\HasApiTokens;
class User extends Authenticatable {
    use HasApiTokens, Notifiable;
}

// Membuat token
$token = $user->createToken('api-token')->plainTextToken;

6. Contoh API CRUD dengan Sanctum

6.1 Route API

use App\Http\Controllers\Api\PostController;
Route::middleware('auth:sanctum')->group(function () {
    Route::apiResource('posts', PostController::class);
});

6.2 Controller

namespace App\Http\Controllers\Api;
use App\Models\Post;
use Illuminate\Http\Request;
use App\Http\Controllers\Controller;
class PostController extends Controller {
    public function index() { return Post::all(); }
    public function store(Request $request) {
        $data = $request->validate(['title' => 'required','body' => 'required']);
        return Post::create($data);
    }
    public function show(Post $post) { return $post; }
    public function update(Request $request, Post $post) {
        $post->update($request->validate(['title'=>'sometimes','body'=>'sometimes']));
        return $post;
    }
    public function destroy(Post $post) { $post->delete(); return response()->noContent(); }
}

6.3 Frontend Vue Call dengan Axios & Sanctum

import axios from 'axios';
axios.defaults.withCredentials = true; // penting untuk Sanctum
axios.get('/sanctum/csrf-cookie').then(() => {
  axios.post('/login', {email, password}).then(res => {
    // token tersimpan secara cookie
    axios.get('/api/posts').then(r => console.log(r.data));
  });
});

7. Best Practice Production Ready

• Environment Variables: gunakan .env.production dan set APP_ENV=production, APP_DEBUG=false.
• Cache Config & Routes: php artisan config:cache & php artisan route:cache.
• Optimized Autoloader: composer install --optimize-autoloader --no-dev.
• HTTPS & HSTS: konfigurasikan server web (NGINX/Apache) untuk forced SSL.
• Queue & Jobs: gunakan Laravel Horizon (Redis) untuk background tasks.
• Monitoring: integrasikan Laravel Telescope (hanya di staging) & Sentry untuk error tracking.

Dengan mengikuti langkah-langkah di atas Anda memiliki proyek Laravel 11 yang modern, menggunakan Vite untuk asset bundling, Breeze sebagai starter UI, serta Sanctum untuk API authentication. Kombinasi ini memberikan developer kecepatan, keamanan, dan skalabilitas yang cocok untuk aplikasi web maupun mobile di era 2026.

---

Tutorial lengkap setup Laravel 11 dengan Vite, Breeze, dan Sanctum. Ikuti langkah instalasi, konfigurasi, contoh kode, dan best practice produksi untuk aplikasi modern.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend