Laravel Indonesia: tutorials

Tampilkan postingan dengan label tutorials. Tampilkan semua postingan

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

Tutorial step‑by‑step untuk menginstal Laravel 11 terbaru, mengkonfigurasi Vite, Breeze, Sanctum, serta memperkenalkan best practice yang cocok untuk proyek 2026.

1. Prasyarat Sistem

PHP >= 8.3
Composer 2.x
Node.js >= 20 dan npm/yarn
Database MySQL/PostgreSQL (opsional untuk tutorial)

2. Instalasi Laravel 11

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

Perintah di atas mengunduh versi stabil terbaru (Laravel 11) dan menyiapkan struktur dasar.

3. Mengatur Vite (Asset Bundler Modern)

Masuk ke folder proyek: cd my-project
Instal dependensi frontend: npm install
Jika ingin menggunakan Vue 3 atau React, jalankan salah satu:
- Vue 3: npm install vue@next @vitejs/plugin-vue
- React: npm install react react-dom @vitejs/plugin-react

Update vite.config.js bila diperlukan, contoh untuk Vue:

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import vue from '@vitejs/plugin-vue';

export default defineConfig({
    plugins: [laravel(['resources/js/app.js']), vue()],
});

Jalankan dev server: npm run dev

4. Instalasi Breeze (Auth Starter Kit)

Pastikan Composer ter‑update.
Jalankan perintah: composer require laravel/breeze --dev
Generate scaffold dengan Vite: php artisan breeze:install vue (pilih react atau blade sesuai kebutuhan).
Instalasi npm dan compile aset: npm install && npm run dev
Migrasi tabel user: php artisan migrate

Penjelasan

Breeze memberikan route, controller, view, dan API auth yang ringan, cocok untuk proyek modern dan mudah dikustomisasi.

5. Menambahkan Laravel Sanctum (SPA & Mobile Token Auth)

Instal package: composer require laravel/sanctum
Publish konfigurasi & migrasi: php artisan vendor:publish --provider="Laravel\Sanctum\SanctumServiceProvider"
Jalankan migrasi: php artisan migrate
Tambahkan middleware EnsureFrontendRequestsAreStateful::class ke api middleware group pada app/Http/Kernel.php.
```
\Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
```

Gunakan token pada API:

// Generating token
$token = $user->createToken('spa-token')->plainTextToken;

// Protect route
Route::middleware('auth:sanctum')->get('/user', function (Request $request) {
    return $request->user();
});

6. Best Practice Modern (2026)

Environment Variables: Simpan rahasia di .env dan gunakan config:cache pada produksi.
Database: Gunakan laravel migrations + model factories + seeder untuk CI/CD.
```
php artisan migrate --seed
```
Testing: PHPUnit + Pest untuk unit & feature test; gunakan php artisan test --parallel.
Code Style: Laravel Pint (PHP CS Fixer) – composer require laravel/pint --dev dan jalankan vendor/bin/pint.
Docker: Deploy dengan container resmi Laravel (php8.3-fpm + nginx) dan docker compose.
Cache & Queue: Konfigurasi Redis di .env dan gunakan php artisan queue:work untuk job background.

7. Deploy ke Production (Contoh di Laravel Forge)

Push repo ke GitHub.
Buat site baru di Forge, pilih server Ubuntu 22.04.
Set environment variables, enable queue:work dan scheduler.
Run php artisan migrate --force dan npm run build pada server.
Aktifkan SSL otomatis via Let's Encrypt.

8. Verifikasi Semua

Buka http://your-domain.test – pastikan UI Breeze muncul.
Login, periksa cookie laravel_session dan header Authorization: Bearer <token> untuk Sanctum.
Jalankan php artisan test – semua harus lulus.

Dengan mengikuti langkah‑langkah di atas, Anda dapat menyiapkan proyek Laravel 11 yang modern, aman, dan siap skalabilitas 2026. Kombinasi Vite, Breeze, dan Sanctum memberikan fondasi solid untuk aplikasi SPA, mobile, atau monolith tradisional, sementara best practice seperti Docker, testing paralel, dan Laravel Pint memastikan kode tetap bersih dan maintainable.

Tutorial lengkap setup Laravel 11 dengan Vite, Breeze, Sanctum, dan best practice modern untuk pengembangan web 2026. Ikuti langkah demi langkah instalasi, konfigurasi, dan contoh kode.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend

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

Pelajari cara menginstal Laravel 11, mengoptimalkan frontend dengan Vite, menyiapkan autentikasi cepat menggunakan Breeze, serta mengamankan API dengan Sanctum dalam satu tutorial step‑by‑step yang up‑to‑date tahun 2026.

1. Persiapan Lingkungan

1.1. Persyaratan Sistem

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

1.2. Instalasi Composer & Node

curl -sS https://getcomposer.org/installer | php
npm install -g npm@latest

2. Membuat Proyek Laravel 11

2.1. Membuat Project Baru

composer create-project laravel/laravel:^11.0 my-laravel-app

2.2. Masuk ke Direktori

cd my-laravel-app

3. Setup Frontend Modern dengan Vite

3.1. Instalasi Dependensi

npm install

3.2. Struktur Direktori

Laravel 11 menyertakan vite.config.js secara default. Pastikan folder resources/js dan resources/css ada.

3.3. Menjalankan Development Server

npm run dev

Vite akan mem‑serve aset di http://localhost:5173 dan otomatis hot‑reload.

4. Instalasi Laravel Breeze (Starter Kit)

4.1. Tambahkan Package Breeze

composer require laravel/breeze --dev

4.2. Publish & Install

php artisan breeze:install vue

Anda dapat mengganti vue dengan react atau blade sesuai kebutuhan.

4.3. Compile Asset

npm run dev

4.4. Migrasi Database

php artisan migrate

Ini akan membuat tabel users, password_resets, dll.

5. Menambahkan Sanctum untuk API Authentication

5.1. Instalasi Package Sanctum

composer require laravel/sanctum

5.2. Publish Config & Migration

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. Membuat Route API Contoh

Route::middleware('auth:sanctum')->get('/user', function (Request $request) {
    return $request->user();
});

5.5. Menggunakan Token Personal

$token = $user->createToken('mobile-app')->plainTextToken;

Simpan token di client dan kirim header Authorization: Bearer <token> pada setiap request.

6. Best Practice Modern

Environment Files: Simpan semua credential di .env dan gunakan php artisan config:cache pada production.
Cache Config & Routes: php artisan route:cache dan php artisan view:cache untuk performa.
Database Seeds & Factories: Gunakan Laravel 11 factories berbasis class untuk data dummy.
Static Analysis: Tambahkan phpstan dan larastan untuk type‑checking.
Docker Development: Buat docker-compose.yml dengan service php, mysql, redis, dan node untuk environment yang konsisten.

7. Deploy ke Production

Build assets: npm run build
Set APP_ENV=production dan APP_DEBUG=false di .env
Run migration: php artisan migrate --force
Cache konfigurasi: php artisan config:cache
Cache routes & views: php artisan route:cache && php artisan view:cache
Restart queue workers jika ada: php artisan queue:restart

Dengan mengikuti langkah‑langkah di atas, Anda akan memiliki aplikasi Laravel 11 yang modern, cepat, dan aman—menggunakan Vite untuk asset bundling, Breeze untuk scaffolding UI, serta Sanctum untuk proteksi API. Terapkan best practice seperti caching, static analysis, dan Docker untuk memastikan proyek dapat skalabilitas tinggi dan mudah dipelihara di tahun 2026.

Panduan lengkap instalasi Laravel 11 terbaru dengan Vite, Breeze, dan Sanctum. Langkah‑by‑step setup modern, konfigurasi, contoh kode, dan best practice untuk 2026.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend

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

Pelajari cara menginstal dan mengkonfigurasi Laravel 11 terbaru menggunakan stack modern: Vite untuk asset bundling, Breeze untuk starter kit, Sanctum untuk API authentication, serta testing dengan PestPHP.

1. Prasyarat

PHP >= 8.2
Composer 2.x
Node.js >= 20 & npm
Database MySQL / PostgreSQL

2. Instalasi Laravel 11

composer create-project laravel/laravel contoh-app "11.*" --prefer-dist
cd contoh-app

Perintah di atas mengunduh Laravel 11 yang sudah mengaktifkan Vite secara default.

3. Mengatur Vite

Pastikan vite.config.js berisi plugin Laravel Vite.
Jalankan:

npm install && npm run dev

Anda sekarang dapat menulis SASS/JS di resources/js dan resources/css. Vite akan melakukan hot‑module‑replacement.

4. Install Laravel Breeze (Blade atau Inertia)

Pilih stack yang diinginkan. Contoh dengan Blade:

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

Jika memakai Inertia + Vue 3:

php artisan breeze:install vue
npm run dev

5. Menambahkan Laravel Sanctum untuk API Authentication

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

Konfigurasi config/sanctum.php untuk SPA:

'stateful' => explode(",", env('SANCTUM_STATEFUL_DOMAINS', 'localhost,127.0.0.1')),

Tambahkan middleware EnsureFrontendRequestsAreStateful::class pada api guard di config/auth.php:

'sanctum' => [
    'driver' => 'sanctum',
    'provider' => null,
    'hash' => false,
],

Contoh Route API

Route::middleware('auth:sanctum')->get('/user', function (Request $request) {
    return $request->user();
});

6. Setup Testing dengan PestPHP (Opsional)

composer require pestphp/pest --dev
php artisan pest:install

Contoh test:

it('can register a user', function () {
    $response = $this->post('/register', [
        'name' => 'Budi',
        'email' => '[email protected]',
        'password' => 'secret123',
        'password_confirmation' => 'secret123',
    ]);
    $response->assertRedirect('/home');
    $this->assertAuthenticated();
});

7. Best Practice Modern

Environment Variables: Simpan rahasia di .env dan jangan pernah commit.
Cache Config & Routes: Pada production jalankan php artisan config:cache && php artisan route:cache.
Queue & Jobs: Gunakan driver redis untuk queue yang cepat.
Code Style: Terapkan PHP-CS-Fixer atau Pint (composer require laravel/pint --dev).
Security: Aktifkan APP_DEBUG=false, gunakan HTTPS, dan set SESSION_SECURE_COOKIE=true.

8. Deployment (Contoh dengan Docker)

Berikut Dockerfile minimal untuk Laravel 11:

FROM php:8.2-fpm-alpine
WORKDIR /var/www/html
RUN apk add --no-cache nginx supervisor git zip unzip
RUN docker-php-ext-install pdo pdo_mysql
COPY . .
RUN composer install --optimize-autoloader --no-dev
RUN php artisan storage:link && php artisan migrate --force
EXPOSE 80
CMD ["php-fpm"]

Bangun image, push ke registry, dan jalankan dengan docker‑compose yang menyertakan redis dan mysql.
Dengan mengikuti langkah‑langkah di atas Anda telah menyiapkan proyek Laravel 11 yang menggunakan Vite, Breeze, Sanctum, dan testing modern. Struktur ini mencerminkan best practice 2026, memudahkan pengembangan cepat, keamanan yang kuat, serta skalabilitas untuk produksi.

Tutorial langkah demi langkah setup Laravel 11 terbaru dengan Vite, Breeze, Sanctum, dan testing modern. Panduan lengkap untuk developer PHP Framework di 2026.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend

Setup Laravel 11 dengan Best Practice Modern: Vite, Breeze, Sanctum, dan Livewire

Panduan lengkap langkah demi langkah untuk menginstal Laravel 11 terbaru, mengkonfigurasi Vite, Breeze, Sanctum, serta menambahkan Livewire untuk pengembangan aplikasi full‑stack modern.

1. Prasyarat

Pastikan sistem Anda memiliki:

PHP >= 8.2
Composer terbaru
Node.js >= 20 & npm/yarn
Database (MySQL, PostgreSQL, atau SQLite)

2. Instalasi Laravel 11

composer create-project laravel/laravel blog "11.*" --prefer-dist
cd blog

Perintah di atas membuat project blog dengan Laravel 11 stabil.

3. Setup Vite (Asset Bundler bawaan)

Laravel 11 sudah menyertakan Vite secara default. Pastikan vite.config.ts ada dan jalankan:

npm install
npm run dev

Anda dapat menyesuaikan resources/css/app.css dan resources/js/app.js sesuai kebutuhan.

4. Instalasi Laravel Breeze (Starter Kit)

composer require laravel/breeze --dev
php artisan breeze:install vue
npm install && npm run dev

Breeze menyediakan scaffolding autentikasi dengan Vue 3 + Vite. Jika ingin Blade, gunakan php artisan breeze:install tanpa parameter.

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

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

Tambahkan 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 auth:sanctum pada route API yang memerlukan proteksi.

6. Menambahkan Livewire (Komponen Interaktif)

composer require livewire/livewire
php artisan livewire:publish --assets

Livewire bekerja bersamaan dengan Blade. Contoh komponen:

php artisan make:livewire Counter

File app/Http/Livewire/Counter.php:

namespace App\Http\Livewire;
use Livewire\Component;
class Counter extends Component {
    public $count = 0;
    public function increment() { $this->count++; }
    public function render() { return view('livewire.counter'); }
}

View resources/views/livewire/counter.blade.php:

<div>
    <button wire:click="increment">Tambah</button>
    <span>{{ $count }}</span>
</div>

Masukkan @livewire('counter') pada halaman Blade mana pun.

7. Environment & Konfigurasi Keamanan

Set APP_ENV=production dan APP_DEBUG=false pada produksi.
Generate key: php artisan key:generate
Konfigurasi config/session.php untuk same_site dan secure ketika menggunakan HTTPS.
Gunakan rate limiting pada route login: Route::post('/login', [AuthController::class, 'login'])->middleware('throttle:5,1');

8. Testing & Deployment

# Unit & Feature Test
php artisan test

# Optimasi produksi
php artisan optimize:clear
php artisan config:cache
php artisan route:cache
php artisan view:cache

# Build assets untuk prod
npm run build

Deploy ke server dengan PHP-FPM & Nginx, pastikan public/.htaccess (Apache) atau konfigurasi Nginx mengarah ke public directory.

9. Best Practice Tambahan

Gunakan phpstan atau psalm untuk static analysis.
Integrasikan CI/CD (GitHub Actions) untuk lint, test, dan deploy otomatis.
Simpan environment variables di .env.example dan gunakan dotenv manager.
Gunakan queue driver (Redis) untuk email, jobs, dan event broadcasting.
Aktifkan log:clear dan rotasi log via logrotate.

Dengan mengikuti langkah‑step di atas, Anda akan memiliki aplikasi Laravel 11 yang modern, aman, dan siap untuk skala produksi. Kombinasi Vite, Breeze, Sanctum, dan Livewire memberikan fondasi front‑end reaktif sekaligus API yang kuat, sementara best practice tambahan memastikan kode tetap bersih dan dapat dipelihara.

Panduan setup Laravel 11 terbaru dengan Vite, Breeze, Sanctum, dan Livewire. Langkah demi langkah, konfigurasi, contoh kode, dan best practice modern untuk pengembangan web PHP.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend

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

Tutorial step‑by‑step untuk menginstal Laravel 11, mengkonfigurasi Vite, Breeze, Sanctum, serta rekomendasi best practice agar aplikasi siap produksi pada tahun 2026.

1. Prasyarat

a. PHP & Composer

Pastikan PHP >= 8.2 dan Composer terbaru terpasang:

php -v
composer -V

b. Node.js & npm/Yarn

Install Node.js 20.x atau lebih baru:

node -v
npm -v

2. Instalasi Laravel 11

a. Buat proyek baru

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

b. Masuk ke direktori

cd blog

3. Konfigurasi Vite (frontend bundler default Laravel 11)

a. Install dependencies

npm install

b. Sesuaikan `vite.config.ts`

Tambahkan alias dan enable React/Vue bila diperlukan:

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
    plugins: [laravel(['resources/css/app.css', 'resources/js/app.js'])],
    resolve: {
        alias: {
            '@': '/resources/js',
        },
    },
});

c. Build & watch

npm run dev   // untuk development
npm run build // untuk production

4. Instalasi Laravel Breeze (authentication starter)

a. Tambahkan package

composer require laravel/breeze --dev

b. Install scaffold

php artisan breeze:install vue

Gunakan blade, react, atau vue sesuai kebutuhan.

c. Compile assets

npm install && npm run dev

5. Setup Laravel Sanctum (API token & SPA authentication)

a. Install package

composer require laravel/sanctum

b. Publish konfigurasi & migrasi

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

c. Tambahkan middleware

Di app/Http/Kernel.php tambahkan pada api stack:

'api' => [
    \Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
    'throttle:api',
    \Illuminate\Routing\Middleware\SubstituteBindings::class,
],

d. Contoh route API

use App\Http\Controllers\API\UserController;
Route::middleware('auth:sanctum')->get('/user', [UserController::class, 'profile']);

6. .env & konfigurasi production

a. Cache konfigurasi & route

php artisan config:cache
php artisan route:cache
php artisan view:cache

b. Optimasi autoloader

composer install --optimize-autoloader --no-dev

c. Set APP_ENV=production dan APP_DEBUG=false

APP_ENV=production
APP_DEBUG=false

7. Best Practice Modern (2026)

Gunakan PHPStan atau Psalm untuk static analysis.
Set up Laravel Pint sebagai kode formatter.
Dockerize dengan multi‑stage build untuk PHP & Node.
Gunakan Horizon jika memakai queues.
Aktifkan rate limiting pada API dengan ThrottleRequests.
Audit security secara rutin menggunakan laravel/security-checker.

Dengan mengikuti langkah‑langkah di atas, Anda kini memiliki proyek Laravel 11 yang di‑setup secara modern: Vite untuk asset bundling, Breeze untuk UI starter, Sanctum untuk API yang aman, serta best practice yang siap menghadapi beban produksi pada tahun 2026.

Tutorial step‑by‑step setup Laravel 11 dengan Vite, Breeze, Sanctum, dan best practice modern untuk pengembangan web 2026.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend

Setup Laravel 11 dengan Best Practice Modern: Vite, Breeze, Sanctum, dan Typescript

Panduan lengkap langkah demi langkah untuk menginstal Laravel 11 terbaru, mengkonfigurasi Vite, menambahkan Breeze (Livewire atau Inertia), serta mengamankan API dengan Sanctum pada tahun 2026.

1. Prasyarat

PHP >= 8.2
Composer 2.x
Node.js >= 20 dengan npm atau Yarn
Database MySQL/PostgreSQL

2. Instalasi Laravel 11

Step 1: Buat proyek baru

composer create-project laravel/laravel laravel11-app "^11.0"

Perintah ini mengunduh Laravel 11 stabil beserta dependensinya.

Step 2: Masuk ke folder proyek

cd laravel11-app

Dengan mengikuti tutorial ini, Anda memiliki fondasi Laravel 11 yang teroptimalkan: Vite untuk asset bundling, Breeze sebagai starter kit UI, serta Sanctum untuk otentikasi API yang aman. Selanjutnya Anda dapat menambahkan paket seperti Livewire atau Spatie sesuai kebutuhan proyek.

Tutorial step-by-step setup Laravel 11 terbaru dengan Vite, Breeze, dan Sanctum. Pelajari instalasi, konfigurasi, contoh kode, dan best practice modern untuk pengembangan web dengan Laravel, PHP Framework, dan Web Development di 2026.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend

Panduan Lengkap Setup Laravel 11 dengan Best Practice Modern: Vite, Breeze, Sanctum, dan TypeScript

Tutorial step‑by‑step ini memandu Anda menginstal Laravel 11 terbaru, mengonfigurasi Vite, menambahkan Breeze dengan TailwindCSS, mengamankan API dengan Sanctum, serta mengoptimalkan pengembangan menggunakan TypeScript.

1. Prerequisite

PHP >= 8.2
Composer 2.7+
Node.js 20+ dan npm 10+
Database (MySQL 8 atau PostgreSQL 15)

2. Instalasi Laravel 11

composer create-project laravel/laravel laravel-modern "^11.0"

Masuk ke folder proyek:

cd laravel-modern

2.1. Memastikan Environment

cp .env.example .env
php artisan key:generate

Sesuaikan .env dengan konfigurasi database Anda.

3. Setup Vite (alat bundler modern)

Laravel 11 sudah menyertakan Vite secara default, namun kita perlu menyesuaikan untuk TypeScript dan TailwindCSS.

3.1. Install dependencies

npm install -D vite laravel-vite-plugin@latest
npm install -D tailwindcss@latest postcss@latest autoprefixer@latest
npm install -D typescript@latest @vitejs/plugin-vue@latest

3.2. Inisialisasi Tailwind

npx tailwindcss init -p

Ubah tailwind.config.js:

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

3.3. Konfigurasi Vite

Edit 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/css/app.css', 'resources/js/app.ts'],
            refresh: true,
        }),
        vue(),
    ],
});

3.4. Mengubah entry point

Rename resources/js/app.js menjadi app.ts dan tambahkan contoh:

import './bootstrap';
import '../css/app.css';

console.log('Laravel 11 + Vite + TypeScript ready');

4. Instalasi Laravel Breeze dengan Tailwind & Vue 3

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

Perintah di atas akan menambahkan scaffolding autentikasi berbasis Vue, Tailwind, dan Vite.

4.1. Migrasi Database

php artisan migrate

4.2. Compile assets

npm run dev

Anda sekarang dapat mengakses /register dan /login dengan UI modern.

5. Mengamankan API dengan Laravel Sanctum

5.1. Instalasi Sanctum

composer require laravel/sanctum

5.2. Publish konfigurasi & migration

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

5.3. Middleware

Tambahkan middleware EnsureFrontendRequestsAreStateful::class pada grup api di app/Http/Kernel.php:

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

5.4. Contoh Route API yang dilindungi

use App\Http\Controllers\API\ProfileController;

Route::middleware('auth:sanctum')->get('/user/profile', [ProfileController::class, 'show']);

5.5. Frontend: Mengambil token

Setelah login via Breeze, cookie laravel_session dan XSRF-TOKEN otomatis dikelola. Untuk request Axios:

import axios from 'axios';
axios.defaults.withCredentials = true;
axios.get('/api/user/profile').then(r => console.log(r.data));

6. Best Practice Modern

Environment segregation: gunakan .env.testing untuk CI dan .env.production untuk produksi.
Static analysis: tambahkan phpstan dan psalm ke dalam pipeline CI.
Cache config & routes di production: php artisan config:cache && php artisan route:cache.
Queue & Jobs: gunakan driver redis dan konfigurasi supervisor untuk worker.
Version control: commit hanya file vite.config.js, package.json, dan resources yang berubah; jangan commit node_modules atau vendor.
Testing: gunakan PestPHP atau PHPUnit bersama Laravel Sanctum untuk menguji endpoint API.

7. Deploy ke Production (Laravel 11 + Vite)

# Build assets
npm run build

# Optimasi Laravel
php artisan config:cache
php artisan route:cache
php artisan view:cache

# Set proper permissions
chown -R www-data:www-data storage bootstrap/cache

Upload seluruh proyek kecuali node_modules dan vendor, kemudian jalankan composer install --optimize-autoloader --no-dev di server.

Dengan mengikuti langkah‑langkah di atas, Anda memiliki proyek Laravel 11 yang sepenuhnya modern: Vite untuk asset bundling, Breeze + Vue 3 untuk UI cepat, TailwindCSS untuk styling, serta Sanctum untuk proteksi API. Mengadopsi best practice seperti caching, static analysis, dan queueing memastikan aplikasi siap skala produksi dan mudah dipelihara.

Tutorial lengkap setup Laravel 11 terbaru dengan Vite, Breeze, Tailwind, TypeScript, dan Sanctum. Ikuti langkah demi langkah, konfigurasi, contoh kode, dan best practice modern.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend

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

Tutorial step-by-step ini mengajarkan cara menginstall Laravel 11 terbaru, mengintegrasikan Vite, Breeze, Sanctum, serta Livewire untuk membangun aplikasi web modern, aman, dan responsif di tahun 2026.

1. Persiapan Lingkungan

1.1. Persyaratan Sistem

PHP >= 8.3
Composer 2.x
Node.js >= 20 dengan npm atau Yarn
Database (MySQL 8+, PostgreSQL, atau SQLite)

1.2. Buat Project Laravel Baru

composer create-project laravel/laravel my-app "11.*"

Perintah ini menginstall Laravel 11 dengan semua dependensi default.

2. Instalasi Vite (Frontend Asset Bundler)

2.1. Hapus Laravel Mix

rm -rf webpack.mix.js resources/js/app.js resources/sass/app.scss

2.2. Instalasi Vite dan plugin Laravel

npm install --save-dev vite laravel-vite-plugin

2.3. Buat file konfigurasi vite.config.js

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
    plugins: [
        laravel({
            input: ['resources/css/app.css', 'resources/js/app.js'],
            refresh: true,
        }),
    ],
});

2.4. Tambahkan entry point

// resources/js/app.js
import './bootstrap';

// resources/css/app.css
@import "../node_modules/@tailwindcss/forms/dist/forms.css";

2.5. 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>{{ config('app.name') }}</title>
    @vite(['resources/css/app.css', 'resources/js/app.js'])
</head>
<body>
    @yield('content')
</body>
</html>

Vite kini menjadi bundler default, memberikan HMR cepat.

3. Instalasi Laravel Breeze (Starter Kit)

3.1. Pasang Breeze via Composer

composer require laravel/breeze --dev

3.2. Install scaffolding dengan Blade + Vite

php artisan breeze:install blade

3.3. Jalankan migrasi dan npm

php artisan migrate
npm install
npm run dev

Anda kini memiliki autentikasi dasar (register, login, reset password) yang terintegrasi dengan Vite.

4. Integrasi Laravel Sanctum (API Token & SPA Authentication)

4.1. Instal Sanctum

composer require laravel/sanctum

4.2. Publikasi konfigurasi & migrasi

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

4.3. Tambahkan middleware ke kernel

// app/Http/Kernel.php
'api' => [
    \Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
    'throttle:api',
    \Illuminate\Routing\Middleware\SubstituteBindings::class,
],

4.4. Buat route API contoh

// routes/api.php
use App\Http\Controllers\API\UserController;

Route::middleware('auth:sanctum')->get('/user', [UserController::class, 'show']);

Sanctum memungkinkan SPA yang dibangun dengan Blade atau Vue/React berkomunikasi aman via cookie.

5. Menambahkan Livewire (Komponen Interaktif)

5.1. Instal Livewire latest

composer require livewire/livewire
npm install --save-dev @livewire/vite-plugin

5.2. Update vite.config.js

import livewire from '@livewire/vite-plugin';

export default defineConfig({
    plugins: [
        laravel({
            input: ['resources/css/app.css', 'resources/js/app.js'],
            refresh: true,
        }),
        livewire(),
    ],
});

5.3. Buat komponen Livewire

php artisan make:livewire Counter

5.4. Implementasi contoh Counter

// app/Http/Livewire/Counter.php
namespace App\Http\Livewire;

use Livewire\Component;

class Counter extends Component
{
    public $count = 0;

    public function increment()
    {
        $this->count++;
    }

    public function render()
    {
        return view('livewire.counter');
    }
}

<!-- resources/views/livewire/counter.blade.php -->

    <h2>Count: {{ $count }}</h2>
    <button wire:click="increment" class="px-4 py-2 bg-blue-600 text-white rounded">Increment</button>
</div>

5.5. Gunakan di halaman Blade

<!-- resources/views/dashboard.blade.php -->
<x-app-layout>
    <x-slot name="header">
        {{ __('Dashboard') }}
    </x-slot>
    <livewire:counter />
</x-app-layout>

Livewire bekerja mulus dengan Vite dan Breeze.

6. Best Practice Modern (2026)

Environment Variables: Simpan kunci API, DB credentials, dan Sanctum secret di .env, never commit.
Typed Route Names: Gunakan Route::name('profile.show') dan route('profile.show') untuk menghindari hard‑code URL.
PHPStan & Laravel Pint: Tambahkan composer require --dev phpstan/phpstan laravel/pint dan konfigurasi strict level 9.
Testing: Buat Feature test untuk API Sanctum dan unit test untuk Livewire dengan php artisan test.
Docker: Gunakan official Laravel Sail (Docker) untuk konsistensi lingkungan pengembangan.
Cache Config & Routes: Deploy dengan php artisan config:cache dan php artisan route:cache untuk performa.

Ikuti langkah di atas, dan Anda akan memiliki stack Laravel 11 yang siap produksi dengan Vite, Breeze, Sanctum, dan Livewire.

Dengan mengikuti tutorial ini, Anda telah menyiapkan proyek Laravel 11 modern yang memanfaatkan Vite untuk asset bundling, Breeze untuk scaffold autentikasi, Sanctum untuk keamanan API, serta Livewire untuk interaktivitas UI tanpa menulis JavaScript berlebih. Ikuti best practice 2026 untuk menjaga kode tetap bersih, teruji, dan siap skala.

Panduan step-by-step setup Laravel 11 terbaru dengan Vite, Breeze, Sanctum, dan Livewire. Praktik modern 2026 untuk aplikasi PHP Framework cepat, aman, dan interaktif.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend

Panduan Lengkap Setup Laravel 11 dengan Praktik Modern: Vite, Breeze, Sanctum, & Jetstream

Tutorial step‑by‑step ini menjelaskan cara menginstal Laravel 11 terbaru, mengonfigurasi Vite untuk asset bundling, menambahkan Breeze untuk scaffolding, serta mengamankan API dengan Sanctum. Ikuti panduan ini untuk memulai proyek Laravel yang modern, cepat, dan aman.

1. Persyaratan Sistem

Pastikan server Anda memenuhi persyaratan berikut:

PHP >= 8.2
Composer 2.x
Node.js >= 18 (npm atau Yarn)
Database MySQL, PostgreSQL, atau SQLite

2. Instalasi Laravel 11

2.1 Buat proyek baru

composer create-project laravel/laravel:^11 my-project
cd my-project

Perintah ini mengunduh Laravel 11 dengan semua dependensi default.

2.2 Setup .env

cp .env.example .env
php artisan key:generate

Sesuaikan konfigurasi database pada file .env.

3. Integrasi Vite (Asset Bundler Modern)

3.1 Instalasi dependensi Node

npm install

Laravel 11 sudah menyertakan vite.config.js default.

3.2 Jalankan dev server

npm run dev

Vite akan memuat ulang secara otomatis ketika Anda mengubah file resources/js atau resources/css.

4. Scaffolding Frontend dengan Breeze

4.1 Instalasi Breeze

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

Anda dapat mengganti vue dengan react atau blade sesuai kebutuhan.

4.2 Build assets

npm install && npm run dev

Langkah ini meng‑compile Tailwind CSS, Vue components, dan file JavaScript.

4.3 Migrasi database

php artisan migrate

Breeze menyediakan tabel users, password_resets, dll.

5. Autentikasi API dengan Sanctum

5.1 Instalasi Sanctum

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

5.2 Konfigurasi Middleware

Tambahkan EnsureFrontendRequestsAreStateful::class ke grup api di app/Http/Kernel.php:

'api' => [
    \Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
    'throttle:api',
    \Illuminate\Routing\Middleware\SubstituteBindings::class,
],

5.3 Membuat Token

// Controller contoh
public function token(Request $request)
{
    $user = $request->user();
    $token = $user->createToken('mobile-app')->plainTextToken;
    return response()->json(['token' => $token]);
}

5.4 Menggunakan Token di Frontend

Set header Authorization: Bearer YOUR_TOKEN pada setiap request API.

6. Best Practices Modern

Environment Segregation: gunakan file .env.testing untuk CI.
Static Analysis: jalankan phpstan dan larastan untuk deteksi bug dini.
Cache Config & Routes di produksi: php artisan config:cache && php artisan route:cache.
Queue Workers: gunakan Horizon untuk monitoring queue Redis.
Testing: tulis Feature Test dengan Pest atau PHPUnit dan jalankan di GitHub Actions.

Dengan mengikuti langkah di atas, Anda telah menyiapkan proyek Laravel 11 yang modern, cepat berkat Vite, dilengkapi UI scaffolding Breeze, serta aman dengan Sanctum untuk API. Terapkan best practice seperti static analysis, caching, dan CI/CD untuk menjaga kualitas kode seiring pertumbuhan aplikasi.

Panduan lengkap setup Laravel 11 dengan Vite, Breeze, dan Sanctum. Langkah-langkah instalasi, konfigurasi, contoh kode, dan best practice modern untuk pengembangan web dengan Laravel.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend

Setup Laravel 11 dengan Best Practice Modern: Vite, Breeze, Sanctum, dan lebih

Panduan lengkap langkah demi langkah untuk menginstal Laravel 11 terbaru, mengkonfigurasi Vite, Breeze, Sanctum, serta best practice keamanan dan performa pada tahun 2026.

1. Persiapan Lingkungan

Pastikan server Anda telah terpasang:

PHP >= 8.3
Composer 2.7+
Node.js >= 20 (npm atau yarn)
Database MySQL 8 atau PostgreSQL 15

1.1 Verifikasi Versi

php -v
composer -V
node -v
npm -v

2. Instalasi Laravel 11

Gunakan Composer untuk membuat proyek baru dengan starter kit laravel/laravel versi stabil.

composer create-project laravel/laravel blog "11.*" --prefer-dist

Masuk ke direktori proyek:

cd blog

3. Mengaktifkan Vite (Frontend Build Tool)

Laravel 11 sudah menyertakan Vite secara default. Pastikan file vite.config.js ada di root.

3.1 Install dependencies

npm install

3.2 Jalankan dev server

npm run dev

Anda dapat melihat perubahan secara hot‑reload pada http://localhost:5173.

4. Menambahkan Breeze sebagai Authentication Scaffold

4.1 Install package

composer require laravel/breeze --dev

4.2 Generate scaffolding dengan Inertia + Vue 3 (pilihan populer 2026)

php artisan breeze:install vue

4.3 Build assets

npm run dev

4.4 Migrasi database

php artisan migrate

5. Konfigurasi Laravel Sanctum untuk API Token & SPA Authentication

5.1 Install Sanctum

composer require laravel/sanctum

5.2 Publish konfigurasi & migration

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

5.3 Update `app/Http/Kernel.php`

Tambahkan middleware EnsureFrontendRequestsAreStateful::class pada grup api:

'api' => [
    \Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
    'throttle:api',
    \Illuminate\Routing\Middleware\SubstituteBindings::class,
],

5.4 Konfigurasi CORS (file `config/cors.php`)

return [
    'paths' => ['api/*', 'sanctum/csrf-cookie'],
    'allowed_methods' => ['*'],
    'allowed_origins' => ['http://localhost:5173'],
    'allowed_headers' => ['*'],
    'exposed_headers' => [],
    'max_age' => 0,
    'supports_credentials' => true,
];

6. Best Practice Modern

6.1 Environment Variables

Gunakan .env.example yang lengkap.
Jangan pernah commit .env ke repo.
Set APP_DEBUG=false pada produksi.

6.2 Caching Config & Routes

php artisan config:cache
php artisan route:cache
php artisan view:cache

6.3 Optimized Autoload

composer install --optimize-autoloader --no-dev

6.4 Queue & Job

Aktifkan driver redis pada .env dan gunakan php artisan queue:work --daemon untuk proses background (email, notifications).

6.5 Testing

Laravel 11 mendukung Pest dan PHPUnit. Contoh test fitur auth:

php artisan test --filter AuthTest

7. Deploy ke Production (Contoh Laravel Forge atau Docker)

7.1 Deploy dengan Laravel Forge

Buat site baru, pilih PHP 8.3, pilih database.
Masukkan repository GitHub, aktifkan “Auto Deploy”.
Set environment variables di Forge dashboard.
Jalankan php artisan migrate --force pada post‑deploy script.

7.2 Deploy dengan Docker (multi‑stage build)

# Dockerfile
FROM php:8.3-fpm-alpine AS builder
WORKDIR /var/www
COPY . .
RUN apk add --no-cache npm git && \
    composer install --no-dev --optimize-autoloader && \
    npm ci && npm run build && \
    php artisan event:cache && php artisan route:cache && php artisan config:cache

FROM php:8.3-fpm-alpine AS production
WORKDIR /var/www
COPY --from=builder /var/www .
EXPOSE 9000
CMD ["php-fpm"]

7.3 SSL & HTTP/2

Gunakan certbot untuk Let's Encrypt, pastikan server mendukung HTTP/2 untuk performa optimal.

8. Verifikasi Instalasi

Buka browser, akses https://your-domain.com. Anda harus melihat halaman welcome Laravel, bisa login/register via Breeze, dan token API dapat dibuat lewat route /api/user yang dilindungi Sanctum.

Dengan mengikuti langkah‑langkah di atas, Anda memiliki aplikasi Laravel 11 yang modern, aman, dan siap produksi. Kombinasi Vite, Breeze, dan Sanctum memberikan developer pengalaman full‑stack yang cepat, sementara praktik caching, queue, dan deployment container memastikan performa dan skalabilitas di era 2026.

Panduan step-by-step setup Laravel 11 terbaru dengan Vite, Breeze, Sanctum, serta best practice modern untuk produksi tahun 2026.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend

Setup Laravel 11 dengan Best Practice Modern: Vite, Breeze, Sanctum, dan Typescript

Panduan lengkap langkah demi langkah untuk menginstal Laravel 11 terbaru, mengintegrasikan Vite, Breeze, Sanctum, dan TypeScript, sehingga Anda mendapatkan fondasi proyek yang modern, cepat, dan aman.

1. Prasyarat

PHP 8.3 atau lebih baru
Composer 2.x
Node.js 20.x dan npm 10.x
Database (MySQL 8+, PostgreSQL, atau SQLite)

2. Instalasi Laravel 11

composer create-project laravel/laravel blog "11.*" --prefer-dist

Masuk ke folder proyek:

cd blog

3. Konfigurasi .env

Salin file contoh dan sesuaikan database Anda:

cp .env.example .env
php artisan key:generate

Ubah nilai berikut:

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=blog
DB_USERNAME=root
DB_PASSWORD=

4. Instalasi Vite (Laravel Mix digantikan)

Laravel 11 sudah menyertakan Vite secara default, namun kita perlu menambahkan dukungan TypeScript dan React (opsional).

npm install --save-dev vite laravel-vite-plugin
npm install --save-dev @vitejs/plugin-vue # jika menggunakan Vue
npm install --save-dev typescript @types/node # untuk TypeScript

Ubah 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.ts'],
            refresh: true,
        }),
        vue(),
    ],
});

5. Migrasi ke TypeScript

Ganti berkas JavaScript utama:

mv resources/js/app.js resources/js/app.ts

Contoh isi app.ts:

import './bootstrap';
import { createApp } from 'vue';
import ExampleComponent from './components/ExampleComponent.vue';

createApp({
    components: { ExampleComponent },
}).mount('#app');

6. Install Laravel Breeze (Auth starter)

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

Jika ingin menggunakan React:

php artisan breeze:install react

Jalankan Composer autoload dan npm:

composer install
npm install
npm run dev

7. Konfigurasi Sanctum untuk API Token

composer require laravel/sanctum

Publikasikan file konfigurasi dan migrasi:

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

Tambahkan middleware Sanctum pada api guard di config/sanctum.php (default sudah tepat). Pastikan Sanctum dicantumkan di api middleware grup pada app/Http/Kernel.php:

'api' => [
    \Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
    'throttle:api',
    \Illuminate\Routing\Middleware\SubstituteBindings::class,
],

Contoh endpoint token

use Illuminate\Http\Request;
use App\Models\User;

Route::post('/sanctum/token', function (Request $request) {
    $request->validate([
        'email' => 'required|email',
        'password' => 'required',
        'device_name' => 'required',
    ]);
    $user = User::where('email', $request->email)->first();
    if (! $user || ! Hash::check($request->password, $user->password)) {
        abort(401, 'Invalid credentials');
    }
    return $user->createToken($request->device_name)->plainTextToken;
});

8. Menjalankan Proyek

php artisan serve   # Laravel dev server (http://localhost:8000)
npm run dev        # Vite hot‑module replacement

9. Best Practice Modern

Environment Segregation: Simpan rahasia di .env dan gunakan .env.testing untuk CI.
Static Analysis: Tambahkan phpstan dan larastan untuk type‑safety.
```
composer require --dev phpstan/phpstan larastan/larastan
```
Code Formatting: Gunakan pint (Laravel Pint) untuk standar coding.
```
composer require --dev laravel/pint
./vendor/bin/pint
```
Testing: Buat tes fitur dengan php artisan test dan gunakan Laravel Sanctum untuk autentikasi di API test.
Cache Configuration: Aktifkan redis di production dan set CACHE_DRIVER=redis pada .env.
Queue: Gunakan database atau redis driver, jalankan php artisan queue:work di supervisor.

10. Deploy ke Production (Ringkas)

Clone repo di server, install dependensi: composer install --optimize-autoloader --no-dev
Build assets: npm ci && npm run build

Set environment variables, migrasi, dan cache config:

php artisan migrate --force
php artisan config:cache
php artisan route:cache
php artisan view:cache

Jalankan queue worker dan scheduler dengan Supervisor / Cron.

Dengan mengikuti langkah‑langkah di atas, Anda memiliki proyek Laravel 11 yang terstruktur dengan Vite, TypeScript, Breeze untuk UI starter, dan Sanctum untuk API authentication. Kombinasi ini memberi kecepatan pengembangan, performa front‑end modern, serta keamanan yang sesuai standar Laravel terbaru. Terapkan best practice seperti static analysis, testing, dan caching untuk menghasilkan aplikasi produksi yang stabil dan scalable.

Tutorial lengkap setup Laravel 11 dengan Vite, Breeze, Sanctum, dan TypeScript. Langkah demi langkah, contoh kode, dan best practice modern untuk pengembangan web PHP framework terkini.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend

Panduan Lengkap Setup Laravel 11 dengan Vite, Breeze, dan Sanctum (2026)

Tutorial step‑by‑step ini menjelaskan cara menginstal Laravel 11 terbaru, mengkonfigurasi Vite untuk asset bundling, menambahkan Breeze sebagai starter kit UI, serta mengamankan API dengan Sanctum.

1. Prasyarat

PHP >= 8.3
Composer 2.x
Node.js >= 20 & npm
Database MySQL/PostgreSQL

2. Instalasi Laravel 11

composer create-project laravel/laravel blog "11.*" --prefer-dist
cd blog

Perintah di atas mengunduh Laravel versi stabil 11.x pada folder blog.

2.1. Verifikasi Instalasi

php artisan --version

Output harus menampilkan Laravel Framework 11.x.

3. Setup Vite (Asset Bundler)

Laravel 11 sudah memakai Vite secara default, namun pastikan dependensi yang tepat ter‑install.

# Install Node dependencies
npm install
# Jalankan dev server
npm run dev

Jika ingin produksi, gunakan npm run build. Vite akan menghasilkan berkas di public/build.

3.1. Konfigurasi tambahan (optional)

Edit vite.config.js untuk menambah alias:

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
    plugins: [laravel(['resources/js/app.js', 'resources/css/app.css'])],
    resolve: {
        alias: {
            '@': '/resources/js',
        },
    },
});

4. Instalasi Laravel Breeze

Breeze menyediakan scaffolding autentikasi berbasis Blade atau Inertia. Di sini kita pilih Blade.

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

Jalankan migrasi untuk membuat tabel pengguna.

php artisan migrate

4.1. Verifikasi UI

Buka http://localhost:8000/register dan /login untuk memastikan tampilan berhasil.

5. Instalasi Laravel Sanctum

Sanctum memudahkan otentikasi SPA atau API token.

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

5.1. Konfigurasi Middleware

Tambahkan EnsureFrontendRequestsAreStateful::class ke grup api di app/Http/Kernel.php:

'api' => [
    \Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
    'throttle:api',
    \Illuminate\Routing\Middleware\SubstituteBindings::class,
],

5.2. Menggunakan Token Personal

// routes/api.php
use App\Models\User;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Route;

Route::middleware('auth:sanctum')->get('/user', function (Request $request) {
    return $request->user();
});

// Membuat token di controller
$token = $user->createToken('mobile-app')->plainTextToken;

6. Best Practice Modern

Environment Variables: Simpan kunci API, DB, dan Sanctum secret di .env; jangan pernah commit.
Gunakan Model Factories & Seeders: Untuk testing dan CI, buat data dummy dengan php artisan make:factory.
Cache Config & Routes: Pada produksi jalankan php artisan config:cache dan php artisan route:cache demi performa.
Static Analysis: Tambahkan phpstan atau pint untuk kode bersih.
Docker: Pertimbangkan containerisasi untuk konsistensi lingkungan dev‑prod.

7. Deploy ke Server Produksi

# Pull repository
git clone https://github.com/username/blog.git
cd blog

# Install PHP dependencies
composer install --optimize-autoloader --no-dev

# Install Node assets
npm ci && npm run build

# Set environment
cp .env.example .env
php artisan key:generate
php artisan migrate --force

# Optimizations
php artisan config:cache
php artisan route:cache
php artisan view:cache

# Restart queue & scheduler (if used)
supervisorctl restart all

Pastikan web server (Nginx/Apache) mengarahkan semua request ke public/index.php dan folder storage serta bootstrap/cache memiliki izin write.

Dengan mengikuti langkah‑langkah di atas, Anda memiliki proyek Laravel 11 yang modern: Vite untuk asset bundling, Breeze untuk UI autentikasi cepat, dan Sanctum untuk keamanan API. Kombinasi ini mencerminkan best practice 2026, memudahkan pengembangan cepat sekaligus menjaga performa dan keamanan produksi.

Tutorial lengkap instalasi Laravel 11 dengan Vite, Breeze, dan Sanctum 2026. Ikuti step‑by‑step setup, konfigurasi, contoh kode, dan best practice modern untuk proyek PHP Framework terbaik.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend

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

Artikel ini memberikan tutorial step‑by‑step yang akurat dan up‑to‑date untuk menginstal Laravel 11 serta mengintegrasikan Vite, Breeze, Sanctum, dan Jetstream, sehingga proyek Anda siap production dengan standar Laravel terbaru.

1. Persiapan Lingkungan

Pastikan server Anda memenuhi requirement Laravel 11:

PHP >= 8.2
Ekstensi: OpenSSL, PDO, Mbstring, Tokenizer, XML, Ctype, JSON, BCMath
Composer 2.6+
Node.js >= 20 (untuk Vite)

2. Instalasi Laravel 11

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

Masuk ke folder proyek:

cd myproject

3. Mengganti Asset Build Tool ke Vite

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

npm install
npm run dev   // untuk development
npm run build // untuk production

Pastikan file vite.config.js berisi:

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
export default defineConfig({
    plugins: [laravel(["resources/css/app.css", "resources/js/app.js"])],
});

4. Instalasi Laravel Breeze (Auth sederhana)

composer require laravel/breeze --dev
php artisan breeze:install react   // atau vue, blade
npm install && npm run dev

Jalankan migrasi:

php artisan migrate

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

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

Konfigurasi config/sanctum.php:

Set stateful ke domain front‑end Anda (contoh: ['localhost', 'myapp.test'])
Pastikan guard di auth.php menggunakan sanctum untuk API.

Tambahkan middleware ke api route group di app/Http/Kernel.php:

'api' => [\Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class, 'throttle:api', \Illuminate\Routing\Middleware\SubstituteBindings::class],

6. (Opsional) Integrasi Jetstream untuk Fitur Team & 2FA

composer require laravel/jetstream
php artisan jetstream:install livewire --team   // atau inertia
npm install && npm run dev
php artisan migrate

Jetstream sudah menggunakan Sanctum di belakang layar, sehingga tidak perlu konfigurasi tambahan.

7. Konfigurasi Environment & Security Best Practice

Set APP_DEBUG=false di .env production.
Generate key: php artisan key:generate
Gunakan APP_URL yang tepat, aktifkan SESSION_SECURE_COOKIE=true dan SANCTUM_STATEFUL_DOMAINS sesuai domain.
Cache konfigurasi: php artisan config:cache dan route: php artisan route:cache
Gunakan queue driver (Redis) untuk email, broadcast, dll.

8. Deploy ke Server Production

Push kode ke repository Git.
Clone pada server, jalankan composer install --optimize-autoloader --no-dev.
Set permission: chmod -R 775 storage bootstrap/cache.
Build assets: npm ci && npm run build.
Run migrations: php artisan migrate --force.
Cache konfigurasi & route seperti pada langkah 7.
Gunakan process manager (Supervisor) untuk php-fpm dan queue workers.

