In this video we are going to learn about Creating Admin, Service Provider and Customer Authentication
So lets see how can we create Authentication
so first of all lets install the Jetstream package
Switch that command prompt and execute the command
Now install the Jetstream livewire package
For that just type the command
Alright package has been installed
Now switch to the project
And just go in side the database directory then migration
And from here just open create user table migration
Inside this migrate add a column for user type
This column define the user whether user is Admin or Normal User
Now lets migrate the migration
So switch to the command prompt and for migrating the migration use the command
now lets run the application
So just execute the command
Now switch to the project and just go inside the layouts directory
And from here just open blase.blade.php file
Now here create the menu for logged in user
So first of all lets check here if route has login route
Now check the use is authenticated or not Now here add the admin menu
Now lets check it
So switch to the browser and refresh the page
Now click on register
And lets create three users 1st for admin, 2nd for Service Provider and another for normal user
Admin
admin@surfsidemedia.in
12345678
Service Provider
sprovider@surfsidemedia.in
12345678
Now lets create one user for normal user
Normal User
user@surfsidemedia.in
12345678 Now just open the phpmyadmin
And open the database
Now browse the users table
And here you can see three user now change the user type of admin
And just add here ADM
ADM user type is for Admin user
Now lets create a middleware
So switch to the command prompt
And for creating the middleware execute the command
Now open the app\\http\\Middleware\\AuthAdmin middleware
Now lets open the app\\http\\Middleware\\SproviderAuth Middleware
And paste inside the handle method
Now just open the app\\http\\kernel.php file and inside the the routemiddleware array just add
Now go inside the app\\http\\Providers\\RouteServiceProvider
And here lets create a const variable
Alright
Now lets create livewire component
So switch to command prompt
And for creating livewire component just type the command
Now switch to project and just go inside the app->http->livewire
And just open Admin, SProvider and Customer directory one by one inside the class file add the layout
Now go to the resources directory then views then livewire
and from admin, sprovider and customer directory open the view file and the following code
Now create the route for this component so just open web.php
And here lets create a route for the admin
So here I am going to create a route group for admin, service provider and customer
Alright, all set
So lets check it
So switch to the browser
Click on login
Now enter the customer credential here
And now you can see the customer dashboard
Now lets access the admin dashboard
So in url just add the admin
Now you can see we cannot access the admin dashboard, it redirect me on login page
Now login with admin credentials and you can see the admin dashboard
And if I login with serviceprovider credentials
So in this way you can create admin,serviceprovider and customer authentication for the Home Services project
So lets see how can we create Authentication
so first of all lets install the Jetstream package
Switch that command prompt and execute the command
composer require laravel/Jetstream
Now install the Jetstream livewire package
For that just type the command
php artisan jetstream:install livewire
Alright package has been installed
Now switch to the project
And just go in side the database directory then migration
And from here just open create user table migration
Inside this migrate add a column for user type
public function up()
{
Schema::create('users', function (Blueprint $table) {
$table->id();
$table->string('name');
$table->string('email')->unique();
$table->timestamp('email_verified_at')->nullable();
$table->string('password');
$table->rememberToken();
$table->foreignId('current_team_id')->nullable();
$table->string('profile_photo_path', 2048)->nullable();
$table->string('utype')->default('CST')->comment('ADM for Admin, SVP for Service Provider and CST for Customer');
$table->timestamps();
});
}
This column define the user whether user is Admin or Normal User
Now lets migrate the migration
So switch to the command prompt and for migrating the migration use the command
php artisan migrate
now lets run the application
So just execute the command
php artisan serve
Now switch to the project and just go inside the layouts directory
And from here just open blase.blade.php file
Now here create the menu for logged in user
So first of all lets check here if route has login route
Now check the use is authenticated or not Now here add the admin menu
@if(Route::has('login'))
@auth
@if(Auth::user()->utype==='ADM')
<li class=\"login-form\"> <a href=\"#\" title=\"Register\">My Account (Admin)</a>
<ul class=\"drop-down one-column hover-fade\">
<li><a href=\"{{route('admin.dashboard')}}\">Dasboard</a></li>
<li><a href=\"{{route('logout')}}\" onclick=\"event.preventDefault(); document.getElementById('logout-form').submit();\">Logout</a></li>
</ul>
</li>
@elseif(Auth::user()->utype==='SVP')
<li class=\"login-form\"> <a href=\"#\" title=\"Register\">My Account (S Provider)</a>
<ul class=\"drop-down one-column hover-fade\">
<li><a href=\"{{route('sprovider.dashboard')}}\">Dasboard</a></li>
<li><a href=\"{{route('logout')}}\" onclick=\"event.preventDefault(); document.getElementById('logout-form').submit();\">Logout</a></li>
</ul>
</li>
@else
<li class=\"login-form\"> <a href=\"#\" title=\"Register\">My Account (Customer)</a>
<ul class=\"drop-down one-column hover-fade\">
<li><a href=\"{{route('customer.dashboard')}}\">Dasboard</a></li>
<li><a href=\"{{route('logout')}}\" onclick=\"event.preventDefault(); document.getElementById('logout-form').submit();\">Logout</a></li>
</ul>
</li>
@endif
<form id=\"logout-form\" method=\"POST\" action=\"{{route('logout')}}\" style=\"display: none\">
@csrf
</form>
@else
<li class=\"login-form\"> <a href=\"{{route('register')}}\" title=\"Register\">Register</a></li>
<li class=\"login-form\"> <a href=\"{{route('login')}}\" title=\"Login\">Login</a></li>
@endif
@endif
Now lets check it
So switch to the browser and refresh the page
Now click on register
And lets create three users 1st for admin, 2nd for Service Provider and another for normal user
Admin
admin@surfsidemedia.in
12345678
Service Provider
sprovider@surfsidemedia.in
12345678
Now lets create one user for normal user
Normal User
user@surfsidemedia.in
12345678 Now just open the phpmyadmin
And open the database
Now browse the users table
And here you can see three user now change the user type of admin
And just add here ADM
ADM user type is for Admin user
Now lets create a middleware
So switch to the command prompt
And for creating the middleware execute the command
Php artisan make:middleware AuthAdmin
Php artisan make:middleware AuthSprovider
Now open the app\\http\\Middleware\\AuthAdmin middleware
public function handle(Request $request, Closure $next)
{
if(Auth::user()->utype === 'ADM')
{
return $next($request);
}
else
{
session()->flush();
return redirect()->route('login');
}
}
Now lets open the app\\http\\Middleware\\SproviderAuth Middleware
And paste inside the handle method
public function handle(Request $request, Closure $next)
{
if(Auth::user()->utype === 'SVP')
{
return $next($request);
}
else
{
session()->flush();
return redirect()->route('login');
}
}
Now just open the app\\http\\kernel.php file and inside the the routemiddleware array just add
protected $routeMiddleware = [
'authadmin' => \\App\\Http\\Middleware\\AuthAdmin::class,
'authsprovider' => \\App\\Http\\Middleware\\AuthSprovider::class,
'auth' => \\App\\Http\\Middleware\\Authenticate::class,
'auth.basic' => \\Illuminate\\Auth\\Middleware\\AuthenticateWithBasicAuth::class,
'cache.headers' => \\Illuminate\\Http\\Middleware\\SetCacheHeaders::class,
'can' => \\Illuminate\\Auth\\Middleware\\Authorize::class,
'guest' => \\App\\Http\\Middleware\\RedirectIfAuthenticated::class,
'password.confirm' => \\Illuminate\\Auth\\Middleware\\RequirePassword::class,
'signed' => \\Illuminate\\Routing\\Middleware\\ValidateSignature::class,
'throttle' => \\Illuminate\\Routing\\Middleware\\ThrottleRequests::class,
'verified' => \\Illuminate\\Auth\\Middleware\\EnsureEmailIsVerified::class,
];
Now go inside the app\\http\\Providers\\RouteServiceProvider
And here lets create a const variable
public const HOME = '/';
Alright
Now lets create livewire component
So switch to command prompt
And for creating livewire component just type the command
Php artisan make:livewire Admin/AdminDashboardComponent
Php artisan make:livewire Sprovider/SproviderDashboardComponent
Php artisan make:livewire Customer/CustomerDashboardComponent
Now switch to project and just go inside the app->http->livewire
And just open Admin, SProvider and Customer directory one by one inside the class file add the layout
class AdminDashboardComponent extends Component
{
public function render()
{
return view('livewire.admin.admin-dashboard-component')->layout('layouts.base');
}
}
class SproviderDashboardComponent extends Component
{
public function render()
{
return view('livewire.sprovider.sprovider-dashboard-component')->layout('layouts.base');
}
}
class CustomerDashboardComponent extends Component
{
public function render()
{
return view('livewire.customer.customer-dashboard-component')->layout('layouts.base');
}
}
Now go to the resources directory then views then livewire
and from admin, sprovider and customer directory open the view file and the following code
<div>
<h1>Admin Dashboard</h1>
</div>
<div>
<h1>Service Provider Dashboard</h1>
</div>
<div>
<h1>Customer Dashboard</h1>
</div>
Now create the route for this component so just open web.php
And here lets create a route for the admin
So here I am going to create a route group for admin, service provider and customer
<?php
use App\\Http\\Livewire\\Admin\\AdminDashboardComponent;
use App\\Http\\Livewire\\Customer\\CustomerDashboardComponent;
use App\\Http\\Livewire\\HomeComponent;
use App\\Http\\Livewire\\Sprovider\\SproviderDashboardComponent;
use Illuminate\\Support\\Facades\\Route;
/*
|--------------------------------------------------------------------------
| 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');
// });
Route::get('/',HomeComponent::class)->name('home');
//For Customer
Route::middleware(['auth:sanctum', 'verified'])->group(function(){
Route::get('/customer/dashboard',CustomerDashboardComponent::class)->name('customer.dashboard');
});
//For Service Provider
Route::middleware(['auth:sanctum', 'verified','authsprovider'])->group(function(){
Route::get('/sprovider/dashboard',SproviderDashboardComponent::class)->name('sprovider.dashboard');
});
//For Admin
Route::middleware(['auth:sanctum', 'verified','authadmin'])->group(function(){
Route::get('/admin/dashboard',AdminDashboardComponent::class)->name('admin.dashboard');
});
Alright, all set
So lets check it
So switch to the browser
Click on login
Now enter the customer credential here
And now you can see the customer dashboard
Now lets access the admin dashboard
So in url just add the admin
Now you can see we cannot access the admin dashboard, it redirect me on login page
Now login with admin credentials and you can see the admin dashboard
And if I login with serviceprovider credentials
So in this way you can create admin,serviceprovider and customer authentication for the Home Services project