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

Tutorial step‑by‑step ini membahas cara menginstal Laravel 11 terbaru, mengintegrasikan Vite, Breeze, dan Sanctum serta menerapkan best practice untuk pengembangan aplikasi web modern di tahun 2026.

1. Persiapan Lingkungan

Pastikan server Anda memenuhi persyaratan minimum Laravel 11:

• PHP >= 8.3
• Ekstensi: OpenSSL, PDO, Mbstring, Tokenizer, XML, Ctype, JSON, BCMath, Fileinfo
• Composer 2.x
• Node.js >= 20 + npm atau Yarn

1.1 Instalasi PHP & Composer

sudo apt update && sudo apt install php8.3 php8.3-cli php8.3-mbstring php8.3-xml php8.3-bcmath php8.3-curl php8.3-zip php8.3-pdo php8.3-tokenizer
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-get install -y nodejs
npm install -g npm@latest

2. Membuat Project Laravel 11

composer create-project laravel/laravel blog "^11.0" --prefer-dist
cd blog

2.1 Mengatur .env

Copy file .env.example menjadi .env dan generate aplikasi key:

cp .env.example .env
php artisan key:generate

3. Mengintegrasikan Vite (Asset Bundler Default)

Laravel 11 sudah menyertakan Vite secara default. Pastikan file vite.config.js ada dan konfigurasi berikut:

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,
        }),
    ],
});

3.1 Install dependencies

npm install
npm run dev   // untuk development
npm run build // untuk production

4. Menambahkan Laravel Breeze (Starter Kit)

composer require laravel/breeze --dev
php artisan breeze:install vue   // Pilihan: blade, react, vue, solid
npm install && npm run dev
php artisan migrate

Setelah instalasi, Breeze menyediakan route auth, view, dan komponen Vue (atau yang dipilih).

4.1 Struktur Folder

• resources/js/Pages – halaman Vue
• resources/js/Components – komponen UI reusable
• routes/web.php – route web standar

5. Menambahkan Laravel Sanctum (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 api middleware group di app/Http/Kernel.php:

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

5.2 Menggunakan Token Personal Access (SPA)

Contoh login melalui SPA (Vue) menggunakan Axios:

axios.get('/sanctum/csrf-cookie').then(() => {
    axios.post('/login', {email, password}).then(response => {
        // user is now authenticated, subsequent requests carry XSRF‑TOKEN cookie
    });
});

5.3 API Route Example

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

6. Best Practice Modern

• Environment Segregation: gunakan .env.testing untuk CI, .env.production dengan APP_DEBUG=false.
• Configuration Caching: jalankan php artisan config:cache & php artisan route:cache pada deploy.
• Database Migrations: selalu gunakan php artisan migrate --force di production dan versioning dengan php artisan migrate:status.
• Static Asset Versioning: Vite menambahkan hash otomatis, pastikan mix-manifest.json tidak ter‑commit.
• Code Style: pasang laravel/pint untuk standar coding PHP, dan eslint + prettier untuk JavaScript/Vue.
• Testing: gunakan PHPUnit untuk unit test dan Pest untuk BDD; contoh: php artisan test.
• Security: aktifkan Sanctum::useCookieEncryption() jika menyimpan token di cookie, dan selalu set SESSION_SECURE_COOKIE=true pada HTTPS.

7. Deploy ke Production (Contoh di Laravel Vapor)

# Install Vapor CLI
composer require laravel/vapor-cli --dev
vapor login
vapor init
# Deploy
vapor deploy production

Vapor otomatis mengatur container dengan PHP 8.3, Vite build, dan environment variables.

Dengan mengikuti langkah‑langkah di atas, Anda memiliki proyek Laravel 11 yang modern, cepat, dan siap produksi. Vite memastikan front‑end bundle yang optimal, Breeze memberikan starter kit authentication UI, dan Sanctum menyederhanakan API authentication untuk SPA. Terapkan best practice seperti caching konfigurasi, kode style, dan CI/CD untuk menjaga kualitas kode di 2026.

---

Tutorial lengkap setup Laravel 11 terbaru dengan Vite, Breeze, dan Sanctum. Ikuti langkah instalasi, konfigurasi, contoh kode, serta best practice modern untuk pengembangan aplikasi web di tahun 2026.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend