Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
- Building a Navbar 9:17
- Using Jumbotron to Showcase Key Content 2:48
- Buttons and Button Groups 5:22
- Inline Navs and Dropdown Buttons 5:09
- Displaying Content with Cards 7:32
- Building the Schedule with a List Group 6:26
- Displaying a Modal Window 5:02
- Using ScrollSpy to Highlight Nav Links 4:22
- Bootstrap Components Review 6 questions

- 2x 2x
- 1.75x 1.75x
- 1.5x 1.5x
- 1.25x 1.25x
- 1.1x 1.1x
- 1x 1x
- 0.75x 0.75x
- 0.5x 0.5x
Bootstrap simplifies many complex or time-consuming tasks like building navigations, from controls, drop-down menus and more. In this video, we'll continue building the Full Stack Conf site using Bootstrap's UI components, starting with the navbar.
Code snippet
<!-- navbar -->
<nav class="navbar navbar-expand-lg navbar-dark bg-primary fixed-top">
<div class="container">
<a class="navbar-brand order-1 mr-0" href="https://www.teamtreehouse.com" target="_blank">Presented by Treehouse</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<a class="nav-item nav-link" href="#home">Home <span class="sr-only">(current)</span></a>
<a class="nav-item nav-link" href="#about">About</a>
<a class="nav-item nav-link" href="#speakers">Speakers</a>
<a class="nav-item nav-link" href="#schedule">Schedule</a>
</div>
</div>
</div>
</nav><!-- /navbar -->
Resources
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up