9. Best Practice Tambahan

Gunakan php artisan test dengan PHPUnit atau Pest untuk CI.
Integrasikan Sentry atau Bugsnag untuk error monitoring.
Gunakan Laravel Pint (code style) dan PHPStan level max.
Periodic backup database dengan Laravel Backup package.

Dengan mengikuti langkah‑langkah di atas, Anda mendapatkan proyek Laravel 11 yang modern, aman, dan siap produksi. Kombinasi Vite, Breeze, Sanctum, dan optional Jetstream memberikan fondasi kuat untuk aplikasi web maupun API, sesuai best practice Laravel pada tahun 2026.

Tutorial lengkap setup Laravel 11 dengan Vite, Breeze, Sanctum, dan Jetstream. Panduan step‑by‑step, konfigurasi, contoh kode, dan best practice modern untuk PHP Framework terbaru.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend

Panduan Lengkap Setup Laravel 11 dengan Best Practice Modern: Vite, Breeze, Sanctum, dan Tailwind CSS

Tutorial step‑by‑step ini menjelaskan cara menginstal Laravel 11 terbaru, mengkonfigurasi Vite, menambahkan Breeze untuk otentikasi, mengintegrasikan Sanctum API token, serta menerapkan Tailwind CSS dengan best practice pada tahun 2026.

1. Persiapan Lingkungan

Pastikan server Anda memenuhi persyaratan minimum Laravel 11:

PHP >= 8.2
Extensi: OpenSSL, PDO, Mbstring, Tokenizer, XML, Ctype, JSON, BCMath
Composer 2.x
Node.js >= 20 dan npm atau Yarn

1.1 Instalasi Composer & Laravel Installer

composer global require laravel/installer
export PATH="$HOME/.config/composer/vendor/bin:$PATH"

Verifikasi versi:

laravel --version

2. Membuat Project Laravel 11

laravel new blog --jetstream=none --stack=livewire

Atau dengan Composer:

composer create-project --prefer-dist laravel/laravel blog "11.*"

2.1 Struktur Direktori Awal

Setelah proses selesai, periksa struktur app, routes, dan resources. Pastikan .env berisi koneksi database yang tepat.

3. Mengaktifkan Vite (Pengganti Laravel Mix)

Laravel 11 sudah menyertakan Vite secara default. Pastikan paket berikut terinstall:

npm install @vitejs/plugin-vue@latest vite laravel-vite-plugin@latest

3.1 Konfigurasi `vite.config.js`

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
    plugins: [
        laravel({
            input: ['resources/css/app.css', 'resources/js/app.js'],
            refresh: true,
        }),
    ],
});

3.2 Menambahkan Tailwind CSS

npm install -D tailwindcss postcss autoprefixer
npx tailwindcss init -p

Ubah tailwind.config.js:

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

Dan tambahkan directive ke resources/css/app.css:

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

3.3 Menjalankan Development Server

npm run dev

Laravel Mix sudah digantikan; Vite akan hot‑reload secara otomatis.

4. Menyisipkan Laravel Breeze (Starter Kit)

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

Jika ingin menggunakan Inertia atau Livewire, ganti parameter blade dengan vue atau react. Pada contoh ini kita pakai Blade.

4.1 Migrasi Database

php artisan migrate

Setelah migrasi, jalankan php artisan serve dan akses http://localhost:8000/register untuk memastikan otentikasi berfungsi.

5. Mengintegrasikan Laravel Sanctum untuk API Token

Sanctum menyediakan dua mode: SPA authentication (cookie‑based) dan API token. Kita akan menyiapkan API token.

5.1 Install Sanctum

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

5.2 Konfigurasi Middleware

Tambahkan EnsureFrontendRequestsAreStateful::class pada grup api di app/Http/Kernel.php (hanya untuk SPA). Untuk token‑based, cukup gunakan auth:sanctum pada route.

5.3 Membuat Route API

use AppHttpControllersApiPostController;

Route::middleware('auth:sanctum')->group(function () {
    Route::get('/posts', [PostController::class, 'index']);
    Route::post('/posts', [PostController::class, 'store']);
});

5.4 Contoh Controller

namespace AppHttpControllersApi;
use AppHttpControllersController;
use AppModelsPost;
use IlluminateHttpRequest;

class PostController extends Controller {
    public function index(){
        return Post::latest()->paginate(10);
    }
    public function store(Request $request){
        $validated = $request->validate([
            'title' => 'required|string|max:255',
            'body' => 'required|string',
        ]);
        $post = $request->user()->posts()->create($validated);
        return response()->json($post, 201);
    }
}

5.5 Menghasilkan Token

Setelah login via Breeze, gunakan endpoint berikut (misal /sanctum/token) atau buat route khusus:

Route::post('/sanctum/token', function (Request $request) {
    $request->validate([
        'email' => 'required|email',
        'password' => 'required',
        'device_name' => 'required',
    ]);
    $user = AppModelsUser::where('email', $request->email)->first();
    if (! $user || ! Hash::check($request->password, $user->password)) {
        abort(401);
    }
    return $user->createToken($request->device_name)->plainTextToken;
});

6. Best Practice Modern untuk Laravel 11

Environment Variables: Simpan rahasia di .env dan gunakan config:cache di produksi.
Static Analysis: Tambahkan phpstan atau psalm untuk type safety.
Testing: Gunakan PestPHP atau PHPUnit; contoh:
php artisan test
Docker: Buat container resmi (php:8.2-fpm, mysql, redis, node) untuk konsistensi dev‑ops.
CI/CD: Integrasikan GitHub Actions yang menjalankan lint, test, dan deploy otomatis ke Laravel Vapor atau server tradisional.
Cache & Queue: Konfigurasi Redis sebagai driver default; gunakan job batching untuk proses berat.
Code Style: Terapkan PSR‑12 dengan composer fix (PHP-CS-Fixer).

7. Deploy ke Production

Set APP_ENV=production dan APP_DEBUG=false di .env.
Jalankan php artisan config:cache, php artisan route:cache, dan php artisan view:cache.
Build assets: npm run build (Vite akan menghasilkan file minified di public/build).
Pastikan izin folder storage dan bootstrap/cache 0755.
Gunakan server web Nginx dengan konfigurasi try_files $uri $uri/ /index.php?$query_string;.

8. Verifikasi Akhir

Buka URL produksi, coba register, login, dan panggil endpoint API dengan token yang di‑generate. Pastikan tidak ada error di log (storage/logs/laravel.log).

Dengan mengikuti langkah‑langkah di atas, Anda mendapatkan aplikasi Laravel 11 yang modern, scalable, dan aman—menggunakan Vite untuk asset bundling, Breeze untuk otentikasi cepat, Sanctum untuk API token, serta Tailwind CSS untuk UI responsif. Terapkan best practice seperti caching, containerisasi, dan CI/CD untuk memastikan proyek tetap terjaga kualitasnya di tahun 2026.

Tutorial step‑by‑step setup Laravel 11 terbaru dengan Vite, Breeze, Sanctum, dan Tailwind CSS. Panduan lengkap 2026 untuk developer PHP dan Web Development.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend

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

Tutorial step‑by‑step ini menjelaskan cara menginstal Laravel 11 terbaru, mengonfigurasi Vite untuk asset bundling, menambahkan Breeze sebagai starter kit, serta mengamankan API dengan Sanctum. Ikuti langkahnya dan terapkan best practice modern untuk proyek Laravel Anda.

1. Prasyarat

Pastikan sistem Anda sudah terinstall:

PHP >= 8.2
Composer 2.x
Node.js >= 18 (bersama npm atau Yarn)
Database (MySQL, PostgreSQL, atau SQLite)

2. Instalasi Laravel 11

2.1 Buat proyek baru

composer create-project laravel/laravel my-app "11.*"

Perintah ini mengunduh Laravel versi stabil terbaru (v11) ke folder my-app.

2.2 Masuk ke direktori proyek

cd my-app

3. Konfigurasi Vite (Laravel Mix digantikan)

3.1 Install dependensi frontend

npm install

Package vite dan laravel-vite-plugin sudah terdefinisi di package.json Laravel 11.

3.2 Struktur file Vite

File utama berada di vite.config.js. Contoh konfigurasi minimal:

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
    plugins: [
        laravel({
            input: ['resources/css/app.css', 'resources/js/app.js'],
            refresh: true,
        }),
    ],
});

3.3 Jalankan dev server

npm run dev

Vite akan melayani asset secara hot‑reloading pada http://localhost:5173.

4. Menambahkan Laravel Breeze (Starter Kit)

4.1 Install package Breeze

composer require laravel/breeze --dev

4.2 Generate scaffolding

php artisan breeze:install vue

Anda dapat memilih blade, react, atau vue. Di contoh ini menggunakan Vue 3 yang terintegrasi dengan Vite.

4.3 Install dependensi frontend untuk Breeze

npm install && npm run dev

4.4 Migrasi database

php artisan migrate

Ini membuat tabel users, password_resets, 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 Tambahkan middleware ke kernel

Di app/Http/Kernel.php, pastikan EnsureFrontendRequestsAreStateful::class berada di grup api:

'api' => [
    \Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
    'throttle:api',
    \Illuminate\Routing\Middleware\SubstituteBindings::class,
],

5.4 Contoh route API dengan token

use App\Models\User;
use Illuminate\Http\Request;

Route::post('/login', function (Request $request) {
    $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]);
});

Route::middleware('auth:sanctum')->get('/user', function (Request $request) {
    return $request->user();
});

5.5 Konsumsi API di frontend Vue

import axios from 'axios';

async function login(email, password) {
  const response = await axios.post('/api/login', { email, password });
  localStorage.setItem('token', response.data.token);
}

async function getUser() {
  const token = localStorage.getItem('token');
  const response = await axios.get('/api/user', {
    headers: { Authorization: `Bearer ${token}` },
  });
  return response.data;
}

6. Best Practice Modern

Environment Files: Simpan semua rahasia (APP_KEY, DB_PASSWORD, SANCTUM_STATEFUL_DOMAINS) di .env dan gunakan php artisan env:cache untuk produksi.
Cache Config & Routes: php artisan config:cache dan php artisan route:cache meningkatkan performa.
Queue & Jobs: Untuk operasi berat (email, webhook) gunakan queue dengan driver redis dan php artisan queue:work.
Testing: Tulis Feature Test dengan Pest atau PHPUnit untuk API yang diproteksi Sanctum.
Static Analysis: Integrasikan phpstan dan larastan untuk deteksi bug sebelum deploy.

7. Deploy ke Production

Set environment ke production di .env.
Build assets: npm run build (menghasilkan file di public/build).
Run migrations: php artisan migrate --force.
Cache config & routes.
Gunakan server PHP-FPM + Nginx, atau Laravel Vapor untuk serverless.

Dengan mengikuti langkah‑langkah di atas, Anda memiliki proyek Laravel 11 yang siap produksi, menggunakan Vite, Breeze, dan Sanctum dengan best practice modern.

Laravel 11 memberikan fondasi yang kuat untuk pengembangan web modern. Dengan Vite sebagai bundler cepat, Breeze sebagai starter kit, serta Sanctum untuk otentikasi API yang ringan, Anda dapat membangun aplikasi yang scalable, maintainable, dan aman. Terapkan best practice seperti caching, queue, dan static analysis untuk meningkatkan kualitas kode dan performa produksi.

Tutorial step‑by‑step setup Laravel 11 terbaru dengan Vite, Breeze, dan Sanctum. Ikuti panduan instalasi, konfigurasi, contoh kode, dan best practice modern untuk proyek Laravel yang aman dan performant.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend

Setup Laravel 11 dengan Best Practice Modern: Vite, Breeze, Sanctum, dan Jetstream

Panduan lengkap langkah demi langkah untuk menginstal dan mengkonfigurasi Laravel 11 dengan stack modern termasuk Vite, Breeze, Sanctum, serta best practice keamanan dan performa.

1. Prasyarat

PHP 8.3 atau lebih tinggi
Composer 2.x
Node.js 20.x dengan npm atau Yarn
Database MySQL/PostgreSQL

2. Instalasi Laravel 11

composer create-project laravel/laravel blog "11.*" --prefer-dist

Masuk ke folder proyek:

cd blog

3. Setup Vite (Asset Bundler default)

Laravel 11 sudah menyertakan Vite. Pastikan vite.config.js ada dan jalankan:

npm install
npm run dev

Jika ingin menambahkan React atau Vue:

npm install --save-dev @vitejs/plugin-react
# atau npm install --save-dev @vitejs/plugin-vue

4. Instalasi Laravel Breeze (Authentication starter)

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

Untuk stack Inertia + Vue:

php artisan breeze:install vue

Install dependensi front-end dan compile:

npm install
npm run dev

5. Konfigurasi Sanctum (API Token & SPA Authentication)

composer require laravel/sanctum

Publish konfigurasi dan migrasi:

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

Tambahkan middleware ke api guard di app/Http/Kernel.php:

'api' => [
    \Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
    'throttle:api',
    Illuminate\Routing\Middleware\SubstituteBindings::class,
],

Konfigurasi CORS di config/cors.php untuk domain front‑end.

6. Environment & Security Best Practices

Set APP_DEBUG=false pada production.
Generate key: php artisan key:generate
Gunakan .env.example sebagai template.
Enable HTTPS dengan AppServiceProvider forcing scheme:

use Illuminate\Support\Facades\URL;
public function boot()
{
    if (app()->environment('production')) {
        URL::forceScheme('https');
    }
}

7. Optimasi Performansi

Cache konfigurasi & route:

php artisan config:cache
php artisan route:cache
php artisan view:cache

Gunakan php artisan optimize untuk memuat file yang sudah di‑optimasi.

8. Deploy Checklist

Set APP_ENV=production dan APP_DEBUG=false.
Run composer install --optimize-autoloader --no-dev.
Run npm ci && npm run build untuk asset produksi.
Migrate database: php artisan migrate --force.
Setup queue worker (Supervisor) bila memakai queue.

Dengan mengikuti langkah‑langkah di atas, Anda mendapatkan aplikasi Laravel 11 yang modern, aman, dan siap produksi. Stack Vite, Breeze, dan Sanctum memberikan fondasi yang solid untuk SPA atau API, sementara best practice seperti caching, HTTPS, dan environment handling memastikan performa dan keamanan optimal.

Panduan lengkap setup Laravel 11 dengan Vite, Breeze, Sanctum, serta best practice modern untuk keamanan dan performa dalam 2026.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend

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

Ikuti tutorial step‑by‑step ini untuk menginstal Laravel 11 terbaru, mengonfigurasi Vite, Breeze, Sanctum, serta Tailwind CSS sehingga proyek siap produksi dengan standar keamanan dan performa terkini.

1. Prasyarat

PHP >= 8.2
Composer 2.x
Node.js >= 20 & npm atau Yarn
Database MySQL/PostgreSQL/SQLite

2. Instalasi Laravel 11

composer create-project laravel/laravel my-app "11.*"

Masuk ke direktori proyek:

cd my-app

2.1. Validasi Instalasi

php artisan --version

Output harus menampilkan Laravel Framework 11.x.x.

3. Setup Frontend dengan Vite & Tailwind CSS

3.1. Install dependensi npm

npm install

3.2. Tambahkan Tailwind CSS

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

Inisialisasi konfigurasi Tailwind:

npx tailwindcss init -p

Ubah 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;

3.3. Konfigurasi Vite

File vite.config.js yang di‑generate Laravel sudah siap. Pastikan ada plugin Laravel Vite:

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
    plugins: [
        laravel({
            input: ['resources/css/app.css', 'resources/js/app.js'],
            refresh: true,
        }),
    ],
});

3.4. Jalankan dev server

npm run dev

Vite akan meng‑compile asset dan hot‑reload.

4. Instalasi Laravel Breeze (Starter Kit)

composer require laravel/breeze --dev

Generate scaffolding dengan Tailwind & Vite:

php artisan breeze:install vue

Jika ingin menggunakan Blade saja, ganti vue dengan blade.

Install kembali npm dependencies yang diperlukan Breeze:

npm install && npm run dev

5. Menambahkan Laravel Sanctum untuk API Authentication

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 pada api middleware group di app/Http/Kernel.php:

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

5.4. Menggunakan Token Personal Access

Contoh route untuk login API:

use Illuminate\Http\Request;
use App\Models\User;

Route::post('/api/login', function (Request $request) {
    $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]);
});

5.5. Melindungi Route API

Route::middleware('auth:sanctum')->get('/user', function (Request $request) {
    return $request->user();
});

6. Best Practice Modern

Environment Variables: Simpan kunci rahasia di .env (APP_KEY, SANCTUM_STATEFUL_DOMAINS, SESSION_DOMAIN).
Cache Config & Routes: Pada production jalankan php artisan config:cache dan php artisan route:cache.
Optimized Autoload: composer install --optimize-autoloader --no-dev.
HTTPS & Secure Cookies: Set SESSION_SECURE_COOKIE=true dan SANCTUM_COOKIE_SECURE=true di .env.
Static Asset Versioning: Vite sudah menambahkan hash pada nama file, cukup pastikan mix() diganti dengan vite() di Blade.
Testing: Gunakan Pest atau PHPUnit; contoh: php artisan test.

7. Deploy ke Production (Contoh di Laravel Forge/VPS)

Clone repo, git pull
Install PHP dependencies: composer install --no-dev --optimize-autoloader
Install Node assets: npm ci && npm run build
Set permission: chmod -R 775 storage bootstrap/cache
Jalankan migrasi & cache: php artisan migrate --force && php artisan config:cache && php artisan route:cache && php artisan view:cache
Restart queue & supervisor jika ada.

Setelah semua langkah selesai, aplikasi Laravel 11 siap melayani traffic dengan stack modern.

Dengan mengikuti tutorial ini, Anda berhasil men-setup Laravel 11 menggunakan Vite, Tailwind, Breeze, dan Sanctum—semua dalam satu rangkaian yang mengikuti best practice 2026. Stack modern ini memberikan kecepatan pengembangan, keamanan API, dan performa front‑end yang optimal, siap untuk skala produksi maupun proyek starter.

Panduan lengkap instalasi Laravel 11 dengan Vite, Breeze, Sanctum, Tailwind CSS, dan best practice modern untuk pengembangan web 2026.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend

Setup Laravel 11 dengan Best Practice Modern: Vite, Breeze, Sanctum, dan Testing

Panduan lengkap step‑by‑step untuk menyiapkan proyek Laravel terbaru (v11) menggunakan bundler Vite, starter kit Breeze, otentikasi API Sanctum, serta testing otomatis yang siap produksi di tahun 2026.

1. Prasyarat

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

2. Instalasi Laravel 11

composer create-project laravel/laravel blog "11.*" --prefer-dist

Masuk ke folder proyek:

cd blog

3. Mengonfigurasi Vite

Laravel 11 sudah menyertakan Vite secara default, namun pastikan dependensi terbaru:

npm install --save-dev vite@^5.0 laravel-vite-plugin@^1.0

Edit vite.config.js jika ingin menambah alias atau plugin:

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
    plugins: [laravel({
        input: ['resources/js/app.js', 'resources/css/app.css'],
        refresh: true,
    })],
    resolve: {
        alias: {
            '@': '/resources/js',
        },
    },
});

4. Install Breeze dengan Inertia‑React (opsional)

