Rails 5 Basics : Hello Rails
- To create a home page for your web application.
Open the config/routes.rb file in your IDE, routes.rb defines the routes that is installed on your web application. Rails will recognize the routes you define in this configuration file.
Add the line :
to the routes.rb. So it now looks like this:
Rails.application.routes.draw do root 'welcome#index' end
The method root() takes a string parameter. In this case it maps the home page of your site to welcome controller (a class), index action (a method).
Go to the terminal and change directory to the blog project and run:
Prefix Verb URI Pattern Controller#Action root GET / welcome#index
The output of this command shows you the installed routes. Rails will be able to recognize the GET request for welcome page. The output has four columns, namely Prefix, Verb, URI Pattern and Controller#Action. Prefix is the name of the helper that you can use in your view and controller to take the user to a given view or controller. In this case it is rootpath or rooturl that is mapped to your home page. Verb is the Http Verb such as GET, POST, PUT, DELETE etc. URI Pattern is what you see in the browser URL. In this case, it is
Go to the browser and reload the page :
http://localhost:3000. We see the uninitialized constant WelcomeController error. This happens because we don't have a welcome controller to handle the incoming GET request for the home page.
You can either open a new terminal and go to the blog project directory or open a new tab in your terminal and go to the blog project directory.
In this new tab or the terminal, go the blog project directory and type:
$rails g controller welcome index
rails command takes the arguments g for generate, then the controller name and the action. In this case the controller name is welcome and the action name is index.
Reload the web browser again. You will now see the welcome page.
Go to app/views/welcome/index.html.erb and change it to 'Hello Rails' like this:
Save the file. You can embed ruby in .html.erb files. The .erb stands for embedded Ruby. In this case we have html only. We will see how to embed ruby in views in the next lesson.
Reload the browser. Now you will see 'Hello Rails' as the home page content.
Open the welcome_controller.rb in app/controllers directory and look at the index action.
Look at the terminal where you have the rails server running, you will see the request shown in the following image:
You can see that the browser made a GET request for the resource '/' which is the home page of your site. The request was processed by the server where Rails recognized the request and it routed the request to the welcome controller, index action. Since we did not do anything in the index action, Rails looks for the view that has the same name as the action and renders that view. In this case, the view that corresponds to the index action is app/views/welcome/index.html.erb.
Open a new terminal or a new tab and go to Rails console by running:
from the blog project directory.
In Rails console run:
Here we are simulating the browser GET request for the resource '/', which is your home page. You can see the http status code is 200. You can also see which view was rendered for this request.
Can you go to
http://localhost:3000/welcome/index and explain why you see the contents shown in the page?
Before you go read the answer, make an attempt to answer this question.
You will see the same 'Hello Rails' page. Because if you check the rails server log you can see it made a request : GET '/welcome/index' and if you look at the config/routes.rb file, you see :
This line in routes was added when you ran the rails generator to create the welcome controller. This definition is used by the Rails router to handle this request. It knows the URI pattern of the format 'welcome/index' with http verb GET must be handled by the welcome controller, index action.
Delete the get
welcome/index line in the config/routes.rb file. Reload the page, by entering this URL in the browser :
You will now see the error page. Since we no longer need this route, we can ignore this error message because the home page will be accessed by typing just the domain name of your site like this:
In this lesson we wrote a simple Hello Rails program. We saw how the router recognizes the browser request and how the view and controller work in Rails to handle it. We have seen just the View and Controller part of MVC framework. We will see how the model fits in the MVC framework in the next lesson.
Ace the Technical Interview
- Easily find the gaps in your knowledge
- Get customized lessons based on where you are
- Take consistent action everyday
- Builtin accountability to keep you on track
- You will solve bigger problems over time
- Get the job of your dreams
Take the 30 Day Coding Skills Challenge
Gain confidence to attend the interview