Tutorial step-by-step ini membahas cara menginstal Laravel 11 terbaru, mengkonfigurasi Vite, Breeze, Sanctum, serta praktik terbaik untuk pengembangan aplikasi web modern di tahun 2026.
1. Persiapan Lingkungan
1.1. Prasyarat Sistem
- PHP ^8.2
- Composer 2.x
- Node.js 20.x + npm
- Database MySQL 8 atau PostgreSQL 15
1.2. Membuat Proyek Laravel Baru
composer create-project laravel/laravel my-app "11.*"Perintah ini mengunduh Laravel 11 stabil serta semua dependensinya.
2. Mengintegrasikan Vite sebagai Asset Bundler
2.1. Instalasi Vite
cd my-app
npm install --save-dev vite laravel-vite-plugin
2.2. Konfigurasi vite.config.js
import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
export default defineConfig({
plugins: [
laravel([
'resources/css/app.css',
'resources/js/app.js',
]),
],
});
2.3. Memodifikasi package.json
{
"scripts": {
"dev": "vite",
"build": "vite build"
}
}
2.4. Menggunakan Vite di Blade
<!-- resources/views/layouts/app.blade.php -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ config('app.name') }}</title>
@vite(['resources/css/app.css', 'resources/js/app.js'])
</head>
<body>
@yield('content')
</body>
</html>
3. Menambahkan Laravel Breeze (Starter Kit) dengan Inertia.js atau Blade
3.1. Instalasi Breeze
composer require laravel/breeze --dev
php artisan breeze:install blade
# atau untuk Inertia Vue:
# php artisan breeze:install vue
npm install && npm run dev
php artisan migrate
3.2. Struktur Folders
Breeze menyediakan route, controller, view, dan test dasar. Pastikan app/Models/User.php menggunakan HasApiTokens untuk Sanctum (akan dibahas selanjutnya).
4. Mengamankan API dengan Laravel Sanctum
4.1. Instalasi Sanctum
composer require laravel/sanctum
php artisan vendor:publish --provider="Laravel\Sanctum\SanctumServiceProvider"
php artisan migrate
4.2. Konfigurasi Middleware
Tambahkan middleware EnsureFrontendRequestsAreStateful::class ke grup api pada app/Http/Kernel.php:
'api' => [
\Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
'throttle:api',
\Illuminate\Routing\Middleware\SubstituteBindings::class,
],
4.3. Menggunakan Token Personal
// Membuat token di controller
public function createToken(Request $request)
{
$user = Auth::user();
$token = $user->createToken('mobile-app')->plainTextToken;
return response()->json(['token' => $token]);
}
4.4. Mengakses API dengan Token
fetch('/api/user', {
headers: { 'Authorization': `Bearer ${token}` }
}).then(r => r.json()).then(console.log);
5. Best Practice Modern
- Environment Variables: Simpan semua credential di
.envdan gunakanconfig:cachepada produksi. - Database Migrations & Seeders: Selalu versioning schema dengan
php artisan migrate --step. - Testing: Gunakan PestPHP atau PHPUnit, contoh:
php artisan test. - Code Style: Aktifkan
Laravel Pintuntuk format otomatis:vendor/bin/pint. - Cache & Queue: Konfigurasi Redis sebagai driver cache dan queue untuk performa tinggi.
- Docker: Buat environment kontainer dengan
docker-compose.yml(php, nginx, mysql, redis) untuk konsistensi tim.
6. Deploy ke Production
- Build assets:
npm run build - Cache config & routes:
php artisan config:cache && php artisan route:cache - Optimalkan autoload:
composer install --optimize-autoloader --no-dev - Jalankan migrasi:
php artisan migrate --force - Set permission folder
storagedanbootstrap/cacheke 775.
Dengan mengikuti langkah-langkah di atas, Anda akan memiliki aplikasi Laravel 11 yang modern, cepat, dan aman. Menggunakan Vite, Breeze, dan Sanctum memastikan front‑end responsif, autentikasi terkelola, serta alur kerja developer yang efisien. Terapkan best practice seperti caching, testing, dan deployment otomatis untuk menjaga kualitas kode pada skala produksi.
Tutorial lengkap setup Laravel 11 dengan Vite, Breeze, Sanctum, dan praktik terbaik modern pada 2026. Ikuti langkah demi langkah instalasi, konfigurasi, contoh kode, dan deployment.
Laravel,PHP Framework,Web Development
#Laravel #LaravelIndonesia #PHP #WebDev #Backend
.png)
Tidak ada komentar:
Posting Komentar