MVC architecture in Rails - Mini Project: Build & Apply

MVC Architecture in Rails

📖 Scenario: You are building a simple blog application where users can see a list of posts. You will create the basic parts of the MVC (Model-View-Controller) architecture in Rails to display posts.

🎯 Goal: Build a Rails MVC structure with a Post model, a PostsController controller, and a view that shows all posts' titles.

📋 What You'll Learn

Create a Post model with a title attribute

Add a controller called PostsController with an index action

Set up a route for posts#index

Create a view to display all post titles

💡 Why This Matters

🌍 Real World

Most Rails web apps use MVC to organize code cleanly. This project shows how data flows from database to user screen.

💼 Career

Understanding MVC in Rails is essential for backend and full-stack developer roles working with Ruby on Rails.

1

Create the Post model with a title attribute

Generate a Rails model called Post with a string attribute title using the Rails generator command.

Ruby on Rails

# Your code here

Hint

Use the Rails generator command to create a model with a string attribute.

2

Add the PostsController with an index action

Create a controller called PostsController with an index action that fetches all posts and stores them in @posts.

Ruby on Rails

class PostsController < ApplicationController
  # Your code here
end

Hint

Define the index method inside PostsController and assign Post.all to @posts.

3

Set up the route for posts#index

Add a route in config/routes.rb that maps GET /posts to the index action of PostsController using resources :posts, only: [:index].

Ruby on Rails

Rails.application.routes.draw do
  # Your code here
end

Hint

Use the resources method with only: [:index] to create the route.

4

Create the view to display all post titles

Create a view file app/views/posts/index.html.erb that loops over @posts and displays each post's title inside an <li> element within an unordered list.

Ruby on Rails

Hint

Use ERB tags to loop through @posts and display each post.title inside <li>.

Practice

1. In the MVC architecture of Rails, which component is responsible for handling user input and controlling the flow of the application?

easy

A. Controller

B. Model

C. View

D. Router

Solution

1. Step 1: Understand MVC roles

   The Model manages data, the View displays data, and the Controller handles user input and application flow.

2. Step 2: Identify the component for user input

   The Controller receives user requests and decides what to do next.

3. Final Answer:

   Controller -> Option A

4. Quick Check:

   Controller = handles user input [OK]

Hint: Controller manages user actions and app flow [OK]

Common Mistakes:

• Confusing Model with Controller
• Thinking View handles user input
• Selecting Router as MVC component

2. Which of the following is the correct way to define a controller class in Rails?

easy

A. class UsersController inherits ApplicationController; end

B. def UsersController < ApplicationController; end

C. class UsersController < ApplicationController; end

D. controller UsersController extends ApplicationController {}

Solution

1. Step 1: Recall Ruby class syntax

   In Ruby, classes are defined with class ClassName < ParentClass and closed with end.

2. Step 2: Match Rails controller syntax

   Rails controllers inherit from ApplicationController using < syntax.

3. Final Answer:

   class UsersController < ApplicationController; end -> Option C

4. Quick Check:

   Ruby class syntax = class UsersController < ApplicationController; end [OK]

Hint: Use Ruby class inheritance syntax with < [OK]

Common Mistakes:

• Using 'def' instead of 'class'
• Using 'inherits' keyword (not Ruby)
• Using JavaScript-like syntax

3. Given the following Rails controller code, what will be the rendered output when visiting /welcome/index?

class WelcomeController < ApplicationController
  def index
    @message = "Hello, Rails!"
  end
end

And the view file app/views/welcome/index.html.erb contains:

<h1><%= @message %></h1>

medium

A. Hello, Rails!

B. @message

C. Error: undefined variable @message

D.

Solution

1. Step 1: Understand controller instance variable

   The controller sets @message to "Hello, Rails!" which is accessible in the view.

2. Step 2: Evaluate view rendering

   The view uses ERB tag <%= @message %> to insert the string value inside the <h1> tag.

3. Final Answer:

   <h1>Hello, Rails!</h1> -> Option A

4. Quick Check:

   Instance variable passed to view = <h1>Hello, Rails!</h1> [OK]

Hint: Instance variables in controller show in views with <%= %> [OK]

Common Mistakes:

• Using local variables instead of instance variables
• Forgetting = in ERB tag
• Expecting variable name printed literally

4. Identify the error in this Rails controller code snippet:

class ProductsController < ApplicationController
  def show
    @product = Product.find(params[:id])
  end

  def index
    @products = Product.all
  end
end

What is the likely cause of a runtime error when visiting /products/show without an id parameter?

medium

A. Method index should be defined before show

B. Missing id in params causes find to raise an exception

C. Instance variables cannot be used in controllers

D. Controller class name should be ProductController not ProductsController

Solution

1. Step 1: Analyze show method usage

   The show method calls Product.find(params[:id]), which requires a valid id parameter.

2. Step 2: Understand missing parameter effect

   If params[:id] is missing, find raises an ActiveRecord::RecordNotFound error causing a runtime failure.

3. Final Answer:

   Missing id in params causes find to raise an exception -> Option B

4. Quick Check:

   Missing param causes error = Missing id in params causes find to raise an exception [OK]

Hint: Always check required params before calling find [OK]

Common Mistakes:

• Thinking method order matters
• Believing instance variables are invalid
• Confusing singular/plural controller names

5. You want to display a list of all users with their email addresses in a Rails app. Which MVC components should you update and how? A) Update the Model to fetch users, Controller to assign users to a variable, and View to loop and display emails. B) Update only the View to query the database and display emails. C) Update the Controller to fetch users and display emails directly without a View. D) Update the Model to display emails and Controller to fetch users.

hard

A. Update Model to display and Controller to fetch

B. Update View only to query and display

C. Update Controller only to fetch and display

D. Update Model to fetch, Controller to assign, View to display

Solution

1. Step 1: Understand MVC responsibilities

   The Model handles data fetching, the Controller prepares data for the View, and the View displays data.

2. Step 2: Apply MVC to user list display

   The Model fetches users, Controller assigns them to an instance variable, and View loops through to show emails.

3. Final Answer:

   Update Model to fetch, Controller to assign, View to display -> Option D

4. Quick Check:

   MVC separation = Update Model to fetch, Controller to assign, View to display [OK]

Hint: Model fetches, Controller assigns, View displays [OK]

Common Mistakes:

• Putting database queries in the View
• Displaying data directly in Controller
• Making Model handle display logic