Oficina Rails Girls + Desprograme: Mini Blog

Vamos aprender o que é um CRUD e como iniciar a criação de um blog usando Rails - incluindo até o deploy. o/

Transcript

1. Rails Girls e Desprograme Get excited and make things! @railsgirlssp fb.com/railsgirls.sp railsgirls.com/saopaulo
2. Instalação do ambiente Todas as máquinas estão configuradas? Tudo preparado?
3. Perguntas e Respostas O que é HTML? O que é Front-end? O que é uma linguagem de programação? O que é banco de dados?
4. Perguntas e Respostas O que é Back-end? O que CSS? O que é terminal? O que é editor de texto?
5. Um pouco sobre Ruby http://tryruby.org
6. O que é Rails? Rails é um framework escrito em Ruby. Não é preciso escrever muito código para fazer coisas comuns. Software de opinião - Faça as coisas do jeito dele! (Rails Way)
7. Filosofias do Rails DRY - Don’t Repeat Yourself Convention over Configuration
8. Criando uma aplicação $ rails new blog --database=postgresql
9. As pastas do Rails app/ Seu novo melhor amigo. Aí ficam os models, views, controllers, helpers, mailers e assets.
10. Partiu Hello Word! $ bin/rails server
11. Partiu Hello Word! VAMOS CRIAR CONTROLLERS E VIEWS
12. Partiu Hello Word! CONTROLLER - Recebe os requests do site. Normalmente existe mais de uma rota para um controller. Vamos ver mais disso depois.
13. Partiu Hello Word! VIEW - É onde as informações aparecem. O Controller fica com toda a informação, a view só mostra ela de uma maneira que a gente consiga ver melhor. =D ERuBy
14. Partiu Hello Word! $ bin/rails generate controller Hello index nome do controller ação da rota
15. Partiu Hello Word! QUANTO ARQUIVO! app/controllers/hello_controller.rb app/views/hello/index.html.erb.
16. Partiu Hello Word! Vamos mexer na view: <h1>Olá, Rails!</h1>
17. Mudando a página inicial config/routes.rb Rails.application.routes.draw do get 'hello/index' root 'hello#index' end Rode o servidor novamente!
18. Vamos começar o blog! Create Read Update Destroy
19. Primeira resource Rails.application.routes.draw do resources :articles root 'welcome#index' end config/routes.rb
20. Primeira resource $ bin/rails routes
21. Vamos testar essa rota http://localhost:3000/articles/new
22. Vamos testar essa rota Deu errado!! =(
23. Vamos testar essa rota Deu errado!! =( Faltou o controller!
24. Primeira resource $ bin/rails generate controller Articles app/controllers/articles_controller.rb
25. Vamos de novo! http://localhost:3000/articles/new
26. Vamos testar essa rota Deu errado!! =(
27. Vamos testar essa rota Deu errado!! =( Faltou a ação do controller!
28. Primeira resource class ArticlesController < ApplicationController def new end end config/routes.rb
29. Vamos de novo! http://localhost:3000/articles/new
30. Vamos testar essa rota Deu errado!! =(
31. Vamos testar essa rota Deu errado!! =( Faltou a View para esse controller!
32. Primeira resource app/views/articles/new.html.erb <h1>New Article</h1>
33. Primeira resource http://localhost:3000/articles/new Funcionou!!
34. Vamos para a construção do nosso primeiro formulário
35. Primeira página app/views/articles/new.html.erb:
36. Primeira página
37. Primeira página
38. Vamos ver como as rotas ficaram bin/rails routes
39. Vamos usar nosso novo formulário! É só preencher os campos e clicar em ‘Enviar’ (Save Article)
40. Primeira página Deu errado!! =(
41. Primeira página Deu errado!! =( Nós só criamos uma ação! Vamos adicionar o create
42. Primeira página app/controllers/articles_controller.rb class ArticlesController < ApplicationController def new end def create render plain: params[:article].inspect end end
43. Um pouco sobre parâmetros http://www.example.com/?username=dhh&email=dhh@email.com params[:username] = ? params[:email] = ?
44. Primeira página Vamos atualizar a página mais uma vez!
45. Primeira página Vamos atualizar a página mais uma vez! Os parâmetros aparecem, mas parece que ainda num funcionou...
46. Deu errado de novo!! Primeira página
47. Gerando um modelo bin/rails generate model Article title:string text:text db/migrate/YYYYMMDDHHMMSS_create_articles.rb
48. Gerando um modelo Atenção! Nomes de modelos são no singular e controllers no plural! As tabelas de um modelo sempre estarão no plural, mas o Rails faz isso para você.
49. Rodando uma migration bin/rails db:migrate
50. Salvando os dados no controller app/controllers/articles_controller.rb
51. Salvando os dados no controller Quase lá...
52. Salvando os dados no controller O Rails tem várias coisinhas para que a aplicação que estamos desenvolvendo fique segura!
53. Salvando os dados no controller
54. Salvando os dados no controller Atualizando a página, vemos que o Rails vai reclamar que falta outra ação...
55. app/controllers/articles_controller.rb Adicionar a ação de show
56. app/views/articles/show.html.erb Adicionar a ação de show
57. Salvando os dados no controller Funcionou! :D
58. Listar todos os artigos salvos app/controllers/articles_controller.rb
59. Listar todos os artigos salvos app/views/articles/index.html.erb
60. Listar todos os artigos salvos http://localhost:3000/articles
61. Navegação Já podemos CRIAR, LISTAR e MOSTRAR artigos. Vamos adicionar uns liks para navegar de uma página para outra!
62. Navegação app/views/welcome/index.html.erb <h1>Hello, Rails!</h1> <%= link_to 'Meu Blog', controller: 'articles' %>
63. Navegação app/views/articles/index.html.erb <%= link_to 'New article', new_article_path %>
64. Navegação app/views/articles/new.html.erb, <%= form_for :article, url: articles_path do |f| %> ... <% end %> <%= link_to 'Back', articles_path %>
65. Navegação app/views/articles/show.html.erb <p> <strong>Title:</strong> <%= @article.title %> </p> <p> <strong>Text:</strong> <%= @article.text %> </p> <%= link_to 'Back', articles_path %>
66. Vamos testar os links! http://localhost:3000/articles
67. Vamos adicionar um pouco de validação Hoje uma pessoa pode chegar e escrever qualquer coisa no seu blog…
68. Vamos adicionar um pouco de validação app/models/article.rb class Article < ApplicationRecord validates :title, presence: true, length: { minimum: 5 } end
69. Vamos adicionar um pouco de validação Modificamos a ação de create para quando der erro: def create @article = Article.new(article_params) if @article.save redirect_to @article else render 'new' end end app/controllers/articles_controller.rb
70. Vamos salvar um artigo sem o nome http://localhost:3000/articles
71. Agora vamos melhorar o erro... app/views/articles/new.html.erb %= form_for :article, url: articles_path do |f| %> <% if @article.errors.any? %> <div id="error_explanation"> <h2> <%= pluralize(@article.errors.count, "error") %> prohibited this article from being saved: </h2> <ul> <% @article.errors.full_messages.each do |msg| %> <li><%= msg %></li> <% end %> </ul> </div> <% end %> <p> <%= f.label :title %><br> <%= f.text_field :title %> </p> ...
72. Vamos salvar um artigo sem o nome http://localhost:3000/articles
73. Atualizando artigos ArticlesController def edit @article = Article.find(params[:id]) end Vamos adicionar a ação de edit
74. Atualizando artigos Crie um arquivo app/views/articles/edit.html.erb <h1>Editing article</h1> <%= form_for :article, url: article_path(@article), method: :patch do |f| %> <% if @article.errors.any? %> <div id="error_explanation"> <h2> <%= pluralize(@article.errors.count, "error") %> prohibited this article from being saved: </h2> <ul> <% @article.errors.full_messages.each do |msg| %> <li><%= msg %></li> <% end %> </ul> </div> <% end %>
75. Atualizando artigos Crie um arquivo app/views/articles/edit.html.erb <p> <%= f.label :title %><br> <%= f.text_field :title %> </p> <p> <%= f.label :text %><br> <%= f.text_area :text %> </p> <p> <%= f.submit %> </p> <% end %> <%= link_to 'Back', articles_path %>
76. Atualizando artigos app/controllers/articles_controller.rb def update @article = Article.find(params[:id]) if @article.update(article_params) redirect_to @article else render 'edit' end end
77. Atualizando artigos Adicionando link para a página de edição app/views/articles/index.h tml.erb <table> <tr> <th>Title</th> <th>Text</th> <th colspan="2"></th> </tr> <% @articles.each do |article| %> <tr> <td><%= article.title %></td> <td><%= article.text %></td> <td><%= link_to 'Show', article_path(article) %></td> <td><%= link_to 'Edit', edit_article_path(article) %></td> </tr> <% end %> </table>
78. Deletando arquivos app/controllers/articles_controller.rb def destroy @article = Article.find(params[:id]) @article.destroy redirect_to articles_path end
79. Deletando arquivos app/views/articles/index.html.erb ... <% @articles.each do |article| %> <tr> <td><%= article.title %></td> <td><%= article.text %></td> <td><%= link_to 'Show', article_path(article) %></td> <td><%= link_to 'Edit', edit_article_path(article) %></td> <td><%= link_to 'Destroy', article_path(article), method: :delete, data: { confirm: 'Are you sure?' } %></td> </tr> <% end %> ...
80. Deletando arquivos Vamos testar deletar um artigo!
81. Vamos agora criar o modelo de Comentários
82. Vamos agora criar o modelo de Comentários http://guides.rubyonrails.org/getting_started.html#adding-a-second-model
83. Chegou a hora do deploy! Vamos criar uma conta no heroku $ heroku login
84. Chegou a hora do deploy! Adicione essa gem ao seu Gemfile.rb gem 'rails_12factor', group: :production ruby "2.3.1" $ bundle install
85. Chegou a hora do deploy! $ heroku create $ git push heroku master $ heroku run rake db:migrate $ heroku ps:scale web=1 $ heroku open
86. Seu blog já está no ar!
87. Como seguir a partir de agora?
88. Como seguir a partir de agora?
89. Livros
90. Cursos • https://www.codecademy.com/pt • https://www.codeschool.com/ • https://learnrubythehardway.org/book/ • Reprograma • Programaria
91. Eventos • https://www.meetup.com/ ◦ Desprograme ◦ WomenUp Games ◦ Wo Makers Code ◦ PHP Women ◦ Rails Girls
92. Obrigada :D Rails Girls @railsgirlssp fb.com/railsgirls.sp railsgirls.com/saopaulo