News

Loading...

Community Links

Laravel Jobs

Latest News

Loading...

Latest Partners

Loading...

Partners

Loading...

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


Ikuti tutorial step‑by‑step ini untuk menginstal Laravel 11 terbaru, mengonfigurasi Vite, Breeze, Sanctum, serta Tailwind CSS sehingga proyek siap production dengan arsitektur modern.

1. Persyaratan Sistem

Pastikan server Anda memiliki:

  • PHP >= 8.3
  • Composer 2.x
  • Node.js >= 20 (LTS) dan npm
  • Database MySQL 8.x atau PostgreSQL 15

2. Instalasi Laravel 11

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

Perintah di atas meng‑clone Laravel 11 ke folder blog.

3. Mengatur Vite (Frontend Build Tool)

Laravel 11 sudah menyertakan Vite secara default, cukup instal dependensi npm:

npm install
npm run dev

Periksa vite.config.js untuk memastikan laravel/vite-plugin terdaftar.

4. Menambahkan Breeze dengan Inertia & React (opsional)

Breeze menyediakan scaffolding otentikasi ringan. Pilih stack yang Anda inginkan, misalnya React + Inertia:

composer require laravel/breeze --dev
php artisan breeze:install react

Setelah instalasi, jalankan kembali Vite:

npm run dev

Jika lebih suka Blade, jalankan php artisan breeze:install blade.

5. Mengonfigurasi Tailwind CSS

Breeze sudah men‑setup Tailwind, tapi pastikan file tailwind.config.js berisi:

module.exports = {
  content: [
    './resources/**/*.blade.php',
    './resources/**/*.js',
    './resources/**/*.vue',
    './resources/**/*.tsx',
  ],
  theme: { extend: {} },
  plugins: [],
}

Jalankan npm run build untuk menghasilkan file CSS produksi.

6. Instalasi Laravel Sanctum untuk API Token & SPA Authentication

composer require laravel/sanctum
php artisan vendor:publish --provider="Laravel\Sanctum\SanctumServiceProvider"
php artisan migrate

Tambahkan middleware EnsureFrontendRequestsAreStateful::class ke api group di app/Http/Kernel.php jika Anda menggunakan SPA:

\Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,

Setelah itu, di config/sanctum.php pastikan stateful berisi domain front‑end Anda, misalnya ['localhost', '127.0.0.1'].

7. Membuat Route & Controller Otentikasi dengan Sanctum

// routes/api.php
use App\Http\Controllers\AuthController;
Route::post('/login', [AuthController::class, 'login']);
Route::post('/logout', [AuthController::class, 'logout'])->middleware('auth:sanctum');
// app/Http/Controllers/AuthController.php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Hash;
use App\Models\User;
use Laravel\Sanctum\PersonalAccessToken;

class AuthController extends Controller {
    public function login(Request $request) {
        $request->validate([
            'email' => 'required|email',
            'password' => 'required'
        ]);
        $user = User::where('email', $request->email)->first();
        if (! $user || ! Hash::check($request->password, $user->password)) {
            return response()->json(['message' => 'Invalid credentials'], 401);
        }
        $token = $user->createToken('api-token')->plainTextToken;
        return response()->json(['token' => $token]);
    }

    public function logout(Request $request) {
        $request->user()->currentAccessToken()->delete();
        return response()->json(['message' => 'Logged out']);
    }
}

Endpoint ini siap dipanggil dari aplikasi React/Next.js atau Vue.

8. Best Practice Production Ready

  • Environment Variables: Simpan semua rahasia di .env dan gunakan config:cache.
  • Cache Config & Routes: php artisan config:cache & php artisan route:cache.
  • Optimized Autoloader: composer install --optimize-autoloader --no-dev.
  • HTTPS & CSP: Aktifkan SecureHeaders pakai package spatie/laravel-csp.
  • Queue & Jobs: Gunakan Redis driver untuk queue, jalankan php artisan queue:work --daemon.
  • Logging: Konfigurasi stack dengan channel stderr untuk container‑based deployment.

9. Deploy ke Laravel Vapor (Serverless) – Opsional

Jika Anda ingin serverless, instal Vapor CLI:

composer require laravel/vapor-cli --dev
vapor login
vapor init

Ikuti wizard, pilih region, dan deploy dengan vapor deploy production.

10. Verifikasi Instalasi

php artisan serve
# Buka http://127.0.0.1:8000 di browser
# Pastikan tampilan Breeze muncul dan API token dapat di‑generate via Postman.

Jika semua langkah berhasil, proyek Laravel 11 Anda sudah siap untuk pengembangan modern dan produksi.


Dengan mengikuti langkah‑langkah di atas, Anda telah menyiapkan proyek Laravel 11 yang mengadopsi praktik terbaik terkini: Vite untuk asset bundling, Breeze untuk scaffolding otentikasi, Tailwind CSS untuk UI responsif, dan Sanctum untuk keamanan API. Setup ini memberikan pondasi yang kuat, scalable, dan siap untuk deployment ke environment modern seperti Docker atau Laravel Vapor.
Tutorial step‑by‑step setup Laravel 11 terbaru dengan Vite, Breeze, Sanctum, Tailwind dan best practice produksi untuk developer PHP di 2026.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend

Tidak ada komentar:

Posting Komentar

Most Read

Loading...

Tutorial

Loading...

Packages

Loading...