Pular para o conteúdo principal

Aula 4: Criar um Menu para Aplicação em Ruby on Rails

# Criar uma menu de navegação para a página inicial 


Abrir o projeto no programa Sublime 3

 
- Criar no projeto uma nova pasta /app/views/shared/
- Criar um novo arquivo /app/views/shared/_navbar.html.erb 
Acessar a página e copiar o código abaixo neste arquivo _navbar.html.erb:
   <!-- Static navbar -->
    <nav class="navbar navbar-default navbar-static-top">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#">Project name</a>
        </div>
        <div id="navbar" class="navbar-collapse collapse">
          <ul class="nav navbar-nav">
            <li class="active"><a href="#">Home</a></li>
            <li><a href="#about">About</a></li>
            <li><a href="#contact">Contact</a></li>
            <li class="dropdown">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
              <ul class="dropdown-menu">
                <li><a href="#">Action</a></li>
                <li><a href="#">Another action</a></li>
                <li><a href="#">Something else here</a></li>
                <li role="separator" class="divider"></li>
                <li class="dropdown-header">Nav header</li>
                <li><a href="#">Separated link</a></li>
                <li><a href="#">One more separated link</a></li>
              </ul>
            </li>
          </ul>
          <ul class="nav navbar-nav navbar-right">
            <li><a href="../navbar/">Default</a></li>
            <li class="active"><a href="./">Static top<span class="sr-only">(current)</span></a></li>
            <li><a href="../navbar-fixed-top/">Fixed top</a></li>
          </ul>
        </div><!--/.nav-collapse -->
      </div>
    </nav>

## Alterar o arquivo app/views/layouts/application.html.erb:

 
 ...  
 <body>
    <%= render 'shared/navbar' %> 
    <p class="notice"><%= notice %></p> 
    <p class="alert"><%= alert %></p>       
    <div class="container">
       <%= yield %>
    </div>
 </body>
</html>
 
Salvar o arquivo 

#Iniciar o servidor

C:\Projetos\computacaonapratica>rails s
=> Booting WEBrick => Rails 4.2.8 application starting in development on http://localhost:3000 => Run `rails server -h` for more startup options => Ctrl-C to shutdown server [2017-09-13 05:16:16] INFO WEBrick 1.3.1 [2017-09-13 05:16:16] INFO ruby 2.2.6 (2016-11-15) [x64-mingw32] [2017-09-13 05:16:16] INFO WEBrick::HTTPServer#start: pid=18536 port=3000
 
Abrir o navegador em http://localhost:3000/home/


# Alterar o menu de navegação

 
Abrir o arquivo /app/views/shared/_navbar.html.erb
 
<!-- Static navbar -->
  <nav class="navbar navbar-default navbar-static-top">
    <div class="container">
      <div class="navbar-header">
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
          <span class="sr-only">Toggle navigation</span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="#">Computação na Prática</a>
     </div>
     <div id="navbar" class="navbar-collapse collapse">
      <ul class="nav navbar-nav navbar-right">
        <% if (!user_signed_in?) %>
          <li><%= link_to "Login", new_user_session_path %> </li>
          <li><%= link_to "Cadastrar", new_user_registration_path %> </li>
        <% else %>
          <li class="dropdown">
            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
              <%= current_user.email %> <span class="caret"></span></a>
            <ul class="dropdown-menu">
              <li><a href="#">Gerenciar cursos</a></li>
              <li><a href="#">Gerenciar reservas</a></li>
              <li><a href="#">Suas reservas</a></li>
              <li><a href="#">Seus cursos</a></li>
              <li role="separator" class="divider"></li>
              <li><%= link_to "Alterar Perfil", edit_user_registration_path %></li>
              <li><%= link_to "Sair", destroy_user_session_path, method: :delete %></li>
            </ul>
          </li>
        <% end %>
        </ul>
        <ul class="nav navbar-nav navbar-right">
          <li><a href="#">Pesquisa</a></li>
          <li class="active"><a href="#">Cursos</a></li>
          <li><a href="#">Notícias</a></li>
        </ul>
      </div><!--/.nav-collapse -->
    </div>
  </nav> 
 


