In this video we are going to learn about how to create Admin Service Categories Page.
So let see how can we create services Categories page for the Admin.
Now lets create a new livewire component for categories
Switch to the command prompt
And for creating the livewire component
Type the following command and press enter

php artisan make:livewire admin/AdminServiceCategoryComponent

Alright component created now switch to the project And lets create the route for the category component
So go inside the routes directory then open web.php file
Inside the admin middleware group
Lets create the route


Now open the base layout file
So go inside the resources directory then views -> layouts
from here open base.blade.php
Inside this layout file lets find the admin menu
and before the logout link lets create link for the Service category

<li><a href=\"{{route('admin.service_categories')}}\">Service Categories</a></li>

Now lets open the Categories Component Class file and add set the layout

return view('livewire.admin.admin-service-category-component’)->layout('layouts.base');

Now import the WithPagination and use inside the class as following


namespace App\\Http\\Livewire\\Admin;

use App\\Models\\ServiceCategory;
use Livewire\\Component;
use Livewire\\WithPagination;

class AdminServiceCategoryComponent extends Component
use WithPagination;

public function render()
$scategories = ServiceCategory::paginate(10);
return view('livewire.admin.admin-service-category-component',['scategories'=>$scategories])->layout('layouts.base');

Alright now open admin-category-component view file add the following code

nav svg{
height: 20px;
nav .hidden{
display: block !important;
<div class=\"section-title-01 honmob\">
<div class=\"bg_parallax image_02_parallax\"></div>
<div class=\"opacy_bg_02\">
<div class=\"container\">
<h1>Service Categories</h1>
<div class=\"crumbs\">
<li><a href=\"/\">Home</a></li>
<li>Service Categories</li>
<section class=\"content-central\">
<div class=\"content_info\">
<div class=\"paddings-mini\">
<div class=\"container\">
<div class=\"row portfolioContainer\">
<div class=\"col-md-12 profile1\">
<div class=\"panel panel-default\">
<div class=\"panel-heading\">
<div class=\"row\">
<div class=\"col-md-6\">
All Service Categories
<div class=\"col-md-6\">
<a href=\"{{route('admin.add_service_category')}}\" class=\"btn btn-info pull-right\">Add New</a>
<div class=\"panel-body\">
<div class=\"alert alert-success\" role=\"alert\">{{Session::get('message')}}</div>
<table class=\"table table-striped\">
@foreach($scategories as $scategory)
<td><img src=\"{{asset('images/categories')}}/{{$scategory->image}}\" height=\"60\" /> </td>
<a href=\"{{route('admin.services_by_category',['category_slug'=>$scategory->slug])}}\" style=\"margin-right: 10px;\"><i class=\"fa fa-list fa-2x text-info\"></i></a>
<a href=\"{{route('admin.edit_service_category',['category_id'=>$scategory->id])}}\"><i class=\"fa fa-edit fa-2x text-info\"></i></a>
<a href=\"#\" onclick=\"confirm('Are you sure, you want to delete this service category!') || event.stopImmediatePropagation()\" wire:click.prevent=\"deleteServiceCategory({{$scategory->id}})\" style=\"margin-left:10px;\"><i class=\"fa fa-times fa-2x text-danger\"></i></a>

Now its done lets check it
So first of all run the application
Switch to the command prompt and type the command

Php artisan serve

Now switch to the browser and refresh the page
Inside the admin menu you can see here the category link now click on it
Now you see here the categories
So in this way you can create Admin Service Category Page.