Setup Laravel 11 dengan Best Practice Modern: Vite, Breeze, Sanctum, dan lebih

Panduan lengkap step‑by‑step untuk menginstal Laravel 11 terbaru, mengonfigurasi Vite, Breeze, Sanctum, serta praktik terbaik yang wajib diterapkan pada tahun 2026.

1. Persiapan Lingkungan

Pastikan server Anda memenuhi persyaratan minimum Laravel 11:

• PHP >= 8.3
• Composer 2.x
• Node.js >= 20 dengan npm atau yarn
• Database (MySQL 8+, PostgreSQL 15+)

1.1. Instalasi PHP & Composer

sudo apt update && sudo apt install -y php8.3 php8.3-cli php8.3-mbstring php8.3-xml php8.3-bcmath php8.3-curl php8.3-mysql
curl -sS https://getcomposer.org/installer | php -- --install-dir=/usr/local/bin --filename=composer

1.2. Instalasi Node.js & Vite

curl -fsSL https://deb.nodesource.com/setup_20.x | sudo -E bash -
sudo apt install -y nodejs
npm install -g pnpm

2. Membuat Proyek Laravel Baru

composer create-project laravel/laravel myapp "11.*"
cd myapp

Laravel 11 secara default sudah menggunakan Vite sebagai bundler front‑end.

3. Konfigurasi Vite

3.1. Install Dependency Front‑end

pnpm install
pnpm add -D vite laravel-vite-plugin
pnpm add vue@^3.4.0 @vitejs/plugin-vue

3.2. Update vite.config.js

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import vue from '@vitejs/plugin-vue';

export default defineConfig({
    plugins: [
        laravel({
            input: ['resources/js/app.js', 'resources/css/app.css'],
            refresh: true,
        }),
        vue(),
    ],
});

3.3. Buat File Entry

Tambahkan resources/js/app.js:

import { createApp } from 'vue';
import ExampleComponent from './components/ExampleComponent.vue';

createApp({
    components: { ExampleComponent },
}).mount('#app');

Dan resources/views/welcome.blade.php:

<div id="app"><example-component /></div>
@vite(['resources/js/app.js','resources/css/app.css'])

4. Menambahkan Laravel Breeze (Auth & UI)

4.1. Instalasi Breeze dengan Vue

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

4.2. Migrasi Database

php artisan migrate

Setelah ini, Anda sudah memiliki halaman login, registrasi, dan dashboard yang responsive.

5. Mengamankan API dengan Laravel Sanctum

5.1. Install Sanctum

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

5.2. Middleware & Config

Tambahkan middleware EnsureFrontendRequestsAreStateful::class pada api guard (default sudah ada di app/Http/Kernel.php).

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

5.3. Membuat Route API Contoh

use Illuminate\Support\Facades\Route;
use App\Http\Controllers\API\ProfileController;

Route::middleware('auth:sanctum')->get('/user', [ProfileController::class, 'show']);

5.4. Front‑end Token Handling (Vue)

import axios from 'axios';
axios.defaults.withCredentials = true; // penting untuk Sanctum

// login contoh
await axios.post('/login', {email, password});
// token dikelola cookie HttpOnly otomatis

6. Best Practice Modern (2026)

• Environment Files: gunakan .env.example lengkap, jangan commit .env.
• Database Seeding & Factories: gunakan php artisan db:seed --class=DatabaseSeeder bersama fakerphp/faker versi 2.x.
• Static Analysis: aktifkan larastan dan phpstan untuk tipe data ketat.
• Testing: tulis feature test dengan PestPHP (lebih ringkas) dan gunakan RefreshDatabase trait.
• CI/CD: integrasikan GitHub Actions untuk lint, test, dan deployment ke Fly.io atau Laravel Vapor.
• Cache & Queues: pilih Redis 7+; konfigurasi QUEUE_CONNECTION=redis dan gunakan job batching.
• Security: aktifkan APP_DEBUG=false di produksi, gunakan CSP via spatie/laravel-csp, dan set SESSION_SECURE_COOKIE=true.

7. Deploy ke Production

1. Build assets: pnpm run build
2. Cache config & routes: php artisan config:cache && php artisan route:cache
3. Optimasi autoloader: composer install --optimize-autoloader --no-dev
4. Gunakan php-fpm + nginx atau serverless Laravel Vapor.

Setelah selesai, aplikasi siap melayani trafik dengan performa tinggi.

Dengan mengikuti tutorial ini Anda memperoleh instalasi Laravel 11 yang lengkap, integrasi Vite untuk front‑end modern, Breeze untuk UI autentikasi, serta Sanctum untuk keamanan API. Praktik terbaik 2026 memastikan kode yang bersih, aman, dan siap skalabilitas di lingkungan produksi.

---

Panduan step‑by‑step setup Laravel 11 modern dengan Vite, Breeze, Sanctum, best practice 2026. Termasuk instalasi, konfigurasi, contoh kode, dan deployment.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend