Project

General

Profile

Support #710

Updated by Daniel Curtis about 8 years ago

{{>toc}} 

 *NOTE*: NOTE: This guide was adapted from the Ruby on Rails tutorial on "Codecademy":https://www.codecademy.com 

 * Create the new Ruby on Rails web application: 
 <pre> 
 rails new message_app 
 </pre> 

 * Install the new web applications dependencies: 
 <pre> 
 bundle install 
 </pre> 

 * Start the rails development web server: 
 <pre> 
 rails s 
 </pre> 
 #* *NOTE*: The development web server bind the IP address to the localhost by default, so accessing it over the network will not work. To allow network access to the development web server: 
 <pre> 
 rails s -b - b 0.0.0.0 
 </pre> 

 h2. The Basics 

 * Create a controller for the Page class: 
 <pre> 
 rails generate controller Page 
 </pre> 

 * Edit the Page controller: 
 <pre> 
 vi app/controllers/page_controller.rb 
 </pre> 
 #* And create the home method: 
 <pre><code class="ruby"> 
 class PageController < ApplicationController  
   def home 
   end 
 end 
 </code></pre> 

 * Edit the routes file: 
 <pre> 
 vi config/routes.rb 
 </pre> 
 #* And add the route for the default landing page: 
 <pre><code class="ruby"> 
 Rails.application.routes.draw do 
   get '/' => "page#home" 
 end 
 </code></pre> 

 * Edit the home page view: 
 <pre> 
 vi app/views/page/home.html.erb 
 </pre> 
 #* And add the following bare html page: 
 <pre><code class="ruby"> 
 <div class="main"> 
   <div class="container"> 
     <h1>Hello World!</h1> 
   </div> 
 </div> 
 </code></pre> 

 h2. Create the Model 

 * Start by creating a Message model: 
 <pre> 
 rails generate model Message 
 </pre> 

 * Edit the database migrate file: 
 <pre> 
 vi db/migrate/20151209164020_create_messages.rb 
 </pre> 
 #* And add the @*t.text :content*@ to create the content row to the messages table: 
 <pre><code class="ruby"> 
 class CreateMessages < ActiveRecord::Migration 
   def change 
     create_table :messages do |t| 
       t.text :content 
       t.timestamps 
     end 
   end 
 end 
 </code></pre> 

 * Run the database migration: 
 <pre> 
 rake db:migrate 
 </pre> 

 h2. Create the Controller 

 * Create the Messages controller: 
 <pre> 
 rails generate controller Messages 
 </pre> 

 * Next edit the routes file: 
 <pre> 
 vi config/routes.rb 
 </pre> 
 #* Then map the URL /messages to the Messages controller index action: 
 <pre><code class="ruby"> 
 Rails.application.routes.draw do 
   get '/messages' => "messages#index" 
 end 
 </code></pre> 

 * Edit the Messages controller: 
 <pre> 
 vi app/controllers/messages_controller.rb 
 </pre> 
 #* And define an index method with a class array named @messages that contains all the messages in the database table: 
 <pre><code class="ruby"> 
 class MessagesController < ApplicationController 
   def index  
     @messages = Message.all  
   end 
 end 
 </code></pre> 

 h2. Create the View 

 * Edit the messages index Ruby HTML view: 
 <pre> 
 vi app/views/messages/index.html.erb 
 </pre> 
 #* Then create a for loop to loop through the contents of the @messages array: 
 <pre><code class="ruby"> 
 <div class="header"> 
   <div class="container"> 
     <h1>Messenger</h1> 
   </div> 
 </div> 

 <div class="messages"> 
   <div class="container"> 
     <% @messages.each do |message| %>  
     <div class="message">  
       <p class="content"><%= message.content %></p>  
       <p class="time"><%= message.created_at %></p>  
     </div>  
     <% end %> 
   </div> 
 </div> 
 </code></pre> 

 h2. Add a Create New Message Function 

 * Edit the routes file 
 <pre> 
 vi config/routes.rb 
 </pre> 
 #* Then create a route that maps requests to messages/new to the Message controller's new action: 
 <pre><code class="ruby"> 
 Rails.application.routes.draw do 
   get '/messages' => 'messages#index' 
   get 'messages/new' => 'messages#new' 
 end 
 </code></pre> 

 * Edit the Messages controller: 
 <pre> 
 vi app/controllers/messages_controller.rb 
 </pre> 
 #* And define the new method that adds new messages to the database table: 
 <pre><code class="ruby"> 
 class MessagesController < ApplicationController 
   def index  
     @messages = Message.all  
   end 

   def new 
     @message = Message.new  
   end 
 end 
 </code></pre> 

 * Edit the routes file again 
 <pre> 
 vi config/routes.rb 
 </pre> 
 #* And map requests to the Message controller's create action: 
 <pre><code class="ruby"> 
 Rails.application.routes.draw do 
   get '/messages' => 'messages#index' 
   get 'messages/new' => 'messages#new' 
   post 'messages' => 'messages#create' 
 end 
 </code></pre> 

 * Edit the Messages controller again: 
 <pre> 
 vi app/controllers/messages_controller.rb 
 </pre> 
 #* And create the create method and the private message_params method below the new method: 
 <pre><code class="ruby"> 
 class MessagesController < ApplicationController 
   def index  
     @messages = Message.all  
   end 

   def new 
     @message = Message.new  
   end 

   def create  
     @message = Message.new(message_params)  
     if @message.save  
       redirect_to '/messages'  
     else  
       render 'new'  
     end  
   end 

   private  
   def message_params  
     params.require(:message).permit(:content)  
   end 
 end 
 </code></pre> 

 * Edit the new message Ruby HTML view: 
 <pre> 
 vi app/views/messages/new.html.erb 
 </pre> 
 #* And add the following: 
 <pre><code class="ruby"> 
 <div class="header"> 
   <div class="container"> 
     <h1>Messenger</h1> 
   </div> 
 </div> 

 <div class="create"> 
   <div class="container"> 
     <%= form_for(@message) do |f| %>   
       <div class="field">  
         <%= f.label :message %><br>  
         <%= f.text_area :content %>  
       </div>  
       <div class="actions">  
         <%= f.submit "Create" %>  
       </div>  
     <% end %> 
   </div> 
 </div> 
 </code></pre> 

 * Edit the messages index Ruby HTML view: 
 <pre> 
 vi app/views/messages/index.html.erb 
 </pre> 
 #* And add the link_to function: 
 <pre><code class="ruby"> 
 <div class="header"> 
   <div class="container"> 
     <h1>Messenger</h1> 
   </div> 
 </div> 

 <div class="messages"> 
   <div class="container"> 
     <% @messages.each do |message| %>  
     <%= link_to 'New Message', "messages/new" %> 
     <div class="message">  
       <p class="content"><%= message.content %></p>  
       <p class="time"><%= message.created_at %></p>  
     </div>  
     <% end %> 
   </div> 
 </div> 
 </code> 
 </pre> 

 h2. Resources 

 * https://www.codecademy.com/en/courses/learn-rails

Back