Sunday, April 23, 2017

The making of static pages using Ruby on Rails

Today, I finished the chapter 3 of Michael Hartl's Ruby on Rails book. I did everything up to 3.5: Conclusion. I did not do the optional Advance Testing Setup after 3.6.

The online version of chapter 3:
https://www.railstutorial.org/book/static_pages#cha-static_pages

My Github repository:
https://github.com/jimmy2046/sample_app

* First, I created a new Rails project called sample_app:
$ rails _5.0.1_ new sample_app

* I did not changed the Gemfile and this is my Gemfile
source 'https://rubygems.org'

git_source(:github) do |repo_name|
  repo_name = "#{repo_name}/#{repo_name}" unless repo_name.include?("/")
  "https://github.com/#{repo_name}.git"
end


# Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
gem 'rails', '~> 5.0.1'
# Use sqlite3 as the database for Active Record
gem 'sqlite3'
# Use Puma as the app server
gem 'puma', '~> 3.0'
# Use SCSS for stylesheets
gem 'sass-rails', '~> 5.0'
# Use Uglifier as compressor for JavaScript assets
gem 'uglifier', '>= 1.3.0'
# Use CoffeeScript for .coffee assets and views
gem 'coffee-rails', '~> 4.2'
# See https://github.com/rails/execjs#readme for more supported runtimes
# gem 'therubyracer', platforms: :ruby

# Use jquery as the JavaScript library
gem 'jquery-rails'
# Turbolinks makes navigating your web application faster. Read more: https://github.com/turbolinks/turbolinks
gem 'turbolinks', '~> 5'
# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder
gem 'jbuilder', '~> 2.5'
# Use Redis adapter to run Action Cable in production
# gem 'redis', '~> 3.0'
# Use ActiveModel has_secure_password
# gem 'bcrypt', '~> 3.1.7'

# Use Capistrano for deployment
# gem 'capistrano-rails', group: :development

group :development, :test do
  # Call 'byebug' anywhere in the code to stop execution and get a debugger console
  gem 'byebug', platform: :mri
end

group :development do
  # Access an IRB console on exception pages or by using <%= console %> anywhere in the code.
  gem 'web-console', '>= 3.3.0'
  gem 'listen', '~> 3.0.5'
  # Spring speeds up development by keeping your application running in the background. Read more: https://github.com/rails/spring
  gem 'spring'
  gem 'spring-watcher-listen', '~> 2.0.0'
end

# Windows does not include zoneinfo files, so bundle the tzinfo-data gem
gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby]

* I installed the Gemfile without production part:
$ bundle install --without production
$ bundle update

* I initialized a Git repository:
$ git init
$ git add -A
$ git commit -m "Initialize repository"

* I updated the README.md file, committed the changes, and pushed it onto Github:
$ git commit -am "Improve the README"
$ git remote add origin https://github.com/jimmy2046/sample_app.git
$ git push -u origin --all # pushes up the repo and its refs for the first time
* I tested the new project by Hello World in the Application controller (app/controllers/application_controller.rb):

 class ApplicationController < ActionController::Base
  protect_from_forgery with: :exception
  
  def hello
    render html: "hello, world!"
  end  
end
* The config/routes.rb specifies what pages are going to send out in according to visitor's HTTP GET request:
Rails.application.routes.draw do
  root 'static_pages#home'
   
  get 'static_pages/home'
  get 'static_pages/help'
  get 'static_pages/about'
  get 'static_pages/contact'
end

*  I committed the changes for edited application_controller.rb and routes.rb:
$ git commit -am "Add hello"
$ git push

* I check out a branch for creating static pages:
$ git checkout -b static-pages

* I generated a Static Pages controller for home.html.erb and help.html.erb:
$ rails generate controller StaticPages home help

* I committed the changes for the creation of Static Pages controller and pushed it to Git hub:
$ git add -A
$ git commit -m "Add a Static Pages controller"
$ git push -u origin static-pages
$ git push

* I added the routes for home.html.erb and help.html.erb:
Rails.application.routes.draw do
  root 'static_pages#home'
   
  get 'static_pages/home'
  get 'static_pages/help'
  get 'static_pages/about'
  get 'static_pages/contact'
