A classe 'nav' no bootstrap foi feita para implementar menus ou barras de navegação, que nada mais é que aquele conjunto de links no topo da página ou na lateral apontando para diversas outras páginas ou funcionalidadesdo site.

Tamanhos das barras de navegação:

As barras de navegação seguem o padrão bootstrap de tamanhos:
.navbar-xl : Extra-Grande(computadores)
.navbar-lg : Grande(computadores e tablets)
.navbar-md : Média (tablets e celulares)
.navbar-sm : Pequena (celulares)

Importante : xl, lg, md e sm não é o tamanho da barra, das letras, nada tem com a exibição do objeto em si mas sim quando o menu deverá ser quebrado por não caber na tela.
Quando a largura da tela for menor que a do especificado na tag (xl,lg,md ou sm) os itens poderão ser jogados na linha de baixo ou mesmo serem trocados pelo menu hamburguer dependendo do que se determina para que o bootstrap faça.

Por definição uma Barra de navegação (NavBar) é composta por alguns links clicáveis. Por esse motivo abaixo sempre que o NavBar veio só com texto eu coloquei eles dentro de um link para que fossem um link clicável.

Navbar com itens detexto apenas

Coloquei o texto dentro de um link para que ficasse um link clicável e uma classe '.text-decoration-none' para que não exibisse o traço embaixo do texto.

---

Navbar estilo Link

Na barra de navegação acima cada item é um link clicável.

---

Navbar estilo Header

Neste caso o NavBar é exibido no seu estilo particular do Header H1 e coloquei os itens dentro de links para que ficassem clicáveis.

---

Navbar com itens de imagens

Este tipo de menu fica muito bom quando se tem imagens para cada item e as imagens dizem tudo, ou seja, não precisam de texto como legenda.
Na barra de navegação acima cada item de imagem é um link clicável.

---

Navbar com imagens e legendas

É um tipo de menu que fica bem com poucos itens. Todos os ítens são links clicáveis.

---

Navbar com item ativo - Com List Itens

Neste caso o NavBar tem um de seus itens destacados como sendo o ativo. Cada item do menu é clicável e ao contrair a largura da tela ele exibe o Hamburger menu.

---

Navbar com item ativo sem a lista de itens

É exibido exatamente como o anterior mas seu código é muito diferente do anterior. Muito mais limpo e claro sem os list itens.

---

NavBar Adicionando Drop-Down aos itens do menu

---

NavBar Controles de pesquisa típica 1

---

NavBar Controles de pesquisa típica 2

---

NavBar Agrupando itens do menu com um item pré-definido no bootstrap

Determinando a posição dos itens do NavBar

---

NavBar Default - à esquerda

Este aqui é o único navbar que aparece no lugar que é definido.

---

NavBar Fixo no topo

Exibir Esconder

Este NavBar é exibido no topo e conforme você rola a tela ele fica fixo no topo da tela.

---

NavBar Fixado no rodapé

Exibir Esconder

Este NavBar é exibido no rodapé da página e conforme você rola a tela ele fica fixo no rodapé da tela.

---

NavBar Colado ao topo (Sticky top)

Exibir Esconder

Esse aqui é muito legal, a NavBar é exibida na sua devida posição na tela mas quando a tela é rolada para cima e a NavBar deveria sumir ela não some, fica 'colada' ao topo da tela.

---

Navbar - Default

Navbar XL

navbar-lg:

NavBar Expand md

NavBar Expand sm

Tipos de Navbar no BootStrap:

---

---

---

---

No header com o texto 'Página responsiva usando BootstrapPage' utilizei :
1-Uma nav :
<nav class="navbar navbar-light mb-4" style="background-color:aqua">
com os parâmetros:
class="navbar : avisa o bootstrap que o elemento a ser formatado é um navbar.
navbar-light : é o estilo do navbar a ser empregado:
com a cor azul clara (navbar-light) e uma margem inferior de 4. Ficou assim:

---

<nav class="navbar navbar-expand-lg navbar-light bg-light">
  <a class="navbar-brand" href="#">Navbar</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>

  <div class="collapse navbar-collapse" id="navbarSupportedContent">
    <ul class="navbar-nav mr-auto">
      <li class="nav-item active">
        <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Link</a>
      </li>
      <li class="nav-item dropdown">
        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
          Dropdown
        </a>
        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
          <a class="dropdown-item" href="#">Action</a>
          <a class="dropdown-item" href="#">Another action</a>
          <div class="dropdown-divider"></div>
          <a class="dropdown-item" href="#">Something else here</a>
        </div>
      </li>
      <li class="nav-item">
        <a class="nav-link disabled" href="#">Disabled</a>
      </li>
    </ul>
    <form class="form-inline my-2 my-lg-0">
      <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
      <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
    </form>
  </div>
</nav>

---

Visite a página do Boostrap sobre o componente NavBar. É muito boa.