Jump to content
Thiago Franchin

Iniciando um projeto: Git, Ruby, NodeJs, Sass, Bootstrap 4 e Animate.css

Recommended Posts

:star: Iniciando um projeto: 

 

Crie um ambiente para iniciar um projeto profissional e aprenda também como estilizar os botoes do Bootstrap 4 usando o Sass.

  • [01:33] Instalando Git
  • [03:38] Instalando Ruby
  • [05:34] Instalando NodeJS
  • [07:42] Instalando Sass
  • [09:14] Instalando Bootstrap 4
  • [13:41] Instalando Animate.css
  • [23:02] Estilizando os botões do bootstrap dinamicamente com Sass

 

Links:

 

 

  • +1 1

Share this post


Link to post
Share on other sites

Thiago, obrigado.

Estava fora do mercado de programação a uns quatro anos e agora voltei.... vi a necessidade de me atualizar e este post me ajudou muito... parabens cara, ninguem explica como utilizar esse gerenciador de pacotes no windows(ruby), ja tinha estalado varias e varias vezes mas os animais por ai que ensinam não mostram o caminho para uso no windows.... Deus te abençoe pois faltava um detalhe e você me ajudou... abriu minha mente.... falow

  • Gostei 1

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By mikuzuhara
      Esses são os arquivos principais do projeto:
       
      home_controller.rb:
       
      class HomeController < ApplicationController def index @recipes = Recipe.all end end routes.rb:
      Rails.application.routes.draw do root to: 'home#index' end recipe.rb
      class Recipe < ApplicationRecord def cook_time_min "#{cook_time} minutos" end end index.html.erb:
      <h1>CookBook</h1> <p>Bem-vindo ao maior livro de receitas online</p> <% @recipes.each do |recipe| %> <h1><%= recipe.title %></h1> <ul> <li><%= recipe.recipe_type %></a></li> <li><%= recipe.cuisine %></li> <li><%= recipe.difficulty %></li> <li><%= recipe.cook_time_min %></li> </ul> <% end %> Os arquivos spec.rb são estes:
      visitor_visit_homepage_spec.rb: 
      require 'rails_helper' feature 'Visitor visit homepage' do scenario 'successfully' do visit root_path expect(page).to have_css('h1', text: 'CookBook') expect(page).to have_css('p', text: 'Bem-vindo ao maior livro de receitas'\ ' online') end scenario 'and view recipe' do #cria os dados necessários recipe = Recipe.create(title: 'Bolo de cenoura', recipe_type: 'Sobremesa', cuisine: 'Brasileira', difficulty: 'Médio', cook_time: 60) # simula a ação do usuário visit root_path # expectativas do usuário após a ação expect(page).to have_css('h1', text: recipe.title) expect(page).to have_css('li', text: recipe.recipe_type) expect(page).to have_css('li', text: recipe.cuisine) expect(page).to have_css('li', text: recipe.difficulty) expect(page).to have_css('li', text: "#{recipe.cook_time} minutos") end scenario 'and view recipes list' do #cria os dados necessários recipe = Recipe.create(title: 'Bolo de cenoura', recipe_type: 'Sobremesa', cuisine: 'Brasileira', difficulty: 'Médio', cook_time: 60) another_recipe = Recipe.create(title: 'Feijoada', recipe_type: 'Prato Principal', cuisine: 'Brasileira', difficulty: 'Difícil', cook_time: 90) # simula a ação do usuário visit root_path # expectativas do usuário após a ação expect(page).to have_css('h1', text: recipe.title) expect(page).to have_css('li', text: recipe.recipe_type) expect(page).to have_css('li', text: recipe.cuisine) expect(page).to have_css('li', text: recipe.difficulty) expect(page).to have_css('li', text: "#{recipe.cook_time} minutos") expect(page).to have_css('h1', text: another_recipe.title) expect(page).to have_css('li', text: another_recipe.recipe_type) expect(page).to have_css('li', text: another_recipe.cuisine) expect(page).to have_css('li', text: another_recipe.difficulty) expect(page).to have_css('li', text: "#{another_recipe.cook_time} minutos") end end visitor_view_recipe_detail_spec.rb:
      require 'rails_helper' feature 'Visitor view recipe details' do scenario 'successfully' do #cria os dados necessários recipe = Recipe.create(title: 'Bolo de cenoura', recipe_type: 'Sobremesa', cuisine: 'Brasileira', difficulty: 'Médio', cook_time: 60, ingredients: 'Farinha, açucar, cenoura', cook_method: 'Cozinhe a cenoura, corte em pedaços pequenos, misture com o restante dos ingredientes') # simula a ação do usuário visit root_path click_on recipe.title # expectativas do usuário após a ação expect(page).to have_css('h1', text: recipe.title) expect(page).to have_css('h3', text: 'Detalhes') expect(page).to have_css('p', text: recipe.recipe_type) expect(page).to have_css('p', text: recipe.cuisine) expect(page).to have_css('p', text: recipe.difficulty) expect(page).to have_css('p', text: "#{recipe.cook_time} minutos") expect(page).to have_css('h3', text: 'Ingredientes') expect(page).to have_css('p', text: recipe.ingredients) expect(page).to have_css('h3', text: 'Como Preparar') expect(page).to have_css('p', text: recipe.cook_method) end scenario 'and return to recipe list' do #cria os dados necessários recipe = Recipe.create(title: 'Bolo de cenoura', recipe_type: 'Sobremesa', cuisine: 'Brasileira', difficulty: 'Médio', cook_time: 60, ingredients: 'Farinha, açucar, cenoura', cook_method: 'Cozinhe a cenoura, corte em pedaços pequenos, misture com o restante dos ingredientes') # simula a ação do usuário visit root_path click_on recipe.title click_on 'Voltar' # expectativa da rota atual expect(current_path).to eq(root_path) end end Cheguei a fazer essa alteração em index.html.erb:
      <h1>CookBook</h1> <p>Bem-vindo ao maior livro de receitas online</p> <% @recipes.each do |recipe| %> <h1><%= recipe.title %></h1> <ul> <li><a href = "#detalhes"><%= recipe.recipe_type %></a></li> <li><%= recipe.cuisine %></li> <li><%= recipe.difficulty %></li> <li><%= recipe.cook_time_min %></li> </ul> <% end %> <a name = "detalhes"></a> <h1><%= recipe.title %></h1> <h3>Detalhes</h3> <p><%= recipe.recipe_type %></p> <p><%= recipe.cuisine %></p> <p><%= recipe.difficulty %></p> <p><%= recipe.cook_time %> minutos</p> <h3>Ingredientes</h3> <p><%= recipe.ingredientes %></p> <h3>Como Preparar</h3> <p><%= recipe.cook_method %></p> Mas acusou o seguinte erro no rspec:
      :~/workspace/cookbook_parte3$ rspec ./spec/features/visitor_visit_homepage_spec.rb:4 Run options: include {:locations=>{"./spec/features/visitor_visit_homepage_spec.rb"=>[4]}} Visitor visit homepage successfully (FAILED - 1) Failures: 1) Visitor visit homepage successfully Failure/Error: <h1><%= recipe.title %></h1> ActionView::Template::Error: undefined local variable or method `recipe' for #<#<Class:0x0000560710d070d8>:0x0000560710cfda60> Did you mean? @recipes # ./app/views/home/index.html.erb:15:in `_app_views_home_index_html_erb___4429749300272299021_47294173447260' # ./spec/features/visitor_visit_homepage_spec.rb:5:in `block (2 levels) in <top (required)>' # ------------------ # --- Caused by: --- # NameError: # undefined local variable or method `recipe' for #<#<Class:0x0000560710d070d8>:0x0000560710cfda60> # Did you mean? @recipes # ./app/views/home/index.html.erb:15:in `_app_views_home_index_html_erb___4429749300272299021_47294173447260' Finished in 0.08646 seconds (files took 1.45 seconds to load) 1 example, 1 failure Failed examples: rspec ./spec/features/visitor_visit_homepage_spec.rb:4 # Visitor visit homepage successfully A sintaxe de link_to é esse:
      linkto "textode_href", action = show, id = ?
      Onde tem ? na sintaxe, eu não sei o que por e em "textodehref" deve ir:
      recipe.title
      E adicionei os campos ingredientes e cook_method como segue:
      :~/workspace/cookbook_parte3$ rails generate migration add_attributes_to_recipe ingredients:string cook_method:string invoke active_record create db/migrate/20191021113942_add_attributes_to_recipe.rbmassa-90@ubuntu:~/workspace/cookbook_parte3$ rspecMigrations are pending. To resolve this issue, run: bin/rails db:migrate RAILS_ENV=test:~/workspace/cookbook_parte3$ cd bin:~/workspace/cookbook_parte3/bin$ rails db:migrate RAILS_ENV=test== 20191021113942 AddAttributesToRecipe: migrating ============================-- add_column(:recipes, :ingredients, :string) -> 0.0007s-- add_column(:recipes, :cook_method, :string) -> 0.0004s== 20191021113942 AddAttributesToRecipe: migrated (0.0014s) =================== A execução do rspec dos testes  do jeito que recebi o projeto do Code Saga original é este:
      :~/workspace/cookbook_parte3$ rspec Visitor view recipe details successfully (FAILED - 1) and return to recipe list (FAILED - 2) Visitor visit homepage successfully and view recipe and view recipes list Failures: 1) Visitor view recipe details successfully Failure/Error: recipe = Recipe.create(title: 'Bolo de cenoura', recipe_type: 'Sobremesa', cuisine: 'Brasileira', difficulty: 'Médio', cook_time: 60, ingredients: 'Farinha, açucar, cenoura', cook_method: 'Cozinhe a cenoura, corte em pedaços pequenos, misture com o restante dos ingredientes') ActiveModel::UnknownAttributeError: unknown attribute 'ingredients' for Recipe. # ./spec/features/visitor_view_recipe_detail_spec.rb:6:in `block (2 levels) in <top (required)>' 2) Visitor view recipe details and return to recipe list Failure/Error: recipe = Recipe.create(title: 'Bolo de cenoura', recipe_type: 'Sobremesa', cuisine: 'Brasileira', difficulty: 'Médio', cook_time: 60, ingredients: 'Farinha, açucar, cenoura', cook_method: 'Cozinhe a cenoura, corte em pedaços pequenos, misture com o restante dos ingredientes') ActiveModel::UnknownAttributeError: unknown attribute 'ingredients' for Recipe. # ./spec/features/visitor_view_recipe_detail_spec.rb:31:in `block (2 levels) in <top (required)>' Finished in 9.35 seconds (files took 5.6 seconds to load) 5 examples, 2 failures Failed examples: rspec ./spec/features/visitor_view_recipe_detail_spec.rb:4 # Visitor view recipe details successfully rspec ./spec/features/visitor_view_recipe_detail_spec.rb:29 # Visitor view recipe details and return to recipe list Resumindo, o que preciso fazer para entregar esse desafio resolvido:
      1) Como implementar link_to no arquivo de controller; 2) Como referenciar o objeto recipe de @recipe para detalhar a receita em index.html.erb.
      Pago R$ 30,00 por desafio resolvido por alguém que se manifestar para me ajudar a solucioná-lo(s).
      Aguardo retorno.
      Obrigado,
      Marcelino
       
       
    • By iamdiegoinacio
      Eu consigo acessar o meu site com iptvaiomi.com, mas quando eu coloco o www ele não entra e aparece a mesagem: Erro 503 service Temporarily Unavailable. Como resolver?
    • By brunoogm
      Boa noite pessoal, estou com uma ideia de aplicativo para construir durante a faculdade.
       
      A ideia basicamente é um assistente virtual de turismo, onde o aplicativo deverá falar os dados históricos da cidade (pontos de curiosidade
      e etc.) assim que identificar que o usuário está próximo desse ponto.
       
      Por exemplo, ao me aproximar de um lugar histórico da cidade o aplicativo começa a contar coisas relacionadas aquele lugar...
      Simplificando a ideia é isso...
       
      Eu gostaria de uma ajuda de por onde começar, quais tecnologias pesquisar, linguagens que podem vir a ajudar, talvez algum recurso de código aberto
      ou qualquer outra coisa que me ajude a dar o pontapé inicial.
       
      Qualquer ajuda é bem vinda.
       
      Agradeço a todos!
    • By SilvioHC
      Olá estou começando a a prender node js mas já no primeiro teste algo de errado não está certo 
      const express = require('express'); const app = express(); app.listen(934); //Sempre Na Ultima Linha não sei dizer se é só o tutorial q é antigo 

    • By Hulkstar
      Boa tarde,estou seguindo um tutorial do DevMedia de como configurar um chat nodejs (Link tutorial Aqui),porém na "Listagem 8. Incluindo o módulo Socket.IO." quando eu faço a alteração do script de acordo com o tutorial e tento rodar o aplicativo no servidor,me aparece o seguinte erro, "http://prntscr.com/ow7kd4",caso eu retire o seguinte script "var io = require('socket.io')(app);",já dei uma pesquisada na internet,porém até agora não consegui achar uma solução para o erro,se alguém souber e poder me ajudar por favor,ficarei muito grato.
       
      Abaixo tem o arquivo app.js
      var app = require('http').createServer(resposta); var fs = require('fs'); var io = require('socket.io')(app); app.listen(3000); console.log("Aplicação está em execução..."); function resposta (req, res) { var arquivo = ""; if(req.url == "/"){ arquivo = __dirname + '/index.html'; }else{ arquivo = __dirname + req.url; } fs.readFile(arquivo, function (err, data) { if (err) { res.writeHead(404); return res.end('Página ou arquivo não encontrados'); } res.writeHead(200); res.end(data); } ); } Abaixo tem o arquivo indes.html
      <!DOCTYPE html> <html> <head> <title>ChatJS - FrontEnd Magazine - DevMedia</title> <link rel="stylesheet" type="text/css" href="style.css" /> </head> <body> <div id="historico_mensagens"></div> <form id=’chat’> <input type='text' id='texto_mensagem' name='texto_mensagem' /> <input type='submit' value='Enviar mensagem!' /> </form> </body> </html>  
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.