Scribd
Carregar
7 visualizações

Ruby On Rails Tutorial Codespaces

Rybu the best manual of the Control

Enviado por

Marcelo386
Direitos autorais
© © All Rights Reserved
Formatos disponíveis
Baixe no formato PDF, TXT ou leia on-line no Scribd
7 visualizações

Ruby On Rails Tutorial Codespaces

Rybu the best manual of the Control

Enviado por

Marcelo386
Direitos autorais
© © All Rights Reserved
Formatos disponíveis
Baixe no formato PDF, TXT ou leia on-line no Scribd
Você está na página 1/ 7

Tutorial

1 Criar um repositório no github


1. Acessar a URL https://github.com
2. Clicar no menu da sua conta

3. Clicar em “Your Repositories”

4. Clicar em “New”
5. Preencha os campos “Repository Name”, “Description”, marque a opção “Add a README
file” e clique em “Create repository”
2 Criar um Codespace
1. Clique no botão “Code”, na aba “Codespaces” e no botão “Create codespaces on main”

3 Instalar os Requisitos
1. Localize o terminal do Codespaces
2. Digitar o comando no terminal
gem install rails

4 Criar um Projeto Rails


1. Digitar o comando no terminal
rails new . --javascript esbuild --css bootstrap
2. Ele vai pedir para resolver o conflito, escreva n e aperte enter para não sobreescrever o
arquivo readme
3. Rode o seguinte comando para executar o servidor de desenvolvimento
bin/dev
4. Vai aparecer um diálogo com a opção “Open in Browser”, clique nessa opção

5. Você deve ver uma tela assim:

6. Volte ao terminal e pressione as teclas “control” + “c” para parar a execução do servidor de
desenvolvimento.
5 Criar um hello world
1. Executar o seguinte comando para gerar a ação index do controlador Articles
bin/rails generate controller Articles index
2. Alterar o arquivo app/views/articles/index.html.erb e adicionar o seguinte conteúdo
<h1>Hello World</h1>
3. Inicializar o servidor da aplicação
bin/dev
4. Quando aparecer o diálogo clique em “Open in Browser”
5. Acrescente “/articles/index” no final da URL. No meu caso ficou assim
“https://joaofelipecb-symmetrical-robot-q6j7xg44pq524g5r-3000.preview.app.github.dev/
articles/index”.

6. Volte ao terminal e pressione as teclas “control” + “c” para parar a execução do servidor de
desenvolvimento.

6 MVCS
1. Criar um model para Artigo
bin/rails generate model Article title:string body:text
2. Migre o banco de dados para ficar de acordo com o modelo
bin/rails db:migrate
3. Entre no console do Rails
bin/rails console
4. Crie um artigo e salve
article = Article.new(title: "Hello Rails", body: "I am on Rails!")
article.save
5. Saia do console do Rails apertando “control” + “d”
6. Altere o arquivo do apps/controller/article_controller.rb para o seguinte
class ArticlesController < ApplicationController
def index
@articles = Article.all
end
end
7. Altere o arquivo do apps/views/articles/index.html.erb para o seguinte
<h1>Artigos</h1>
<% @articles.each do |article| %>
<div>
<h1><%= article.title %></h1>
<div><%= article.body %></div>
</div>
<% end %>
8. Inicializar o servidor da aplicação
bin/dev
9. Quando aparecer o diálogo clique em “Open in Browser”
10. Acrescente “/articles/index” no final da URL. No meu caso ficou assim
“https://joaofelipecb-symmetrical-robot-q6j7xg44pq524g5r-3000.preview.app.github.dev/
articles/index”.

11. Volte ao terminal e pressione as teclas “control” + “c” para parar a execução do servidor de
desenvolvimento.

7 Bootstrap Style
1. Altere o arquivo do apps/views/articles/index.html.erb para o seguinte:
<div class="container bg-dark text-white vh-100">
<h1>Artigos</h1>
<% @articles.each do |article| %>
<div class="card">
<div class="card-body">
<h5 class="card-title"><%= article.title %></h5>
<div class="card-text"><%= article.body %></div>
</div>
</div>
<% end %>
</div>
2. Inicializar o servidor da aplicação
bin/dev
3. Quando aparecer o diálogo clique em “Open in Browser”
4. Acrescente “/articles/index” no final da URL. No meu caso ficou assim
“https://joaofelipecb-symmetrical-robot-q6j7xg44pq524g5r-3000.preview.app.github.dev/
articles/index”.

5. Volte ao terminal e pressione as teclas “control” + “c” para parar a execução do servidor de
desenvolvimento.

Você também pode gostar