Laravel 9 - How to implement Admin LTE in Laravel in english

hello guys and welcome to laravel 9 tutorials so guys in this video we are going to discuss about how can we Implement admin LTE in laravel 9. so first let's discuss what is adminology adminality is basically a theme that is related to admin dashboard or admin panel let's move forward for example you are going to create a fresh project for a client and in any case you will have to implement a front end and the back end for the admin dashboard okay so uh let's say if you are going to create an admin panel from scratch that is going to take some time so in that in those cases we can simply use a use or include animal LTE package in our project so that we can save that time and we will have a structure all we need to do is just copy and paste and edit the let's say packet functionality according to our requirement okay so let's see this is in detail uh while implementing it so let's start I will open this no notepad file right here so first of all in order to implement admin LTE we need to have a fresh larave we need to create a fresh laravel project you can let's say if you are using uh laravel globally you can simply use this command otherwise you will have to go for the this one for this one okay so in my case I have larva globally installed so let's Access gitbash First and let's access hddocs so CD c Zam HT logs okay and I'm going to write laravel new admin lte1 so you guys can create name your project admin LTE in my case I'm going to name it admin LTE 1y because I already have a project with the name admin LTE I use that specific project for Hindi and Urdu lecture so let's hit enter this command is going to take some time for the execution so I'm just going to pause the video okay guys so now we have our fresh laravel project so let's access that CD admin lte1 okay let's move to step number two which says that we need to install laravel's Lara starter for admin LTE and simply for that we can simply use this Command right here step number two so let's do that let's move here get patch paste it hit enter once again this is going to take some time so I'm going to pause the video okay guys so the second command command is done let's move to step number three which says that we need to install a scaffolding for Lara starter so I am going to copy this and also uh while using this command we are going to execute this step number four and five right here as well okay let's move here let's paste this install and now it is going to ask us which type of kit do we need so in my case I'm going to go with the laravel UI you need to select laravel UI in your cases as well for now okay once you have the command you can uh go here and there it's totally up to you okay but in this case we are going to go with laravel UI bootstrap two hit enter it's right here okay now it's it is going to ask us uh let's say which theme do we want to implement so in our case we want admin LTE and for that we need to press 0 and hit enter now this is going to take some time so let's pause this video once again okay guys so it's done now we need to run our wheat server right here using this command npm installed and an npm Run tab which is our step number six so npm install and then npm run depth okay so in order to access our project now I need to access another instance of get bash so let's do that get Bash and let's access our project once again here c d c Zam HD docs and admin lte1 okay now we need to run the migration between uh but in our cases we don't even have the database so let's say if you don't have the database one way is to implement it right here or create the database right here and the other way is right here let's see okay so what I'm going to do is I'm just going to run the migration PHP Artisan migrate it just like that now it is going to ask us we don't have the database with the name admin LT uh so do we want to create it so I will write yes hit enter and the migration is done now I we can simply run our project PHP Artisan so port 8080 okay let me see if our wheat server is running yeah right here okay using the command npm run and then npm run Dev okay so our server is started let's move here and right here so let's move to login it is going to create the auth for us as well okay just in case if you don't know I will you will be able to see so right here we don't have the link for uh let's say register page you can create it on your own it's totally up to you because this is for you guys okay register and right here we can simply create a user so let's do that so see if and let's say email would be all about laravel this one okay let me put a very simple password right here and this one register and let's see let's do the refresh so we are logged in we have our user right here you can see the name let's move here let me show you admin lte1 admin LTE project where I was using that one for the Hindi Auto lecture okay once again if you don't know okay so we have our user in place okay our theme is working fine let me show you some stuff that we have so let's move we can simply click here and navigate to our profile right here we can see users existing users in our application we can have we can see a sample page right here you can write a sample data a actually in in your case you can simply use this theme this is an admin dashboard all you need to do is put some let's say cards Etc tables whatever you need okay so how can we do that so let's see okay I'm just going to show you a very basic example so for that you can simply use color Library HQ admin LTE right here okay I will provide the link in the description of this link okay so right here you need to come uh to this link and you need to download this source code ZIP I already have it so so let me show you let's move to download okay so this is the zip file I already unzipped it right here you can see let's access this one so admin LTE has three version version two one and one two and three sorry for that guys okay so in my case I'm going to use the first one okay if you want to access version 2 you need to access index two okay so this is just for testing so right here you can see so actually guys uh admin LTE right here we have a basic HTML CSS JavaScript right here okay so let's say if you want to use this you need to create each and every file on your own by using this package we are able to create a structure file structure for our admin dashboard if you see right here see this one so you don't need to do anything otherwise you will have to configure this sidebar top bar and main part Etc it's totally up to you so this makes a life easier if you use the package and now we can simply use whatever we need from right here okay so for example let's say for example I need to use the card so how can I get that so let's move to our let's say folder structure for admin LTE and I'm going to open this index file and with the help of sublime so open with Sublime right here okay now I can simply search uh wherever I want to go so for example let's say I want to include these card as I told you that I'm going to show you a very basic example so I want this these cards so let's move to Sublime and I'm going to search for 150 which is right here see okay so 150 we have our cards right here you can see and all of these cards are inside this row so I can simply copy this row okay copy and where is it ending yeah right here this one copy now I can simply copy so in our case in our package case we are using home blade so let's move to Sublime resources views and home blade right here so in my case uh okay sorry I need to First access the admin LTE one okay so let me close this one admin open folder hddocs this one is related to admin LTE as I told you or Hindi Urdu lecture sorry for that guys okay so adminaldi let's close this one okay I need to access this index file once again so open with Sublime okay so I I already have copied the code so I can simply move to views and home blade right here so in our case I don't need this raw and this column okay okay and I don't need this just like that and okay that's fine okay so right here I can simply put my cards okay with the rows because I I already copied the rows as well so let's view this in action and right here you can see the result so let's say for example you want to implement these cards inside this card you can also do that let me show you okay so we are not able to align this properly because of these comments okay so just that you know okay so just after the P I want to implement my cards for example so let's do that let's do a refresh and right here you can see okay so it's working like a charm all you need to do is whatever you need from here for example graph or let's say charts or let's say buttons you can simply open it in Sublime and copy and paste just in case if you are going to use the charts please make sure that you are including the relevant JS and CSS file as well so okay so yeah guys that's it from this specific video I hope you guys like this video if you liked it please like subscribe and share thank you take care and yes guys be ready for the next one okay take care

Channel: All About Laravel

Views: 9,150

Keywords: All about laravel, laravel, laravel 9, laravel 9 admin lte, Admin LTE in laravel 9, Laravel 9 Admin LTE v3, Admin LTE v3, laravel for beginners, laravel 9 tutorials, laravel 9 Admin dashboard, laravel tutorials, Google recaptcha v3, Admin LTE v3 in laravel, AdminLTE in laravel, Admin LTE v3 in laravel 9, laravel tutorials in english, laravel 9 tutorials in english, AdminLTE v3, programming, crud, Admin LTE, php laravel, php, laravel in urdu, laravel in hindi, admin dashboard

Id: cw9b88C2iJ8

Length: 10min 47sec (647 seconds)

Published: Tue Dec 13 2022