Exemplo em Rails – parte 1

Rails-1_Agenda_Mequetrefe

Faz algum tempo que eu pretendia fazer isto mas só agora consegui colocar em prática, ou seja, escrever um pequeno programa de exemplo em Ruby on Rails — ou só Rails como é mais conhecido. Claro que o exemplo é bem idiota, porém suficientemente funcional, uma agenda de contatos que eu resolvi carinhosamente chamar de “Agenda Mequetrefe”! 😀

Papo rápido sobre MVC

Assim como diversos outros frameworks, o Rails trabalha com a arquitetura MVC — de Modelo–Visão-Controlador ou Model–View–Controller — que consiste, de acordo com a Wikipedia, em:

(…) um padrão de arquitetura de software (design pattern) que separa a representação da informação da interação do usuário com ele. O modelo (model) consiste nos dados da aplicação, regras de negócios, lógica e funções. Uma visão (view) pode ser qualquer saída de representação dos dados, como uma tabela ou um diagrama. (…) O controlador (controller) faz a mediação da entrada, convertendo-a em comandos para o modelo ou visão.

Especificamente no caso do Rails é bom incluir um quarto elemento ao conjunto, as rotas (routes), que se encarregam identificar as URL e direcionar as requisições para o controlador específico.

Juntando todos eles a “pilha” de uma aplicação seria algo mais ou menos assim¹:

Rails-1_modelo_MVCR

(¹) Esta ilustração não é original, ela foi baseada em uma apresentada no curso Rails for Zombies Redux da Codeschool.

Criando uma nova aplicação

Para criar uma nova aplicação em Rails use:

$ rails new AM
      create  
      ...
         run  bundle install --local

Ele montará a estrutura de diretórios, criará os demais arquivos e resolverá eventuais dependências² da aplicação.

(²) No caso da necessidade de se acrescentar alguma extensão ao Ruby,

Iniciando um repositório Git

Como isto aqui é um projeto de software também é bom também fazer:

$ cd AM
$ git init
Initialized empty Git repository in /home/.../AM/.git/
$ git add .
$ git commit -m "initial release"
[master (root-commit) c887efc] initial release
 56 files changed, 900 insertions(+)
...

Para deixar o git monitorando as alterações no código.

Criando o controlador

Seguindo as convenções do Rails vou criar um controlador chamado “home” e uma ação chamada “index”. Esta servirá como página inicial da aplicação:

$ rails generate controller home index
      create  app/controllers/home_controller.rb
       route  get 'home/index'
      invoke  erb
      create    app/views/home
      create    app/views/home/index.html.erb
         ...
      invoke  assets
      invoke    coffee
      create      app/assets/javascripts/home.js.coffee
      invoke    scss
      create      app/assets/stylesheets/home.css.scss

O Rails criará os arquivos do controlador, da visão e automaticamente o acrescentará na lista de rotas (grifado em laranja). Porém modificarei a entrada no arquivo “./config/routes.rb” de:

 get 'home/index'

para:

root 'home#index'

Tornando-o assim a página principal (e padrão) da aplicação.

Customizando a visão

A estrutura da visão são criados juntamente com os do controlador e consistem de arquivos embeded ruby — tal qual os utilizados no Chef — e servem como modelos para a geração de arquivos HTML. Tudo o que estiver entre <% … %> será interpretado como código em Ruby.

Bootstrap

Para grande parte do HTML e CSS recorrerei ao Bootstrap. E já que ele será utilizado em todas as páginas acrescentarei as linhas necessárias para habilitá-lo diretamente na sessão <HEAD>…</HEAD> do “app/views/layouts/application.html.erb”, que serve a todas as páginas da aplicação (veja mais abaixo).

Esboçando o HTML

Uma pausa para pensar o leiaute da aplicação, que tal algo assim?

Rails-1_mockup

Um tanto simples, não é? Mas é o suficiente por enquanto. 🙂

O trecho em HTML relativo à barra de navegação ficará no arquivo “./app/views/home/_navigation.html.erb”:

Também aproveitarei para criar um rodapé chamado “./app/views/home/_footer.html.erb” mas que por enquanto ficará vazio, daí basta apenas um:

$ touch ./app/views/home/_footer.html.erb

Eles serão adicionados entre o <%= yield %> que indica onde o HTML produzido pelas demais visões será inserido. O aspecto final do arquivo “app/views/layouts/application.html.erb” será este:

É uma convenção do Rails que os arquivos iniciados com “_” são tratados como pedaços — ou partials — e não como modelos — ou templates — porém ao utilizá-los, deve-se omitir o caractere inicial.

Lista de contatos

Por último a visão propriamente dita, o código que formata a lista de contatos em “./app/views/home/index.html.erb”:

Os t(‘ . . . ‘) contornando as mensagens fazem parte do sistema de localização do Rails e mais abaixo há uma explicação sobre ele.

