Uploaded on

Treinamento de Ruby on Rails realizado na Universidade Federal da Bahia para a SEMCOMP de 2012. …

Treinamento de Ruby on Rails realizado na Universidade Federal da Bahia para a SEMCOMP de 2012.

O treinamento tem tempo estimado de 4 horas e apresenta para o aspirante a desenvolvedor Rails alguns dos pontos fortes para desenvolvimento de plataformas nesse framework.

São trabalhadas nessa apresentação a criação de scaffolds, das três camadas MVC, da estilização através do Twitter Bootstrap e de como estender a camada lógica.

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
No Downloads

Views

Total Views
1,131
On Slideshare
0
From Embeds
0
Number of Embeds
1

Actions

Shares
Downloads
26
Comments
1
Likes
3

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. RAILS NA PRÁTICA 3 e 5 de Outubromarcoafilho@gmail.commarcoafilho@marcoafilho
  • 2. LICENÇA
  • 3. MARCO ANTONIO FILHOCOORDENADOR DE TI INPACT.ME
  • 4. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Rails? #Framework #Ruby #DesenvolvimentoWeb #MVC #DRY #ConvencaoSobreConfiguracao #REST
  • 5. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Rails? “#Framework implementado em #Ruby para #DesenvolvimentoWeb seguindo a arquitetura #MVC e tem como filosofia as seguintes práticas: #DRY, #ConvencaoSobreConfiguracao, #REST.”
  • 6. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Ruby #  1.  Tudo  eh  um  objeto   5.times  {  print  "Hello  World!"  }     #  2.  Blocos     sample_array.each  {  |element|  print  element  }     #  3.  Retorno  de  funcao  implicito     def  sum(a,b)      a  +  b   end     #  4.  Tudo  eh  aberto     class  Fixnum      def  previous          self  –  1      end   end   6.previous       #  5.  Operadores  unarios.  Nao  ha  ++,  -­‐-­‐;  Use  +=  
  • 7. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Ruby #  6.  Atribuicao  paralela   a,  b  =  b,  a     #  7.  Cada  string  é  um  objeto   print  "hello".object_id   print  "hello".object_id  #  Um  novo  objeto     #  8.  Verdadeiro  e  falso  em  Ruby   if  0      print  "Hello  World"   end     #  9.  Suporte  a  faixa  de  numeros  e  expressoes  regulares  de  forma  nativa   (1..10).each  {  print  "Hello  World"  }     #  10.  Indicadores  de  metodo   class  Woman      def  loves?(thing)          thing  ==  "chocolate"  ?  true  :  false      end   end  
  • 8. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking MVC DATABASE MODEL 2 . 3 . D D E A M T A A N D 4. RESPONSE CONTROLLER VIEW 1. REQUEST
  • 9. MÃOS À OBRA  
  • 10. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking A aplicacão OBJETIVO Desenvolver uma plataforma para gerenciamento de finanças pessoais. FUNCIONALIDADES Manutenção de contas (Corrente, Poupança, Carteira); Manutenção de gastos; Relatórios.
  • 11. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Wireframes
  • 12. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Wireframes
  • 13. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Criando Uma Aplicação Rails Configuração Ruby 1.9.3 Rails 3.2.8 Git 1.7.4.x Configuração Abra o terminal e digite: $  rails  new  my_budget  
  • 14. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Estrutura de diretórios
  • 15. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Preparando para implantar Gemfile group  :development,  :test  do      gem  sqlite3   end     group  :production  do      gem  pg   end   Git $  git  config  -­‐-­‐global  config.name  "Marco  Antonio"   $  git  config  -­‐-­‐global  config.email  "marcoafilho@gmail.com"   $  git  init   $  git  add  .   $  git  commit  -­‐m  "Meu  primeiro  commit."  
  • 16. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Heroku 1. Crie uma conta em heroku.com 2. Configure o heroku com a sua aplicação Dentro da pasta do seu projeto: $  gem  install  heroku     $  ssh  keygen  -­‐t  rsa   $  heroku  login   $  heroku  keys:add   $  heroku  create  -­‐-­‐stack  cedar   $  git  push  heroku  master   $  heroku  open  
  • 17. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Página inicial Criando um controle para abarcar páginas $  rails  g  controller  Pages  home   Editando o html Uma página é criada em app/views/pages/home <img  alt="Welcome  picture"  src="/assets/welcome.png">  
  • 18. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Página inicial Visualizando alterações localmente Execute o comando a seguir e acesse http://localhost:3000 $  rails  s   Alterando as rotas Entre no arquivo config/routes.rb e adicione a seguinte linha: root  to:  "pages#home"   Remova a public/index.html e reinicie o servidor caso seja necessário.
  • 19. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Publicando as alterações $  git  rm  public/index.html   $  git  add  .   $  git  commit  -­‐m  "Nova  home  page."   $  git  push  heroku  master   $  heroku  open  
  • 20. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking CRUD de contas Definindo um modelo de contas $  rails  g  scaffold  Account  name:string  model:string   Compondo o bando de dados $  rake  db:migrate   Acesse a rota http://localhost:3000/accounts e veja o reultado final
  • 21. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking O que aconteceu? Rails gerou automaticamente as 3 camadas do MVC -  Um arquivo de migração que descreve a nova tabela no banco de dados; -  Um modelo Account que interage com o banco de dados; -  Um controlador AccountsController que liga o modelo Account a ações; -  5 páginas que representam algumas ações básicas como listagem e edição; -  Folhas de estilo e um javascripts; -  Alguns arquivos para escrever testes; Publicando as rotas $  git  add  .   $  git  commit  -­‐m  "Pagina  de  gerenciamento  de  contas."   $  git  push  heroku  master   $  heroku  run  rake  db:migrate   $  heroku  open  
  • 22. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Entendendo a mágica Migrations Alterações na estrutura do banco de dados: Abra o arquivo db/migrate/[timestamp]_create_accounts.rb class  CreateAccounts  <  ActiveRecord::Migration      def  change          create_table  :accounts  do  |t|              t.string  :name              t.string  :model                t.timestamps          end      end   end  
  • 23. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Entendendo a mágica Models Em sua maior parte são representações de tabelas no banco em objetos Ruby; Abra o arquivo app/models/account.rb class  Account  <  ActiveRecord::Base      attr_accessible  :model,  :name   end  
  • 24. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Entendendo a mágica Controllers Representam ações que podem ser feitas usando modelos ou não; Veja o arquivo app/controllers/accounts_controller.rb class  AccountsController  <  ApplicationController      def  index          @accounts  =  Account.all            respond_to  do  |format|              format.html  #  index.html.erb              format.json  {  render  json:  @accounts  }          end      end      ...   end  
  • 25. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Entendendo a mágica Views Representam ações que podem ser feitas usando modelos ou não; Veja o arquivo app/views/index.html.erb <%  @accounts.each  do  |account|  %>      <tr>          <td><%=  account.name  %></td>          <td><%=  account.model  %></td>          <td><%=  link_to  Show,  account  %></td>          <td><%=  link_to  Edit,  edit_account_path(account)  %></ td>          <td><%=  link_to  Destroy,  account,  method:  :delete,   data:  {  confirm:  Are  you  sure?  }  %></td>      </tr>   <%  end  %>  
  • 26. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Entendendo a mágica Routes Definem url a partir de ações de controladores; O comando resources cria as rotas para as ações Restful de um controlador; Abra o arquivo config/routes.rb MyBudgetTraining::Application.routes.draw  do      resources  :accounts        root  to:  "pages#home"   end  
  • 27. DANDO VIDA À APLICAÇÃO  
  • 28. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Twitter Bootstrap
  • 29. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Twitter Bootstrap Rails Inserindo a gem na aplicação Vá no arquivo Gemfile e adicione: gem  twitter-­‐bootstrap-­‐rails,  2.1.3   Instalando e usando a gem $  bundle  install   $  rails  g  bootstrap:install   $  rails  g  bootstrap:layout  application  fixed   $  rails  g  bootstrap:themed  Accounts   Remova os comandos favicon_link_tag do arquivo layouts/application.html.erb Para saber mais, verifique a documentação do twitter bootstrap
  • 30. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Publique mais uma vez Envie sua aplicação para o heroku $  git  add  .   $  git  commit  -­‐m  "Template  usando  twitter  bootstrap."   $  git  push  heroku  master   $  heroku  open   Porque estamos fazendo isso? A entrega contínua é uma prática de desenvolvimento ágil (XP)
  • 31. APROFUNDANDO UM POUCO MAIS  
  • 32. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Gerenciamento de transações Model $  rails  g  model  Transaction  account:references         >  description:string  value:decimal  performed_at:datetime     >  kind:string   Execute a nova migration A entrega contínua é uma prática de desenvolvimento ágil (XP) $  rake  db:migrate   Importante! No arquivo models/transaction.rb adicione como attr_accessible o valor :account_id
  • 33. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Gerenciamento de transações Controllers $  rails  g  controller  Transactions   Adicione ações ao controller Adicionaremos sete ações ao controller index, show, new, create, edit, update, destroy; class  TransactionsController  <  ApplicationController      def  index                end   end  
  • 34. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Gerenciamento de transações Ação index Representa uma listagem do modelo def  index      @transactions  =  Transaction.all           end   Ação show Representa uma nova instância de um modelo para apresentação def  show      @transaction  =  Transaction.find(params[:id])   end  
  • 35. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Gerenciamento de transações Ação new Representa uma nova instância de um modelo def  new      @transaction  =  Transaction.new           end   Ação edit Representa uma instância de um modelo existente para ser modificada def  edit      @transaction  =  Transaction.find(params[:id])           end  
  • 36. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Gerenciamento de transações Ação create Cria um objeto no banco def  create      @transaction  =  Transaction.new(params[:transaction])        if  @transaction.save              redirect_to  @transaction,  notice:  "Transaction  created"      else              render  action:  "new"      end               end  
  • 37. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Gerenciamento de transações Ação update Atualiza um objeto no banco def  update      @transaction  =  Transaction.find(params[:id])        if  @transaction.update_attributes(params[:transaction])              redirect_to  @transaction,  notice:  "Transaction  updated"      else              render  action:  "edit"      end               end  
  • 38. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Gerenciamento de transações Ação destroy Elimina um objeto do banco de dados def  destroy      @transaction  =  Transaction.find(params[:id])      @transaction.destroy        redirect_to  transactions_path   end  
  • 39. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Gerenciamento de transações Rotas Adicionaremos uma rota para os recursos do controle transação MyBudgetTraining::Application.routes.draw  do      resources  :accounts      resources  :transactions        root  to:  "pages#home"   end   Agora temos o mesmo conjunto de endereços que temos em contas; Precisamos da camada de visualização!
  • 40. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Gerenciamento de transações Views -  São páginas html com ruby embutido (erb); -  Rails não provê nenhum gerador para criação de views; -  Crie manualmente na pasta views/transactions os arquivos: -  index.html.erb; -  show.html.erb; -  new.html.erb; -  edit.html.erb; -  _form.html.erb;
  • 41. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking <%  #index.html.erb  %>     <div  class="page-­‐header"><h1>Transações</h1></div>   <table  class="table  table-­‐striped">      <thead>          <tr>      <td>Descrição</td>              <td>...</td>          </tr>      </thead>      <tbody>          <%  @transactions.each  do  |transaction|  %>          <tr>              <td><%=  link_to  transaction.description,  transaction  %></td>              <td>...</td>              <td><%=  link_to  Editar,  edit_transaction_path(transaction),  class:  "btn  btn-­‐ mini"  %></td>              <td><%=  link_to  Remover,  transaction_path(transaction),  method:  :delete,   data:  {  confirm:  "Tem  certeza?"  },  class:  "btn  btn-­‐mini  btn-­‐danger"  %></td>          </tr>          <%  end  %>      </tbody>   </table>   <%=  link_to  Nova,  new_transaction_path,  class:  "btn  btn-­‐primary"  %>  
  • 42. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking <%  #show.html.erb  %>     <div  class="page-­‐header"><h1>Transação</h1></div>     <dl  class="dl-­‐horizontal">      <dt><strong>Conta:</strong></dt>      <dd><%=  @transaction.account.name  %></dd>      <dt><strong>Descrição:</strong></dt>      <dd><%=  @transaction.description  %></dd>      <dt><strong>Valor:</strong></dt>      <dd><%=  @transaction.value  %></dd>      <dt><strong>Efetuado  em:</strong></dt>      <dd><%=  @transaction.performed_at  %></dd>      <dt><strong>Tipo:</strong></dt>      <dd><%=  @transaction.kind  %></dd>   </dl>     <div  class="form-­‐actions">      <%=  link_to  Retornar,  transactions_path,  class:  btn  %>      <%=  link_to  Editar,  edit_transaction_path(@transaction),  class:  btn  %>      <%=  link_to  Remover,  transaction_path(@transaction),  method:  :delete,                              data:  {  confirm:  Tem  certeza?  },  class:  btn  btn-­‐danger  %>   </div>  
  • 43. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking <%  #new.html.erb  %>     <div  class="page-­‐header"><h1>Nova  transação</h1></div>   <%=  render  form  %>   <%  #edit.html.erb  %>     <div  class="page-­‐header"><h1>Editar  transação</h1></div>   <%=  render  form  %>  
  • 44. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking<%  #_form.html.erb  %>    <%=  form_for  @transaction,  html:  {  class:  form-­‐horizontal  }  do  |f|  %>      <div  class="control-­‐group">          <%=  f.label  :account_id,  class:  control-­‐label  %>          <div  class="controls">              <%=  f.select  :account_id,  Account.all.map{  |a|  [a.name,  a.id]  },                                                                    class:  number_field  %>          </div>      </div>      <div  class="control-­‐group">          <%=  f.label  :description,  class:  control-­‐label  %>          <div  class="controls"><%=  f.text_field  :description,  class:  text_field  %></div>      </div>      ...      <div  class="control-­‐group">          <%=  f.label  :performed_at,  class:  control-­‐label  %>          <div  class="controls">              <%=  f.date_select  :performed_at,  class:  datetime_select  %>          </div>      </div>      <div  class="form-­‐actions">          <%=  f.submit  Salvar,  class:  btn  btn-­‐primary  %>          <%=  link_to  Cancelar,  transactions_path,  class:  btn  %>      </div>  <%  end  %>  
  • 45. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Layout da aplicação De onde vem o menu e a barra lateral? Da pasta views/layouts/application.html.erb Substitua os links da ul.nav pelos seguintes comandos: <%=  link_to  "Contas",  accounts_path  %>   <%=  link_to  "Transações",  transactions_path  %>   No wireframe não há uma barra lateral; Remova a div.span3 e todo o seu conteúdo Clicar no logo MyBudget deveria levar para home <%=  link_to  "MyBudget",  root_path,  class:  "Brand"  %>  
  • 46. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Publique as alterações Navegue localmente e verifique se tudo está certo E execute o velho código para publicar $  git  add  .   $  git  commit  -­‐m  "Pagina  de  gerenciamento  de  transacoes."   $  git  push  heroku  master   $  heroku  run  rake  db:migrate   $  heroku  open  
  • 47. ADICIONANDO UM POUCO DE LÓGICA  
  • 48. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Relacionamento de objetos Uma conta tem muitas transações... Se formos à classe models/transaction.rb vemos a seguinte linha belongs_to  :account   Devemos agora adicionar o inverso na classe models/account.rb has_many  :transactions   Isso fornecerá uma série de métodos para manipular transações a partir de uma conta Observe o uso do plural no segundo comando
  • 49. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Apresentando o total da conta Uma conta tem muitas transações... Vá até a classe models/account.rb vemos a seguinte linha def  current_amount      transactions.where(kind:  "Income").sum(:value)  -­‐        transactions.where(kind:  "Expense").sum(:value)     end   Precisamos apresentar essa informação agora na listagem e na visualização <%  #views/accounts/index.html.erb  %>   <td><%=  account.current_amount  %></td>   <%  #views/accounts/show.html.erb  %>   <dt>Total</dt>   <dd><%=  @account.current_amount  %></dd>  
  • 50. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Restrigindo os gastos por tipo Uma transação pode ser uma saída ou uma entrada Vá até a classe models/transaction.rb e adicione a constante TYPES  =  ["Income",  "Expense"]   E no arquivo views/transactions/_form.html.erb substitua: <%=  f.text_field  :kind,  class:  text_field  %>   Por <%=  f.select  :kind,  Transaction::TYPES  %>  
  • 51. NÃO PARE POR AÍ  
  • 52. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Exercícios Aplicação: -  Use páginação com o plugin will_paginate: http://goo.gl/c3OGx -  Estilize com bootstrap-will_paginate: http://goo.gl/XZUy8 Visualização de contas (show) -  Apresente uma paginação para as últimas 5 transações; -  Ordene as transações por data; Relatórios -  Crie uma página de relatórios em que deve ser apresentado as despesas por dia e mês; -  Integre com o Google Charts: http://goo.gl/7bWlQ
  • 53. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Gems Anotar Annotate Models (https://github.com/ctran/annotate_models) Template Haml e Haml-rails (https://github.com/indirect/haml-rails) Autenticação Devise (https://github.com/plataformatec/devise) Testes Rspec (https://github.com/dchelimsky/rspec) Capybara (https://github.com/jnicklas/capybara) Factory Girl (https://github.com/thoughtbot/factory_girl_rails) Upload de arquivos Carrierwave (https://github.com/jnicklas/carrierwave)
  • 54. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Editores de texto Multiplataforma Sublime Text 2 (http://www.sublimetext.com/2) Vim (http://www.vim.org/) Aptana (http://www.aptana.com/) MAC OS X Textmate (http://macromates.com/) LINUX Komodo Edit (http://www.activestate.com/komodo-edit)
  • 55. #What? #FirstSteps #Bootstrapping #Mastering #Logic #KeepWalking Referências Livros Learn To Program (http://pine.fm/LearnToProgram/) Rails Tutorial (http://ruby.railstutorial.org/) Rails guides (http://guides.rubyonrails.org/) Documentação Rails API (http://api.rubyonrails.org/) Vídeos Railscasts (http://railscasts.com/) An Introduction to Rails (http://goo.gl/HA5Np) Tutorial dinâmico Code School (http://www.codeschool.com/) Ruby Weekly (http://rubyweekly.com/)
  • 56. Dúvidas ? ? ? ? ? ? ? ? ? ? ? ?
  • 57. MUITO OBRIGADO!marcoafilho@gmail.commarcoafilho@marcoafilho