Membuat Crud Category Laravel. Ini adalah lanjutan dari tutorial sebelumnya tentang membuat aplikasi blog menggunakan laravel 9. Nah kali ini kita masuk ke tahapan untuk pembuatan CRUD Category, Crud adalah singkatan dari Create, Read, Update dan Delete. di tutorial ini kita akan membuat fungsi tersebut sehingga Aplikasi blog kita bisa berfungsi.
Jika kamu baru saja terdampar di artikel ini dan tertarik untuk mengikuti tutorialnya, silahkan kamu buka artikel sebelumnya atau kamu juga bisa baca dari awal kamu bisa klik disini sehingga kamu bisa mengikuti secara bertahap tutorial pembuatan aplikasi blog dengan laravel ini.
Oke kita langsung bahas aja untuk proses pembuatan crud category ini
Membuat Table Category
Pertama kita buat dulu table categorynya, kita bisa memanfaatkan fitur migration yang ada di laravel. Silahkan buka projek laravel_blog di vscode kemudian buka terminal lalu ketik perintah di bawah ini
php artisan make:migration create_categories_tableKemudian tekan enter, sekarang kalian buka folder database/migration lalu buka file migration categories yang baru saja di buat. kemudian tambahkan 2 baris code di bawah ini pada bagian public function up()
$table->string('slug');
$table->string('name');
Jika sudah jalan kan perintah migration di terminal
php artisan migrateSekarang aktifkan xampp kemudian cek di database phpmyadmin apakah sudah masuk table categoriesnya, jika sudah berarti kita sudah berhasil membuat table categories.
Sekarang kita lanjut untuk membuat model dan controller.
Membuat Model dan controller Category
Oke sekarang kita akan buat dulu model categorynya silahakan kembali lagi ke kodingan lalu ketik perintah ini di terminal
php artisan make:model CategoryJika sudah silahkan cek di folder app/models/ maka di dalam folder model akan ada file Category.php silahkan buka file Category.php kemudian tambahkan kode berikut ini di bawah kode use HasFactory;
protected $tabe = ("categories");
protected $fillable = [
'slug',
'name'
];Selanjutnya kita akan buat controller category silahkan balik lagi ke terminal kemudian ketik perintah
php artisan make:controller Admin/CategoryControllerlalu buat juga request silahkan ketik perintah di bawah ini
php artisan make:request CategoryFormRequestSekarang buka file CategoryFormRequest .php lalu ubah code yang ada di public fuction authorize() ubah code return false menjadi true lalu di bagian rules tambahkan kode berikut ini di dalam return :
'name' => ['required', 'string', 'unique:categories']Untuk kode lengkapnya seperti di bawah ini
<?php
namespace App\Http\Requests;
use Illuminate\Foundation\Http\FormRequest;
class CategoryFormRequest extends FormRequest
{
/**
* Determine if the user is authorized to make this request.
*
* @return bool
*/
public function authorize()
{
return true;
}
/**
* Get the validation rules that apply to the request.
*
* @return array<string, mixed>
*/
public function rules()
{
return [
'name' => ['required','string', 'unique:categories']
];
}
}
Oke kalau sudah silahkan Save kemudian kita balik lagi ke CategoryController.php lalu ubah semua code menjadi seperti di bawah ini :
<?php
namespace App\Http\Controllers\Admin;
use App\Http\Controllers\Controller;
use App\Http\Requests\CategoryFormRequest;
use App\Models\Category;
use Illuminate\Http\Request;
use Illuminate\Support\Str;
class CategoryController extends Controller
{
public function index()
{
$categories = Category::orderBy('id', 'desc')->paginate(10);
return view('admin.category.index', compact('categories'));
}
public function create()
{
return view('admin.category.create');
}
public function store(CategoryFormRequest $request)
{
$validatedData = $request->validated();
$slug_request = Str::slug($validatedData['name']);
$code = random_int(1000, 9999);
$slug = $code . '-' . $slug_request;
$category = new Category;
$category->slug = $slug;
$category->name = $validatedData['name'];
$category->save();
return redirect('admin/categories')->with('message', 'Category Has Added');
}
public function edit(Category $category)
{
return view('admin.category.edit', compact('category'));
}
public function update(CategoryFormRequest $request, $category)
{
$validatedData = $request->validated();
$category = Category::findOrFail($category);
$category->name = $validatedData['name'];
$category->update();
return redirect('admin/categories')->with('message', 'Category update Succesfully');
}
public function destroy(int $category_id)
{
$category = Category::findOrFail($category_id);
$category->delete();
return redirect()->back()->with('message', 'category has ben Deleted!');
}
}
Membuat File View
Sekarang kita akan membuat file view untuk menampilkan halaman category mulai dari halaman index, create, edit dan delete. Silahkan buka folder resources/views/ lalu buat folder baru dengan nama admin lalu di dalam folder admin buat folder baru dengan nama category kemudian buat file berikut di dalam folder category :
- index.blade.php
- create.blade.php
- edit.blade.php
- delete.blade.php
@extends('layouts.app')
@section('content')
<div class="container">
<div class="card shadow-sm">
@if (session('message'))
<div class="alert alert-success">
{{session('message')}}
</div>
@endif
<div class="card-header bg-white d-flex justify-content-between align-items-start">
<h4>Category</h4>
<a href="{{url('admin/categories/create')}}" class="btn btn-primary">Add Category</a>
</div>
<table class="table table-striped">
<thead>
<tr>
<th width="10%">No</th>
<th>Name</th>
<th>Slug</th>
<th width="15%">Action</th>
</tr>
</thead>
<tbody>
@forelse($categories as $i => $data)
<tr>
<th>{{$i+1}}</th>
<td>{{$data->name}}</td>
<td>{{$data->slug}}</td>
<td>
<a href="{{url('admin/categories/edit/' .$data->id)}}" class="btn btn-primary">edit</a>
@include('admin.category.delete')
</td>
</tr>
@empty
<th colspan="4" class="text-center">No Data Available</th>
@endforelse
</tbody>
</table>
<div class="card-body">
{{ $categories->links() }}
</div>
</div>
</div>
@endsectionKemudian buka file create.blade.php lalu copy code di bawah ini
@extends('layouts.app')
@section('content')
<div class="container">
<div class="col-md-6 mx-auto">
<div class="card shadow-sm">
<div class="card-body">
<form action="{{url('admin/categories')}}" method="POST">
@csrf
<div class="mb-3">
<label class="form-label">Category name</label>
<input type="text" name="name" class="form-control @error('name') is-invalid @enderror">
@error('name')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
</div>
<button type="submit" class="btn btn-primary">Save</button>
</form>
</div>
</div>
</div>
</div>
@endsectionSelanjutnya file edit.blade.php copy code ini :
@extends('layouts.app')
@section('content')
<div class="container">
<div class="col-md-6 mx-auto">
<div class="card">
<div class="card-header">
Edit Category
</div>
<div class="card-body">
<form action="{{url('admin/categories/'.$category->id)}}" method="POST">
@csrf
@method('PUT')
<div class="mb-3">
<label class="form-label">Category name</label>
<input type="text" name="name" value="{{$category->name}}"
class="form-control @error('name') is-invalid @enderror">
@error('name')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
</div>
<button type="submit" class="btn btn-primary">Update</button>
</form>
</div>
</div>
</div>
</div>
@endsectionTerakhir file delete.blade.php copy code berikut
<!-- Button trigger modal -->
<button type="button" class="btn btn-danger" data-bs-toggle="modal" data-bs-target="#deleteModal{{$data->id}}">
Hapus
</button>
<!-- Modal -->
<div class="modal fade" id="deleteModal{{$data->id}}" tabindex="-1" aria-labelledby="exampleModalLabel"
aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="exampleModalLabel">Data Category</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
Are You Sure?? You want to delete this Data!!
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<a href="{{url('admin/categories/delete/' .$data->id)}}" class="btn btn-danger">Yes Delete</a>
</div>
</div>
</div>
</div>Kalau Sudah Save semua. Selanjutnya seting routes
Seting Routes
Route atau routing merupakan endpoint url yang fungsinya untuk mengakses setiap fungsi dari controller atau menampilkan halaman lain. kita dapat mengatur routing sesuai kebutuhan misalnya ketika ingin melihat data index, membuat data baru dan lain lain. di laravel ada 4 jenis route yaitu api, channels, console dan web. Sekarang silahkan buka folder routes/web.php lalu tambahkan kode ini di bawah kode Auth::routes();
Route::prefix('admin')->middleware(['auth'])->group(function () {
Route::get('/dashboard', [DashboardController::class, 'index']);
// Category Route
Route::controller(CategoryController::class)->group(function () {
Route::get('/categories', 'index');
Route::get('/categories/create', 'create');
Route::post('/categories', 'store');
Route::get('/categories/edit/{category}', 'edit');
Route::put('/categories/{category}', 'update');
Route::get('/categories/delete/{category_id}', 'destroy');
});
});Kemudian tambahkan juga kode untuk memanggil CategoryController
use App\Http\Controllers\Admin\CategoryController;Untuk Kode Lengkapnya seperti di bawah ini :
<?php
use Illuminate\Support\Facades\Auth;
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\Admin\DashboardController;
use App\Http\Controllers\Admin\CategoryController;
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/
Route::get('/', function () {
return view('welcome');
});
Auth::routes();
Route::prefix('admin')->middleware(['auth'])->group(function () {
Route::get('/dashboard', [DashboardController::class, 'index']);
// Category Route
Route::controller(CategoryController::class)->group(function () {
Route::get('/categories', 'index');
Route::get('/categories/create', 'create');
Route::post('/categories', 'store');
Route::get('/categories/edit/{category}', 'edit');
Route::put('/categories/{category}', 'update');
Route::get('/categories/delete/{category_id}', 'destroy');
});
});
Terakhir seting untuk AppServiceProvider.php silahkan buka folder app/Providers/AppServiceProvider.php pada bagian public function boot() tambahkan kode ini :
Paginator::useBootstrapFive();lalu panggil juga fungsi Paginatornya gunakan code di bawah ini :
use Illuminate\Pagination\Paginator;
Sehingga kode selengkapnya seperti di bawah ini :
<?php
namespace App\Providers;
use Illuminate\Pagination\Paginator;
use Illuminate\Support\ServiceProvider;
class AppServiceProvider extends ServiceProvider
{
/**
* Register any application services.
*
* @return void
*/
public function register()
{
//
}
/**
* Bootstrap any application services.
*
* @return void
*/
public function boot()
{
Paginator::useBootstrapFive();
}
}
Lalu Save Sekarang kita coba untuk mengakses halaman yang sudah kita buat, Aktifkan Apache dan Mysql yang ada di aplikasi xampp kemudian aktifkan juga server laravel dengan mengetik perintah
php artisan serveLalu buka browser dan ketik url localhost:8000/login kemudian login menggunakan email dan password yang sudah di buat. jika sudah berhasil masuk sekarang buka url : localhost:8000/admin/categories lalu create new untuk menambahakan category baru, Silahkan test juga untuk edit dan delete.
Oke sampai disini untuk tutorial membuat CRUD Category, Selanjutnya nanti kita akan bahas untuk membuat menu sehingga bisa lebih mudah untuk mengakses halamannya. Oke jangan lupa untuk subscribe untuk menerima notifikasi artikel terbaru dari edikomputer.com