end

* I started the Rails server:
$ rails s -b 0.0.0.0 -p 3000

* I navigated it using Firefox:
http://localhost:3000/static_pages/home

* The Rails Generate command created the app/controllers/static_pages_controller.rb file automatically. The generate command also added the def home and def help methods in the Ruby controller file. I added def about and def contact methods in according to the instruction of the book.
class StaticPagesController < ApplicationController
  def home
  end

  def help
  end
   
  def about
  end
   
  def contact
  end
   
end

* The controller also created 2 new files: home.html.erb and help.html.erb. The <% > part is where the Ruby program command to be run.  In the first line it returns a value "Home" to the variable  "title":
<% provide(:title, "Home") %>
<h1>Sample App</h1>
<p>
  This is the home page for the
  <a href="http://www.railstutorial.org/">Ruby on Rails Tutorial</a>
  sample application.
</p>

* Similarly, this is the app/views/static_pages/help.html.erb file:

<% provide(:title, "Help") %>
<h1>Help</h1>
<p>
  Get help on the Ruby on Rails Tutorial at the
  <a href="http://www.railstutorial.org/help">Rails Tutorial help section</a>.
  To get help on this sample app, see the
  <a href="http://www.railstutorial.org/book"><em>Ruby on Rails Tutorial</em>
  book</a>.
</p>

* The Ruby on Rails framework is designed to be test-driven development (TDD) ready. It is a testing technique in which the programmer writes failing tests first, and then writes the application code to get the tests to pass. The testing codes are written in advanced the Ruby codes and HTML pages.

* The test/controllers/static_pages_controller_test.rb specifies the testing rules for the static pages controllers: 
require 'test_helper'

class StaticPagesControllerTest < ActionDispatch::IntegrationTest

  def setup
    @base_title = "Ruby on Rails Tutorial Sample App"
  end
   
  test "should get root" do
    get root_url
    assert_response :success
  end
   
    test "should get home" do
    get static_pages_home_url
    assert_response :success
    assert_select "title", "Home | #{@base_title}"
    end

  test "should get help" do
    get static_pages_help_url
    assert_response :success
    assert_select "title", "Help | #{@base_title}"
  end

  test "should get about" do
    get static_pages_about_url
    assert_response :success
    assert_select "title", "About | #{@base_title}"
  end
   
  test "should get contact" do
      get static_pages_contact_url
      assert_response :success
      assert_select "title", "Contact | #{@base_title}"
  end   
   
end

* To run a test, use the rails test command:
$ rails test

* If a wanted to add a new static page called: about.html.erb
1. I added a new test case in test/controllers/static_pages_controller_test.rb
  test "should get about" do
    get static_pages_about_url
    assert_response :success
  end

2. I added a new routing location in config/routes.rb:
get 'static_pages/about'

3. I defined a new module in  app/controllers/static_pages_controller.rb:
  def about
  end
 4. I created a new Ruby Embedded HTML file app/views/static_pages/about.html.erb. One method is using the Linux touch command:

$ touch app/views/static_pages/about.html.erb
 5. I wrote the about.html.erb:
<h1>About</h1>
<p>
  The <a href="http://www.railstutorial.org/"><em>Ruby on Rails
  Tutorial</em></a> is a
  <a href="http://www.railstutorial.org/book">book</a> and
  <a href="http://screencasts.railstutorial.org/">screencast series</a>
  to teach web development with
  <a href="http://rubyonrails.org/">Ruby on Rails</a>.
  This is the sample application for the tutorial.
</p>
6. I ran the test:
$ rails test

* I also did the 3.4 Slightly Dynamic Pages part. But I do not want to explain it in details. For details, please refer to: https://www.railstutorial.org/book/static_pages#sec-slightly_dynamic_pages

* When I finished, I committed it and pushed it onto Github:
$ git add -A
$ git commit -m "Finish static pages"
$ git checkout master
$ git merge static-pages
$ git push

* You can find it on:

1 comment:

How to kill an abandoned process in Linux/Unix

I remembered it, then I forgot, then I remembered it, and then I forgot again. In case of a Linux/Unit process hang, I have to figure out ...