Atualizar a página no navegador em http://localhost:3000/home/ para ver as mudanças.

 #Parar o servidor
Ctrl + c 
Started GET "/" for ::1 at 2017-09-13 05:17:29 -0300 Processing by Rails::WelcomeController#index as HTML Rendered C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/railties-4.2.8/lib/rails/templates/rails/welcome/index.html.erb (25.7ms) Completed 200 OK in 272ms (Views: 250.5ms | ActiveRecord: 0.0ms) [2017-09-13 05:19:46] INFO going to shutdown ... [2017-09-13 05:19:46] INFO WEBrick::HTTPServer#start done. Exiting Deseja finalizar o arquivo em lotes (S/N)? S C:\Projetos\computacaonapratica>

Comentários

Postagens mais visitadas deste blog

Ruby on Rails - Mudanças entre o Rails 4 e o Rails 5

Para você que é iniciante no framework Ruby on Rails, pode ficar confuso ao ver que em diferentes tutoriais, dependendo da versão do Rails instalada, que os comandos para a criação da aplicação não serão os mesmos.

Isso porque o Rails 5 tem novos comandos que fazem a mesma coisa feita no Rails 4.

Alguns exemplos:


Após a criação de uma "migrate" é necessário gravar ela no banco de dados, então será necessário executar o comando abaixo:
Rails 4
$ rake db:migrateRails 5
$ rails db:migrate
Para atualizar as rotas da aplicação, depois que é feita alguma modificação no arquivo routes.rb, então será necessário executar o comando abaixo:
Rails 4
$ rake routesRails 5
$ rails routes
Para que não haja muita confusão para os novos programadores Rails, há uma convensão de que no Rails 5 é possível utilizar os comandos iniciando Rake ou com Rails, vai funcionar corretamente.

Se você já programa para Rails 4, os comandos que já aprendeu irão funcionar no Rails 5. Mas, se você é novo na área,…

Onde implementar um novo método ou variável?

Como sabemos, o framework  Ruby on Rails é baseado na arquitetura MVC. Desta forma, as principais pastas do projeto abaixo do nível /app são:
assets: onde ficam os CSS, JavaScripts e Imagens da aplicação.models: onde ficam os objetos da aplicação, geralmente representam uma tabela do Banco de Dados ou um Relacionamento entre tabelas. O nome dos arquivos geralmente estão no padrão "<nome_da_tabela>.rb" controllers: onde ficam as classes de controle, que permitem que os objetos (model) acessem a camada de apresentação (view). 
O nome dos arquivos geralmente estão no padrão "<nome_da_tabela>s_controller.rb"Observe que o nome da tabela deve ser no plural.views: onde ficam as páginas html da aplicação.O nome dos arquivos geralmente estão no padrão "<metodo_do_controlador>".html.erb Desta forma, o programador tem que saber onde irá criar novos métodos na aplicação, de forma que eles fiquem visíveis na camada de apresentação (View).


Quando for n…

Ruby on Rails - Por que é tão simples?

Ruby on Rails é uma framework para construção de aplicações WEB, que utiliza a linguagem Ruby. Ruby é uma linguagem interpretada orientada a objetos, que se comporta como se fosse uma linguagem funcional. E o que isto significa, em palavras menos técnicas, significa menos linhas de código, menos configuração, menos dependência com a IDE (aplicação para compilar o código). Por isso ela é tão simples!!

O framework Ruby on Rails tem a vantagem de já definir a arquitetura da aplicação no momento da criação do projeto. Parece mágica, sim, é muito simples e rápido, com apenas um comando para criação do projeto, você já tem toda a arquitetura pronta.

A arquitetura criada pelo framework é baseada no Padrão de Projeto (Design Pattern) MVC, para quem não conhece MVC, se você não sabe do que estou falando vale a pena dar uma lida aqui (mais completo) ou se você já ouviu falar veja este vídeo abaixo: