Skip to content

# Step 04 — Homepage Setup

Gerald Goh edited this page Aug 11, 2020 · 1 revision

The homepage will serve as the landing page when users first visit the application.

In the MVC pattern, controller receive specific requests and pass them along to the appropriate model or view. Currently rhe application displays the Rails welcome page when the root URL is loaded in the browser. To change this, create a controller and view for the homepage and match it to a route.

Rails provides a controller generator for creating a controller. The controller generator receives a controller name, along with a matching action.

Official rails documentation

$ rails g controller Homepage index

      create  app/controllers/homepage_controller.rb
       route  get 'homepage/index'
      invoke  erb
      create    app/views/homepage
      create    app/views/homepage/index.html.erb
      invoke  test_unit
      create    test/controllers/homepage_controller_test.rb
      invoke  helper
      create    app/helpers/homepage_helper.rb
      invoke    test_unit
      invoke  assets
      invoke    scss
      create      app/assets/stylesheets/homepage.scss

Running this command generates the following files:

  • A homepage_controller.rb file for receiving all homepage-related requests. This file contains the index action you specified in the command.

  • A homepage.js file for adding any JavaScript behavior related to the Homepage controller.

  • A homepage.scss file for adding styles related to the Homepage controller.

  • A homepage_helper.rb file for adding helper methods related to the Homepage controller.

  • An index.html.erb file which is the view page for rendering anything related to the homepage.

Root route in Rails specifies what will show up when users visit the root URL of your application.

Replace get 'homepage/index' with root 'homepage#index'.

/config/routes.rb

Rails.application.routes.draw do
  root 'homepage#index'
  # For details on the DSL available within this file, see http://guides.rubyonrails.org/routing.html
end

Verify application is working:

rails s --binding=127.0.0.1

Delete the contents of the /app/views/homepage/index.html.erb file. By doing this, will ensure that the contents of index.html.erb do not interfere with the React rendering of your frontend.

<h1>Homepage#index</h1>
<p>Find me in app/views/homepage/index.html.erb</p>