023 Rails

24 Nov 2012

Ruby on Rails is an open source web application development framework that allows us to rapidly build web apps. In this episode, we will create a very simple todo application and go through some concepts such as query, db migration, associations, routes, views and more!

Download video: mp4

Sample code: Github

Version: 3.2.8

Similar episodes: 002 Terminal, 009 Package Managers

##Background on Rails:

  1. Rails website and ruby website
  2. Guide
  3. What is Model-View-Controller (MVC) and other examples with todoMVC
  4. What is CRUD (Create Read Update Destroy)

##Things to learn with Rails

####1. background on rails

In the client computer, in the command line:

  1. check ruby version ruby -V
  2. check rubygems is installed gem -v
  3. download rails gem install rails
  4. check the rails version rails -v

####2. create a new rails app

  1. create a new todo application: rails new todo, cd todo
  2. start the local server rails server
  3. open in browser

####3. create a simple task MVC

  1. rails generate scaffold Task done:boolean description:text tag:string
  2. rake db:migrate to generate database
  3. open

####4. routing url 1. route to the root by adding root :to => 'tasks#index' to config/routes.rb and delete the file public/index.html

####5. editing views 1. edit in file app/views/tasks/index.html.erb the line <td><%= task.done %></td> to include relative timing:

<td><%= task.done %>, <%= distance_of_time_in_words(Time.now, task.updated_at) %> ago</td>

####6. editing css 1. edit file app/assets/stylesheets/task.css.sass to include slight styles:

  border-collapse: collapse

  border: 1px solid gray
  padding: 10px   ```

####7. query interface

  1. add a new method to file app/controllers/tasks_controller.rb

    ``` def complete @tasks = Task.where(:done => true)

     respond_to do |format|
         format.html # index.html.erb
     end  end  ```
  2. add match 'completed' => 'tasks#complete' to file config/routes.rb
  3. add <%= link_to 'Completed Tasks', '/completed' %> to file app/views/tasks/index.html.erb
  4. create the template/view file complete.html.erb in app/views/tasks/:


    Listing Completed tasks

    <% @tasks.each do |task| %> <% end %>
    Done Description Tag
    <%= task.done %>, <%= distance_of_time_in_words(Time.now, task.updated_at) %> ago <%= task.description %> <%= task.tag %> <%= link_to 'Show', task %> <%= link_to 'Edit', edit_task_path(task) %> <%= link_to 'Destroy', task, method: :delete, data: { confirm: 'Are you sure?' } %>

    <%= link_to ‘All Tasks’, root_url %> ```

####8. validation

  1. add in many different validations
  2. check the presence of a task description and category in file app/model/stask.rb

    validates :description, :tag, :presence => true

####9. associations

  1. Each task will have a series of associated notes
  2. in the command line, rails generate scaffold Note description:text
  3. create a column in the notes table:

    rails generate migration add_task_id_to_notes task_id:integer

  4. create the relationship
    • in file app/model/task.rb: has_many :notes
    • in file app/model/note.rb: belongs_to :task and amend line to ` attr_accessible :description, :task_id`
  5. rake db:rollback
  6. in file db/migrate/XXXXX20121123102725_add_task_id_to_notes.rb amend the line to add:

    add_column :notes, :task_id, :integer, :default => 1

  7. create 2 notes with descriptions
  8. rake db:rollback and rake db:migrate
  9. open the rails console rails c
  10. check that all notes created belong to task 1 Note.pluck :task_id
  11. edit the notes form to include task_id:


    <%= f.label :task_id %>
    <%= f.text_field :task_id %>


  12. add in the code to show related notes for each task in file app/view/tasks/show.html/erb



      <% @task.notes.each do |note| %>
    • <%= link_to note.description, note %>
    • <% end %>


##More Resources on Rails

  1. Rails tutorial
  2. Rails Cast
  3. Peepcode screencast
  4. For other platforms, try cakephp built on php, django built on python.

##Build Link of this Episode

Treehouse Show is a weekly short, fun series on all things web development and design hosted by Nick Pettit and Jason Seifer.