Pendahuluan
Setelah berhasil melakukan setup dasar di artikel sebelumnya, kini kita akan mempelajari cara mengimplementasikan fungsi Create untuk menambah data produk. Tutorial ini akan mencakup pembuatan controller, form input, dan validasi data.
Langkah 1: Membuat Controller
- Buat ProductController dengan perintah artisan:
php artisan make:controller ProductController --resource- Edit file
app/Http/Controllers/ProductController.php:
namespace App\Http\Controllers;
use App\Models\Product;
use Illuminate\Http\Request;
class ProductController extends Controller
{
public function index()
{
$products = Product::latest()->paginate(10);
return view('products.index', compact('products'));
}
public function create()
{
return view('products.create');
}
public function store(Request $request)
{
$request->validate([
'name' => 'required|max:255',
'description' => 'required',
'price' => 'required|numeric|min:0',
'stock' => 'required|integer|min:0'
]);
Product::create($request->all());
return redirect()->route('products.index')
->with('success', 'Produk berhasil ditambahkan!');
}
}Langkah 2: Menambahkan Routes
Buka file routes/web.php dan tambahkan route berikut:
use App\Http\Controllers\ProductController;
Route::resource('products', ProductController::class);Langkah 3: Membuat Views
- Buat folder
resources/views/products - Buat file
resources/views/products/create.blade.php:
@extends('layouts.app')
@section('content')
<div class="container mx-auto px-4 py-8">
<div class="max-w-2xl mx-auto">
<h1 class="text-2xl font-bold mb-6">Tambah Produk Baru</h1>
@if ($errors->any())
<div class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded mb-4">
<ul>
@foreach ($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div>
@endif
<form action="{{ route('products.store') }}" method="POST">
@csrf
<div class="mb-4">
<label class="block text-gray-700 font-bold mb-2" for="name">
Nama Produk
</label>
<input type="text"
name="name"
id="name"
value="{{ old('name') }}"
class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
required>
</div>
<div class="mb-4">
<label class="block text-gray-700 font-bold mb-2" for="description">
Deskripsi
</label>
<textarea name="description"
id="description"
class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
rows="4"
required>{{ old('description') }}</textarea>
</div>
<div class="mb-4">
<label class="block text-gray-700 font-bold mb-2" for="price">
Harga
</label>
<input type="number"
name="price"
id="price"
value="{{ old('price') }}"
class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
step="0.01"
required>
</div>
<div class="mb-6">
<label class="block text-gray-700 font-bold mb-2" for="stock">
Stok
</label>
<input type="number"
name="stock"
id="stock"
value="{{ old('stock') }}"
class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
required>
</div>
<div class="flex items-center justify-between">
<button type="submit"
class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline">
Simpan Produk
</button>
<a href="{{ route('products.index') }}"
class="text-gray-600 hover:text-gray-800">
Kembali
</a>
</div>
</form>
</div>
</div>
@endsection- Buat file
resources/views/layouts/app.blade.php:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CRUD Laravel 11</title>
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="bg-gray-100">
<nav class="bg-white shadow-lg mb-8">
<div class="container mx-auto px-4">
<div class="flex justify-between h-16">
<div class="flex items-center">
<a href="{{ route('products.index') }}" class="font-bold text-xl">
Laravel CRUD
</a>
</div>
</div>
</div>
</nav>
@yield('content')
</body>
</html>Langkah 4: Menambahkan Flash Messages
- Buat file
resources/views/components/flash-message.blade.php:
@if ($message = Session::get('success'))
<div class="bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded mb-4">
<strong>{{ $message }}</strong>
</div>
@endif- Update
layouts/app.blade.phpuntuk menampilkan flash message:
<!-- Tambahkan setelah nav dan sebelum @yield('content') -->
<div class="container mx-auto px-4">
@include('components.flash-message')
</div>Langkah 5: Pengujian Create Data
- Jalankan server Laravel:
php artisan serve- Buka browser dan akses:
http://localhost:8000/products/createBest Practices dan Tips
1. Validasi Data
- Selalu validasi input user di server-side
- Gunakan rules yang sesuai dengan kebutuhan
- Tambahkan validasi custom jika diperlukan
2. Security
- Pastikan CSRF token ada di setiap form
- Gunakan mass assignment protection dengan $fillable
- Sanitasi input sebelum disimpan ke database
- User Experience
- Tampilkan pesan error yang jelas
- Pertahankan nilai input setelah validasi gagal
- Berikan feedback setelah operasi berhasil
Kesimpulan
Sekarang Anda telah berhasil mengimplementasikan fungsi Create di Laravel 11. Form yang dibuat sudah dilengkapi dengan validasi dan feedback untuk user.
Leave a Reply