From the course: Mastering Nest.js: Build Scalable Applications with Mastery in Nest.js Framework

Unlock this course with a free trial

Join today to access over 25,200 courses taught by industry experts.

Creating navbar with "includes"

Creating navbar with "includes" - Nest.js Tutorial

From the course: Mastering Nest.js: Build Scalable Applications with Mastery in Nest.js Framework

Start my 1-month free trial Buy for my team

Creating navbar with "includes"

“

Now, it's time to create the navbar, which is going to be a common DOM element. So it will be a part of the homepage as well as other pages like ad product. So since it is going to be repeated, we will create it as an include. So in the views folder, let's create another folder named includes and a file navbar.ejs. Now let's write the code. I'll define the nav tag first and give it the bootstrap classes. I'll say navbar, navbar-expand-lg and bg-dark. And inside we'll have the container div with class container-fluid. Now this division will have another division which will contain the unordered list of the menu items. So first let me define the classes, I'll say div class is equal to collapse, navbar collapse, d flex, justify content between. Then I'll give the ul tag with class navbar nav, and the li giving the class as nav item. And finally, the anchor tag inside the li. I'll set the href to slash that is root route and classes as nav link, text light, fs4 that is font size and px3…

Contents