Hello, dear friends. In this video, we will continue working on our project by integrating the AdminLTE template. Let's get started. in the previous video, we downloaded AdminLTE template. In our project, we will use this template structure. To begin, you can find a blank page or a layout page in any template. There is a blank page in AdminLTE. Open the Examples folder in the Pages folder. And look, we have a blank page. Use any browser to run. Look, we have menu items and we'll put our operations in the content area. Now, I will open this page with Notepad++. If you don't have Notepad++, this is a terrible decision. This application offers numerous benefits and is very easy to use, so I recommend you get it open any browser and search 'notepad++' in Google. Go to the 'notepad-plus-plus.org.' You can download and install it easily.

Now, we will use these HTML codes in our project. As you can see, there are many CSS files. And under the page, you can see JavaScript files as well. We will add these files to our project. Open your project. In the Resources folder, I will create a new folder and name it static. Add another folder called templates. We will define our HTML pages in the Templates folder. But first, we need the CSS and JavaScript folders. Add a new folder to the static folder and name it css. Now, add another folder and name it js. Done. First, I will start with the admin layout. Actually, if you want we, can define a layout and create the authorization operations with if-else statements, but I will create these in a microservice projects. So, for now, I will use two different layout pages. In the Templates folder, add a new HTML file and name it AdminLayout. Now, return to Notepad, select all, and copy. Now, paste them into the AdminLayout template. Done.

We must now add CSS and JavaScript files to our projects one at a time. First, find the all.min.css in the folder and copy. Paste into the CSS folder. Now, we have to adjust the all.min.css file's path. Done. Now, let's continue with Admin LTE. Done. CSS files are finished for now, but in the following videos, we may add other CSS files like DataTable CSS. Let's continue with JavaScript files. First, find jquery. Copy and paste into the js folder. Now, change the folder. Now, I will make the others quickly. Done. Let's change the menu items now. Each li tag represents a menu item. I'll delete them all except for one.

Now, in the admin layout, I need two menu items. These are the product and bill. Let's start with the product. This will be the product. In action, we will not use href. Instead, we will use th href tag to give these objects action. And on each page, we will return to this page and change the action path. Now, in the sub menu, the first one will be the product list. The second one will be add product. Done. Now, copy this li. We will now change the values for the bills operations. Menu text will be bill. The first option in the sub menu will be approve waiting for bill list. We will show the approved waiting bills on this page. The second one will be the old bill list. Done. Let's take a break now. In the following video, we will continue integrating the template for our project. So, I'll see you in the following video.