Support #710
Updated by Daniel Curtis almost 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>
* Install the new web applications dependencies:
<pre>
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>
h3. 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>
h3. 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>
h3. 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 '/messages'
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 "messages/new" %>
<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 h3. Show Message Function Method
* 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' 'messages#show'
end
</code></pre>
h3. 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 '/messages'
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