Ajustando o CSS

E para terminar uma alteração no arquivo “./app/views/assets/stylesheets/application.css” para remover o canto arredondado que a classe navbar parece vir por padrão na versão do Bootstrap que estou usando:

.navbar {
    border-radius: 0;
}

Mas antes de testar alguma coisa ainda falta criar o modelo dos dados.

Criando o modelo

Para começar um banco bem simples para conter o “nome” e o “apelido” de cada contato da agenda:

rails g scaffold contact name:string nickname:string
      invoke  active_record
         ...

Mas não era modelo? Bem, há três formas de se criar o modelo em Rails, a mais simples — rails g model — se encarregará de criar a(s) classe(s) necessárias, outra — rails g resource — também criará também a estrutura de testes e, por último — rails g scaffold — criará classe, estrutura de testes e todo o resto necessário.

Creio que ficou claro que “g” é um apelido para “generate”, correto? 🙂

Por padrão o Rails usa o SQLite3 mas outros gerenciadores de banco de dados são suportados e basta configurar corretamente o “./Gemfile” para utilizá-los.

Para que o modelo criado/alterado passe a existir na base de dados use:

$ rake db:migrate

Mais um explicação, em Rails o modelo é gerenciado pelo Active Record e ele funciona como uma camada de abstração ao banco de dados, ou seja, você acessa os dados através de métodos do Active Record e tratando-os como se um objeto do Ruby eles fossem.

Um exemplo de como isto funciona pode ser obtido com ajuda do console do Rails:

$ rails console
Loading development environment (Rails 4.1.10)
irb(main):002:0> Contact.count()
   (0.1ms)  SELECT COUNT(*) FROM "contacts"
=> 0
irb(main):003:0> Contact.create name:'Giovanni dos Reis Nunes'
   (0.2ms)  begin transaction
  SQL (0.6ms)  INSERT INTO "contacts" ("created_at", "name", ...
   (223.5ms)  commit transaction
=> #<Contact id: 1, name: "Giovanni dos Reis Nunes", ...
irb(main):004:0> Contact.count()
   (0.3ms)  SELECT COUNT(*) FROM "contacts"
=> 1

Claro, a sintaxe no console é um pouco diferente daquela utilizada diretamente no código mas o objetivo aqui é exemplificar a “tradução” para comandos em SQL e, claro, aproveitar para popular minimamente a base de dados.

Ligando modelo e controlador

Uma pequena mexida no controlador para que ele saiba o que pegar do modelo:

class HomeController < ApplicationController
  def index
    @contacts = Contact.order(name: :desc).all
  end
end

Esta variável, a @contacts — o sinal de arroba indica que ela é uma variável da instância — se encarregará de consultar, via ActiveRecord, todos os registros em “Contact” e ordenar o resultado por nome.

Primeiro teste

Agora já é possível subir o servidor HTTP do Rails:

$ rails server
=> Booting WEBrick
...
=> Ctrl-C to shutdown server

E acessando 127.0.0.1:3000 visualizar como está a aplicação:

Rails-1_application

Funcionando corretamente, ou quase. Falta corrigir a parte das mensagens. 🙂

Localização

Para que a aplicação possa se apresente corretamente em português brasileiro são necessárias duas modificações. A primeira, claro, é contar ao Rails qual o idioma padrão.

Por enquanto eu farei editando o arquivo “./config/applications.rb”:

require File.expand_path('../boot', __FILE__)

require 'rails/all'

Bundler.require(*Rails.groups)

module AM
  class Application < Rails::Application
    config.i18n.default_locale = :pt_BR
  end
end

E, mais claro ainda, criar o arquivo relacionando o texto que aparece nas sequências dentro dos t(‘. . .’) no arquivo “./config/locales/pt_BR.yml”:

O resto fica por conta do Rails:

Rails-1_application_pt-BR

Legal, não é?

Encerrando esta parte

Por enquanto é só mas antes de encerrar interrompa o servidor HTTP do Rails e faça:

$ git add .
$ git commit -m "end of first part"
[master 681063f] end of first part
 34 files changed, 469 insertions(+), 25 deletions(-)
...

Na segunda parte será a vez de implementar a inserção de novos contatos na “agendinha”. Até!

Anúncios

5 comentários sobre “Exemplo em Rails – parte 1

  1. Pingback: Exemplo de programação em Ruby on Rails: agenda de contatos – parte 1 - Peguei do

  2. Pingback: 100ª publicação! | giovannireisnunes

  3. Pingback: Exemplo em Rails – parte 2 | giovannireisnunes

  4. Pingback: Aplicação web em Python e Bottle – parte 3 | giovannireisnunes

  5. Pingback: Testando RPi1/2/3 em um Power Bank | giovannireisnunes

Deixe um comentário

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s