Breeze menyediakan scaffolding ringan untuk otentikasi. Pilih stack yang diinginkan; contoh ini memakai React + Inertia:

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

Install depedensi front‑end dan jalankan dev server:

npm install
npm run dev

5. Menyiapkan Sanctum untuk API Token

composer require laravel/sanctum

Publikasikan konfigurasi dan migrasi:

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

Tambahkan middleware EnsureFrontendRequestsAreStateful::class di app/Http/Kernel.php pada grup api (default di Laravel 11 sudah ada).

Contoh model User menggunakan token:

use Laravel\Sanctum\HasApiTokens;

class User extends Authenticatable {
    use HasApiTokens, Notifiable;
}

Endpoint login API:

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

6. Konfigurasi Environment

# .env
APP_NAME="Laravel"
APP_ENV=local
APP_KEY=base64:$(php artisan key:generate --show)
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. Best Practice – Struktur Direktori

app/Models untuk semua Eloquent model.
app/Http/Controllers/Api untuk controller API.
routes/api.php hanya berisi route yang menggunakan auth:sanctum.
resources/js/Pages menampung komponen Inertia.
tests/Feature menambahkan tes end‑to‑end untuk setiap endpoint.

8. Menulis Tes Otentikasi Sanctum

public function test_user_can_login_and_access_protected_route()
{
    $user = User::factory()->create(['password' => bcrypt('secret')]);

    $response = $this->postJson('/api/login', [
        'email' => $user->email,
        'password' => 'secret',
    ]);

    $token = $response->json();
    $this->assertNotNull($token);

    $protected = $this->withHeaders([
        'Authorization' => "Bearer {$token}",
    ])->getJson('/api/user');

    $protected->assertOk();
    $protected->assertJsonPath('email', $user->email);
}

9. Deploy ke Production

Set APP_ENV=production dan APP_DEBUG=false.
Jalankan composer install --optimize-autoloader --no-dev.
Build assets: npm run build (Vite menghasilkan manifest).
Cache config & routes: php artisan config:cache && php artisan route:cache.
Gunakan queue worker Supervisor atau Laravel Horizon untuk job background.

10. Penutup

Dengan mengikuti langkah‑langkah di atas, Anda mendapatkan aplikasi Laravel 11 yang modern, cepat berkat Vite, dilengkapi otentikasi API yang aman melalui Sanctum, serta UI responsif menggunakan Breeze + React. Semua komponen mengikuti best practice Laravel dan siap untuk skala produksi di tahun 2026.

Laravel 11 menawarkan ekosistem yang lebih ringan dan terintegrasi. Menggabungkan Vite, Breeze, dan Sanctum memberikan fondasi yang kuat untuk aplikasi web dan API modern, sekaligus memenuhi standar keamanan dan performa terkini. Ikuti panduan ini, tambahkan testing, dan Anda siap meluncurkan produk yang scalable dan maintainable.

Panduan lengkap step‑by‑step setup Laravel 11 dengan Vite, Breeze, Sanctum, dan testing. Praktik terbaik modern Laravel 2026 untuk pengembangan web cepat dan aman.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend

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

Ikuti tutorial step-by-step untuk menginstal Laravel 11, mengonfigurasi Vite, Breeze, Sanctum, serta menyiapkan lingkungan pengembangan yang optimal di tahun 2026.

1. Persiapan Lingkungan

1.1. Prasyarat

PHP >= 8.2
Composer 2.x
Node.js 20.x & npm 10.x
Database MySQL 8 atau PostgreSQL 15

1.2. Instalasi Laravel Installer (opsional)

composer global require laravel/installer

Pastikan ~/.composer/vendor/bin berada di PATH.

2. Membuat Proyek Laravel 11 Baru

laravel new blog --jetstream

atau menggunakan Composer:

composer create-project --prefer-dist laravel/laravel blog "11.*"

3. Mengatur Vite (Frontend Asset Bundler)

3.1. Instalasi Dependensi

cd blog
npm install

3.2. Konfigurasi `vite.config.js`

Laravel 11 sudah menyertakan konfigurasi default, namun tambahkan alias untuk Vue 3 (jika diperlukan):

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
    plugins: [
        laravel({
            input: ['resources/css/app.css', 'resources/js/app.js'],
            refresh: true,
        }),
    ],
    resolve: {
        alias: {
            '@': '/resources/js',
        },
    },
});

3.3. Menjalankan Dev Server

npm run dev

Vite akan melayani aset dengan hot‑module replacement.

4. Menambahkan Laravel Breeze (Starter Kit)

4.1. Instalasi Breeze

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

Jika ingin menggunakan Inertia + Vue atau React, gunakan --inertia atau --react.

4.2. Kompilasi Asset

npm run dev
php artisan migrate

5. Konfigurasi 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. Menambahkan Middleware

Di app/Http/Kernel.php tambahkan:

'api' => [
    \Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
    'throttle:api',
    \Illuminate\Routing\Middleware\SubstituteBindings::class,
],

5.3. Membuat Route API Sanctum

Route::middleware('auth:sanctum')->get('/user', function (Request $request) {
    return $request->user();
});

5.4. Frontend: Menggunakan Token

Contoh fetch dengan token:

fetch('/api/user', {
    headers: {
        'Authorization': `Bearer ${token}`,
        'Accept': 'application/json',
    },
})
.then(res => res.json())
.then(data => console.log(data));

6. Best Practice Modern

Environment Segregation: Simpan rahasia di .env dan gunakan .env.example untuk tim.
Docker Development: Buat docker-compose.yml dengan layanan php, nginx, mysql, redis. Pastikan hot reload Vite dipetakan.
Testing: Gunakan php artisan test dengan PHPUnit 10 dan Pest untuk BDD.
Code Style: Terapkan PHP-CS-Fixer dan Laravel Pint (built‑in) secara otomatis pada CI.
Cache Configuration: Aktifkan OPcache di PHP‑FPM dan gunakan Redis untuk cache & queue.
Version Control: Commit vite.config.js, composer.lock, package-lock.json, hindari commit node_modules dan vendor.

7. Deploy ke Production

Build assets: npm run build
Cache konfigurasi & routes: php artisan config:cache && php artisan route:cache
Migrasi DB: php artisan migrate --force
Set APP_ENV=production dan APP_DEBUG=false
Gunakan queue worker dengan php artisan queue:work --daemon atau supervisor.

Dengan mengikuti langkah-langkah di atas, Anda akan memiliki proyek Laravel 11 yang dibangun di atas stack modern: Vite untuk asset bundling, Breeze sebagai starter kit UI, dan Sanctum untuk API authentication. Praktik terbaik seperti Docker, testing, dan caching memastikan aplikasi Anda siap untuk skala produksi di 2026.

Tutorial lengkap setup Laravel 11 dengan Vite, Breeze, Sanctum, dan best practice modern untuk pengembangan web di 2026.

Laravel,PHP Framework,Web Development

#Laravel #LaravelIndonesia #PHP #WebDev #Backend

News

Community Links

Laravel Jobs

Latest News

Latest Partners

Partners

1. Prasyarat Sistem

2. Instalasi Laravel 11

3. Mengatur Vite (Asset Bundler Modern)

4. Instalasi Breeze (Auth Starter Kit)

Penjelasan

5. Menambahkan Laravel Sanctum (SPA & Mobile Token Auth)

6. Best Practice Modern (2026)

7. Deploy ke Production (Contoh di Laravel Forge)

8. Verifikasi Semua

1. Persiapan Lingkungan

1.1. Persyaratan Sistem

1.2. Instalasi Composer & Node

2. Membuat Proyek Laravel 11

2.1. Membuat Project Baru

2.2. Masuk ke Direktori

3. Setup Frontend Modern dengan Vite

3.1. Instalasi Dependensi

3.2. Struktur Direktori

3.3. Menjalankan Development Server

4. Instalasi Laravel Breeze (Starter Kit)

4.1. Tambahkan Package Breeze

4.2. Publish & Install

4.3. Compile Asset

4.4. Migrasi Database

5. Menambahkan Sanctum untuk API Authentication

5.1. Instalasi Package Sanctum

5.2. Publish Config & Migration

5.3. Konfigurasi Middleware

5.4. Membuat Route API Contoh

5.5. Menggunakan Token Personal

6. Best Practice Modern

7. Deploy ke Production

1. Prasyarat

2. Instalasi Laravel 11

3. Mengatur Vite

4. Install Laravel Breeze (Blade atau Inertia)

5. Menambahkan Laravel Sanctum untuk API Authentication

Contoh Route API

6. Setup Testing dengan PestPHP (Opsional)

7. Best Practice Modern

8. Deployment (Contoh dengan Docker)

1. Prasyarat

2. Instalasi Laravel 11

3. Setup Vite (Asset Bundler bawaan)

4. Instalasi Laravel Breeze (Starter Kit)

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

6. Menambahkan Livewire (Komponen Interaktif)

7. Environment & Konfigurasi Keamanan

8. Testing & Deployment

9. Best Practice Tambahan

1. Prasyarat

a. PHP & Composer

b. Node.js & npm/Yarn

2. Instalasi Laravel 11

a. Buat proyek baru

b. Masuk ke direktori

3. Konfigurasi Vite (frontend bundler default Laravel 11)

a. Install dependencies

b. Sesuaikan vite.config.ts

c. Build & watch

4. Instalasi Laravel Breeze (authentication starter)

a. Tambahkan package

b. Install scaffold

c. Compile assets

5. Setup Laravel Sanctum (API token & SPA authentication)

a. Install package

b. Publish konfigurasi & migrasi

c. Tambahkan middleware

d. Contoh route API

6. .env & konfigurasi production

a. Cache konfigurasi & route

b. Optimasi autoloader

c. Set APP_ENV=production dan APP_DEBUG=false

7. Best Practice Modern (2026)

b. Sesuaikan `vite.config.ts`