Tutorial step‑by‑step ini menjelaskan cara menginstal Laravel versi terbaru, mengonfigurasi Vite, menambahkan authentication dengan Breeze, mengamankan API menggunakan Sanctum, serta mengoptimalkan pengembangan front‑end modern.
1. Prasyarat
Pastikan sistem Anda sudah terinstall:
- PHP 8.3 atau lebih tinggi
- Composer 2.x
- Node.js 20.x dan npm 10.x
- Database MySQL/MariaDB (atau SQLite untuk dev)
- Git
2. Instalasi Laravel 11
2.1 Buat proyek baru
Jalankan perintah berikut untuk membuat project Laravel dengan starter kit laravel/laravel:
composer create-project laravel/laravel laravel-app "^11.0"
2.2 Masuk ke direktori proyek
cd laravel-app
3. Konfigurasi Vite (Bundler Front‑end)
3.1 Install dependencies
npm install
3.2 Sesuaikan vite.config.js
Laravel 11 sudah menyertakan konfigurasi default, cukup pastikan plugin laravel-vite-plugin terinstall:
npm install --save-dev laravel-vite-plugin
3.3 Jalankan dev server
npm run dev
Vite akan menyalakan localhost:5173 dan Laravel akan otomatis mendeteksi aset.
4. Menambahkan Authentication dengan Breeze
4.1 Install Breeze
composer require laravel/breeze --dev
4.2 Scaffold UI dengan Blade atau React/Vue
Pilih Blade (default):
php artisan breeze:install blade
Atau pilih React:
php artisan breeze:install react
4.3 Install front‑end dependencies & compile
npm install && npm run dev
4.4 Migrasi database
php artisan migrate
Anda kini memiliki rute auth lengkap: /login, /register, dll.
5. Mengamankan API dengan Laravel Sanctum
5.1 Install Sanctum
composer require laravel/sanctum
5.2 Publish konfigurasi & migrasi
php artisan vendor:publish --provider="Laravel\Sanctum\SanctumServiceProvider"
php artisan migrate
5.3 Konfigurasi middleware
Tambahkan EnsureFrontendRequestsAreStateful::class ke api middleware group di app/Http/Kernel.php:
'api' => [
\Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
'throttle:api',
\Illuminate\Routing\Middleware\SubstituteBindings::class,
],
5.4 Buat route API contoh
Route::middleware('auth:sanctum')->get('/user/profile', function (Request $request) {
return $request->user();
});
5.5 Front‑end request dengan Axios (React/Vue)
axios.get('/api/user/profile', { withCredentials: true })
.then(response => console.log(response.data));
6. Optimasi & Best Practice
- Environment variables: Simpan kunci sensitif di
.envdan gunakanconfig:cachepada production. - Cache config & routes:
php artisan config:cache&php artisan route:cache. - Queue & Jobs: Gunakan
redisdriver untuk queue ketika aplikasi scaling. - Testing: Laravel 11 mendukung Pest & PHPUnit. Tambahkan contoh test dengan
php artisan test. - Docker: Buat container dengan Laravel Sail (
./vendor/bin/sail up -d) untuk environment konsisten. - Linting & Formatting: Pasang
Laravel Pint(composer require laravel/pint --dev) untuk standar coding.
7. Deploy ke Production
- Build assets:
npm run build - Set
APP_ENV=productiondanAPP_DEBUG=falsedi.env - Jalankan
php artisan migrate --force - Cache konfigurasi & route
- Gunakan web server yang direkomendasikan: Nginx + PHP-FPM
Setelah semua langkah selesai, aplikasi Laravel 11 Anda siap melayani trafik dengan arsitektur modern.
Dengan mengikuti tutorial ini Anda telah menyiapkan Laravel 11 secara lengkap—mulai dari instalasi, Vite, autentikasi Breeze, hingga API aman dengan Sanctum. Mengadopsi best practice seperti cache, queue, dan Docker akan memastikan proyek Anda skalabel, maintainable, dan siap produksi dalam ekosistem Laravel modern.
Tutorial step‑by‑step setup Laravel 11 dengan Vite, Breeze, Sanctum, dan best practice modern untuk pengembangan web cepat dan aman.
Laravel,PHP Framework,Web Development
#Laravel #LaravelIndonesia #PHP #WebDev #Backend
Tidak ada komentar:
Posting Komentar