Tutorial step‑by‑step ini membimbing Anda menginstal Laravel 11 terbaru, mengkonfigurasi Vite, Breeze, serta API authentication dengan Sanctum, lengkap dengan contoh kode dan best practice untuk proyek produksi di tahun 2026.
1. Persiapan Lingkungan
1.1. Persyaratan Sistem
- PHP >= 8.2
- Composer 2.x
- Node.js >= 20 (termasuk npm atau Yarn)
- Database MySQL 8.x atau PostgreSQL 15
1.2. Instalasi Composer & Node
# Composer
curl -sS https://getcomposer.org/installer | php && mv composer.phar /usr/local/bin/composer
# Node.js (menggunakan nvm)
nvm install 20 && nvm use 20
2. Membuat Proyek Laravel 11
composer create-project laravel/laravel my-project "11.*" --prefer-dist
cd my-project
2.1. Verifikasi Instalasi
php artisan --version
# Output: Laravel Framework 11.x.x
3. Mengintegrasikan Vite (Asset Bundler Modern)
3.1. Instalasi Vite dan Dependensi Frontend
npm init -y
npm install --save-dev vite laravel-vite-plugin
npm install vue@next @vitejs/plugin-vue
3.2. Konfigurasi 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. Update Blade Layout
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Laravel 11</title>
@vite(['resources/css/app.css', 'resources/js/app.js'])
</head>
<body>
@yield('content')
</body>
</html>
3.4. Jalankan Vite
npm run dev # hot‑reload selama development
npm run build # produksi
4. Menambahkan Laravel Breeze (Starter Kit)
4.1. Instalasi Breeze dengan Inertia & Vue (opsional)
composer require laravel/breeze --dev
php artisan breeze:install vue
npm install && npm run dev
4.2. Migrasi Database
php artisan migrate
4.3. Verifikasi UI
Bukahttp://localhost:8000, registrasi & login menggunakan UI Breeze.
5. Menyiapkan Laravel Sanctum untuk API Authentication
5.1. Instalasi Sanctum
composer require laravel/sanctum
php artisan vendor:publish --provider="Laravel\Sanctum\SanctumServiceProvider"
php artisan migrate
5.2. Tambahkan Middleware ke kernel
// app/Http/Kernel.php
protected $middlewareGroups = [
'api' => [
\Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
'throttle:api',
\Illuminate\Routing\Middleware\SubstituteBindings::class,
],
];
5.3. Membuat Route API yang Dilindungi
// routes/api.php
use AppHttpControllersApiUserController;
Route::middleware('auth:sanctum')->get('/user', [UserController::class, 'profile']);
5.4. Contoh Controller
namespace App\Http\Controllers\Api;
use App\Http\Controllers\Controller;
use Illuminate\Http\Request;
class UserController extends Controller
{
public function profile(Request $request)
{
return response()->json($request->user());
}
}
5.5. Menggunakan Token Personal (SPA)
// Di front‑end Vue (resources/js/app.js)
import axios from 'axios';
axios.post('/login', {email, password})
.then(res => {
axios.defaults.headers.common['Authorization'] = `Bearer ${res.data.token}`;
return axios.get('/api/user');
})
.then(res => console.log(res.data));
6. Best Practice untuk Produksi
- Environment Variables: Simpan
APP_KEY,DB_*, danSANCTUM_STATEFUL_DOMAINSdi.envdan jangan commit. - Cache Config & Routes:
php artisan config:cache && php artisan route:cache - Optimasi Autoloader:
composer install --optimize-autoloader --no-dev - HTTPS Only Cookies: Set
SESSION_SECURE_COOKIE=truepada production. - Queue & Jobs: Gunakan Laravel Horizon (Redis) untuk job processing.
- Static Asset Versioning: Vite sudah menambahkan hash pada file build, pastikan
APP_ENV=productionuntuk mengaktifkan.
7. Deploy ke Server (contoh Ubuntu 22.04)
git clone https://github.com/username/my-project.git
cd my-project
composer install --no-dev --optimize-autoloader
cp .env.example .env
php artisan key:generate
php artisan migrate --force
npm ci && npm run build
php artisan config:cache
php artisan route:cache
sudo systemctl restart php8.2-fpm nginx
Dengan mengikuti langkah‑langkah di atas, Anda memperoleh proyek Laravel 11 modern yang didukung Vite untuk asset bundling, Breeze sebagai starter UI, serta Sanctum untuk autentikasi API yang aman. Implementasi best practice memastikan aplikasi siap skalabilitas, keamanan, dan performa tinggi di lingkungan produksi tahun 2026.
Tutorial lengkap setup Laravel 11 di 2026 dengan Vite, Breeze, dan Sanctum. Ikuti panduan step‑by‑step, contoh kode, dan best practice modern untuk proyek PHP Framework profesional.
Laravel,PHP Framework,Web Development
#Laravel #LaravelIndonesia #PHP #WebDev #Backend
.png)
Tidak ada komentar:
Posting Komentar