Panduan step‑by‑step menginstal Laravel 11 terbaru dan mengkonfigurasi stack modern termasuk Vite, Breeze, Sanctum, serta TailwindCSS untuk pengembangan aplikasi web yang cepat dan aman.
1. Prasyarat
- PHP >= 8.2
- Composer terbaru
- Node.js >= 20 & npm
- Database MySQL/PostgreSQL
2. Instalasi Laravel 11
composer create-project laravel/laravel my-app "11.*"Masuk ke folder proyek:
cd my-app3. Setup Front‑End dengan Vite & TailwindCSS
Laravel 11 sudah menyertakan Vite. Install dependensi front‑end:
npm install
npm install -D tailwindcss@latest postcss@latest autoprefixer@latest
npx tailwindcss init -pConfigure tailwind.config.js:
module.exports = {
content: [
'./resources/**/*.blade.php',
'./resources/**/*.js',
'./resources/**/*.vue',
],
theme: {
extend: {},
},
plugins: [],
};Update resources/css/app.css:
@tailwind base;
@tailwind components;
@tailwind utilities;Jalankan dev server:
npm run dev4. Instalasi Laravel Breeze (starter kit)
composer require laravel/breeze --dev
php artisan breeze:install vuePerintah di atas men‑setup autentikasi berbasis Vue 3 + Vite. Jika ingin React, gunakan react.
npm install && npm run dev5. Menambahkan Laravel Sanctum untuk API Token
composer require laravel/sanctumPublikasi konfigurasi & migrasi:
php artisan vendor:publish --provider="Laravel\Sanctum\SanctumServiceProvider"
php artisan migrateTambahkan middleware EnsureFrontendRequestsAreStateful::class ke grup api di app/Http/Kernel.php:
'api' => [
\Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
'throttle:api',
\Illuminate\Routing\Middleware\SubstituteBindings::class,
],Gunakan trait HasApiTokens pada model User:
use Laravel\Sanctum\HasApiTokens;
class User extends Authenticatable
{
use HasApiTokens, HasFactory, Notifiable;
}
Contoh endpoint login API
Route::post('/api/login', function (Request $request) {
$request->validate([
'email' => 'required|email',
'password' => 'required',
]);
if (! Auth::attempt($request->only('email', 'password'))){
return response()->json(['message' => 'Invalid credentials'], 401);
}
$token = $request->user()->createToken('api-token')->plainTextToken;
return response()->json(['token' => $token]);
});
6. Konfigurasi Environment
Pastikan variabel berikut ada di .env:
APP_NAME="Laravel"
APP_ENV=local
APP_KEY=base64:YOUR_APP_KEY
APP_DEBUG=true
APP_URL=http://localhost
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=laravel
DB_USERNAME=root
DB_PASSWORD=
SANCTUM_STATEFUL_DOMAINS=localhost,127.0.0.1
SESSION_DOMAIN=localhost
COOKIE_DOMAIN=localhost
7. Menjalankan Aplikasi
php artisan serve
# di terminal terpisah
npm run devAkses http://localhost:8000 untuk melihat UI Breeze, dan gunakan /api/* untuk endpoint Sanctum.
8. Best Practice Modern
- Version Control: Commit
composer.lockdanpackage-lock.jsonuntuk reproducible builds. - Environment Segregation: Simpan rahasia di
.envdan gunakan.env.exampleuntuk tim. - Static Analysis: Tambahkan
phpstanataupsalmke pipeline CI. - Testing: Buat feature test untuk autentikasi API dengan
Sanctum.php artisan test --filter=LoginTest - Cache & Queue: Konfigurasikan Redis sebagai driver cache dan queue di
.envuntuk produksi.
Dengan mengikuti langkah‑langkah di atas, Anda memiliki proyek Laravel 11 yang siap pakai, menggunakan stack modern Vite, TailwindCSS, Breeze, dan Sanctum. Kombinasi ini memberi performa front‑end cepat, autentikasi yang aman, serta fondasi yang mudah di‑scale untuk aplikasi web masa depan.
Panduan lengkap setup Laravel 11 dengan Vite, Breeze, Sanctum, dan TailwindCSS. Langkah instalasi, konfigurasi, contoh kode, dan best practice modern untuk pengembangan PHP Framework terkini.
Laravel,PHP Framework,Web Development
#Laravel #LaravelIndonesia #PHP #WebDev #Backend
.png)
