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)


Temukan langkah‑langkah detail untuk menginstal Laravel 11 terbaru, mengkonfigurasi Vite, Breeze, Sanctum, serta mengoptimalkan proyek Anda dengan best practice terkini di tahun 2026.

1. Prasyarat

  • PHP ^8.2, ekstensi openssl, pdo, mbstring, tokenizer, xml
  • Composer 2.7 atau lebih baru
  • Node.js 20+ dan npm 10+
  • Database MySQL 8+ atau PostgreSQL 15+

2. Instalasi Laravel 11

composer create-project laravel/laravel project-name "11.*"

Masuk ke direktori proyek:

cd project-name

3. Setup Frontend dengan Vite & TailwindCSS

Laravel 11 sudah menyertakan Vite secara default. Install dependensi UI:

npm install && npm install -D tailwindcss@latest postcss@latest autoprefixer@latest

Inisialisasi Tailwind:

npx tailwindcss init -p

Ubah tailwind.config.js:

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

Tambahkan direktif Tailwind ke resources/css/app.css:

@tailwind base;
@tailwind components;
@tailwind utilities;

Jalankan Vite dalam mode development:

npm run dev

4. Instalasi Laravel Breeze (Starter Kit)

Breeze memberikan autentikasi sederhana dengan Blade atau Inertia. Untuk proyek Blade:

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

Jika menginginkan Inertia + Vue 3:

php artisan breeze:install vue

Setelah instalasi, jalankan migrasi dan compile asset:

php artisan migrate
npm run dev

5. Menambahkan Laravel Sanctum (API Token & SPA Authentication)

composer require laravel/sanctum

Publikasikan konfigurasi dan migrasi:

php artisan vendor:publish --provider="Laravel\Sanctum\SanctumServiceProvider"
php artisan migrate

Aktifkan middleware EnsureFrontendRequestsAreStateful pada app/Http/Kernel.php untuk SPA:

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

Tambahkan trait HasApiTokens pada model User:

use Laravel\Sanctum\HasApiTokens;

class User extends Authenticatable {
    use HasApiTokens, Notifiable;
}

6. Contoh Implementasi API Terproteksi

Route

use App\Http\Controllers\API\PostController;

Route::middleware('auth:sanctum')->group(function () {
    Route::apiResource('posts', PostController::class);
});

Controller

namespace App\Http\Controllers\API;

use App\Models\Post;
use Illuminate\Http\Request;
use App\Http\Controllers\Controller;

class PostController extends Controller {
    public function index(){
        return Post::where('user_id', auth()->id())->get();
    }
    public function store(Request $request){
        $data = $request->validate([
            'title' => 'required|string|max:255',
            'body'  => 'required|string',
        ]);
        $data['user_id'] = auth()->id();
        return Post::create($data);
    }
    // show, update, destroy …
}

Frontend (Vue 3) – Login & Token

import axios from 'axios';

export default {
  data(){ return {email:'', password:''}; },
  methods:{
    async login(){
      const {data} = await axios.post('/login', this.$data);
      axios.defaults.headers.common['X-XSRF-TOKEN'] = data.csrf_token; // Laravel sets cookie
      // Sanctum otomatis mengatur session cookie
    }
  }
}

7. Best Practice Modern

  • Environment Files: Simpan kunci API, DB credentials, dan APP_URL di .env dan gunakan config:cache.
  • Configuration Caching: php artisan config:cache untuk produksi.
  • Route Caching: php artisan route:cache (jangan cache jika menggunakan closures).
  • Queued Jobs & Events: Gunakan dispatch untuk proses berat, contoh email verifikasi.
  • Testing: PHPUnit & Pest untuk unit & feature test; contoh: php artisan test.
  • Docker: Siapkan container official PHP, MySQL, dan Nginx; gunakan docker compose up -d dalam tim.
  • Static Analysis: Integrasikan PHPStan (level max) & Laravel Pint untuk coding standard.

8. Deploy ke Production

# Pada server
composer install --optimize-autoloader --no-dev
npm ci && npm run build
php artisan migrate --force
php artisan config:cache
php artisan route:cache
php artisan view:cache

Pastikan storage dan bootstrap/cache memiliki izin write.


Dengan mengikuti langkah‑step di atas, Anda akan memiliki proyek Laravel 11 yang terstruktur, aman, dan siap bersaing di 2026. Kombinasi Vite, Breeze, dan Sanctum memberikan fondasi modern untuk aplikasi web tradisional maupun SPA, sementara best practice seperti caching, testing, dan Docker memastikan kualitas dan kecepatan produksi.
Tutorial lengkap setup Laravel 11 terbaru dengan Vite, Breeze, Sanctum, TailwindCSS, dan best practice modern untuk pengembangan web 2026.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend

Tidak ada komentar:

Posting Komentar

Most Read

Loading...

Tutorial

Loading...

Packages

Loading...