Support #710
Updated by Daniel Curtis over 8 years ago
{{>toc}} *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> * Change into Install the message_app directory: new web applications dependencies: <pre> cd message_app bundle install </pre> * Start the rails development web server: <pre> bundle exec 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> bundle exec rails s -b 0.0.0.0 </pre> h1. The Main Page h2. Main Page Controller * 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> h2. Main Page View * 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> h1. The Message Page h2. Create the Message 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 Message 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> h2. Index Method * 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 Message 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> h1. Create the 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> h2. New Method * 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> h2. Create Method * 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_path else render 'new' end end private def message_params params.require(:message).permit(:content) end end </code></pre> h2. Create the New Message View * 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_path %> <div class="message"> <p class="content"><%= message.content %></p> <p class="time"><%= message.created_at %></p> </div> <% end %> </div> </div> </code> </pre> h1. Create the Show Message Function * 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' get '/messages/:id', to: 'messages#show, as: 'message' end </code></pre> h2. Show Method * 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_path else render 'new' end end private def message_params params.require(:message).permit(:content) end def show @message = Message.find(params[:id]) end end </code></pre> h2. Create the Show Message View * Edit the show message Ruby HTML view: <pre> vi app/views/messages/show.html.erb </pre> #* And add the following: <pre><code class="ruby"> <div class="header"> <div class="container"> <h1>Messenger</h1> </div> </div> <div class="show"> <div class="container"> <div class="message"> <%= @message.content %> </div> </div> </div> </code></pre> h1. Resources * https://www.codecademy.com/en/courses/learn-rails * http://guides.rubyonrails.org/getting_started.html * http://guides.rubyonrails.org/routing.html * http://guides.rubyonrails.org/layouts_and_rendering.html