Getting Started with Ruby on Rails

Build Blog with Ruby on Rails (Part 1)
Luan Nguyen
Luan Nguyen
Aug 16, 2020 · 4 min read

What’ll you learn?

  • Understanding MVC Architecture in Ruby on Rails
  • Install Ruby on Rails
  • Create a new Rails application
  • Create new Rails Controller through add Homepage to application

Source: @jeremybishop in Unsplash.com


This is part 1 in Project: Build Blog with Ruby on Rails
______

Introduction MVC Architecture in Ruby on Rails

MVC (Model - View - Controller) is an architectural pattern of a software application. This architecture is popular for designing web applications.
It separates an application into the 3 main components:
  • Models (Active Record): handle data and business logic.
  • Views (ActionView): handle user interface objects and presentation.
  • Controllers (ActionController): between the Model and View, receiving user input and deciding what to do with it.
Request-Response Cycle in Rails application

  1. The user opens the browser, types in a URL and presses Enter. Then, the browser send a request to application.
  2. The request hits the Rails Router.
  3. The router maps the URL to the correct Controller and action to handle the request.
  4. The action receives the request and asks the Model to fetch data from the database.
  5. The model returns a list of data to the controller action.
  6. The controller action passes the data on to the view.
  7. The View renders the page as HTML.
  8. The controller sends the HTML back to the browser and the user sees it.

Installing for Rails

Prerequisites:
  • RVM
  • Ruby
  • Yarn and Node.js
Installing RVM (Ruby Version Manager):
RVM is a command-line tool for installing and manage multiple versions of Ruby and easily change to which version you want to use.

Install GPG keys:
gpg --keyserver hkp://pool.sks-keyservers.net --recv-keys 409B6B1796C275462A1703113804BB82D39DC0E3 7D2BAF1CF37B13E2069D6956105BD0E739499BDB

Install RVM:
\curl -sSL https://get.rvm.io | bash -s stable

Check RVM version
rvm version
=> rvm 1.29.10

Installing Ruby using RVM:
rvm install 2.6.3

Check ruby version:
ruby --version
=> ruby 2.6.3

Installing Yarn 
# On Ubuntu (https://classic.yarnpkg.com/en/docs/install#debian-stable)
curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add -
echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list
sudo apt update && sudo apt install yarn

Verify the Yarn version:
yarn --version
=> 1.21.1

Installing Node.js (v10.x)
# On Ubuntu
curl -sL https://deb.nodesource.com/setup_10.x | sudo -E bash -
sudo apt-get install -y nodejs

If you need to install another version, for example 14.x, just change setup_10.x with setup_14.x
Verify that the Node.js installed successfully:
node --version
=> v10.19.0

Installing Ruby on Rails
To install Rails v6.x, we use the gem install command provided by RubyGems:
gem install rails -v 6.0.2.1

Check Rails version after installing Rails:
rails --version
=> Rails 6.0.2.1


Create a new Rails application 

rails new blog --version=6.0.2.1

After creating a blog application, switch to its folder:
cd blog

Install Gems for our application:
bundle install

Starting up the Web Server:
rails server

To see application, open your browser and navigate to http://localhost:3000/
You’ll see the Rails default page:
Rails default page

And to stop the web server, hit Ctrl+C in the terminal.


Create Homepage

  • What does Rails Controller do?
  • What is Rails Router?
  • Create a new Controller with a action in the controller
  • Add Route to Rails Router
What does Rails Controller do?
  • Controller (ActionController) is the C in MVC. After the Rails Router has determined which controller to use for a request, the controller is responsible for making sense of the request, and producing the appropriate output.
  • Follow the Request-Response Cycle in Rails application in above, controller is where:
    • Receive request from Rails Router
    • Communication with Model to fetch data
    • Render View to the user.
What is Rails Router?
The Rails router recognizes URLs and determines which action of the controller to handle request from user.

Create Home controller with index action:
rails generate controller Home index

Rails will generate some files and a route for you:
create  app/controllers/home_controller.rb
route  get 'home/index'
invoke  erb
create    app/views/home
create    app/views/home/index.html.erb
invoke  test_unit
create    test/controllers/home_controller_test.rb
invoke  helper
create    app/helpers/home_helper.rb
invoke    test_unit
invoke  assets
invoke    scss
create      app/assets/stylesheets/home.scss

Open the app/views/home/index.html.erb file and replace existing code with below code:
<h1>This is my home page</h1>

Restart web server (Ctrl+C to stop server and rails server to start server) and navigate to http://localhost:3000/home/index in your browser. You’ll see the "This is my home page" message you put into views/home/index.html.erb

Rails Router (in config/routes.rb) where defines routes of Rails application.
Open the file config/routes.rb
Rails.application.routes.draw do
  get 'home/index'
  # For details on the DSL available within this file, see   
  http://guides.rubyonrails.org/routing.html
end
get 'home/index'  tells Rails to map requests to http://localhost:3000/home/index to the home controller's index action.

Add the line of code root 'home#index'. It should look something like:
Rails.application.routes.draw do
  get 'home/index'
  root to: 'home#index'
end
root 'home#index'  tells Rails to map requests to the root of the application to the home controller's index action.

Restart web server and navigate to http://localhost:3000/ , you will see the “This is my home page” message. 

Conclusion

In this article, I guided you step-by-step to install Rails and create a new Rails application. Also, help you understand about MVC Architecture in Ruby on Rails application.

In the Part 2, I'm going to share with you about CRUD and how to use CRUD to create quickly Post for Blog application.