3 Ways to Create a React Bootstrap Navigation Bar in Gatsby JS // Gatsby JS Tutorial

Leverage React Bootstrap and setup 3 navigations in Gatsby. We will leverage both React Bootstrap and vanilla (get) bootstrap as we have you use Gatsby's Link component.

In this video, you'll explore how to setup your navigation with the text on the left, the right and below the logo in the center of the design. In each design, attention is paid to the responsive design when it gets to the mobile framework.

Download the Source Code:

New to React Bootstrap? Here's how to install it:

Table of Contents:
00:00 Introduction
00:46 Setup
01:32 Establishing a Container & bringing in a logo
03:49 Setting up the navigation on the left
09:41 Setting up the navigation on the right
12:07 Centering the navigation (including on mobile)
21:09 In Conclusion

Thanks!
Haydn

- - - - - -

📈 Join my newsletter:

🧵 Find me on Threads:

⤵ Download ALL of my source codes & courses
Introducing ADWC PRO

- - - - - -