この記事のスコープ
- railsで平文の画面を出す。
- 画面に変数を渡して動的に処理を動かす。
名前 | ver |
ruby | 3.3.0 |
Rails | 7.1.3.2 |
1. controllerを作成する
下記コマンドを叩く。
rails generagte controller {コントローラー名} {アクション名}
今回は{users}コントローラーで{index}アクションを生成してみます。
(以下「users」と記載部分はコマンドで入力した「コントローラー名」、「index」と記載のある部分は「アクション名」と読み替えてください。)
% rails generate controller users index
create app/controllers/users_controller.rb
route get 'users/index'
invoke erb
create app/views/users
create app/views/users/index.html.erb
invoke test_unit
create test/controllers/users_controller_test.rb
invoke helper
create app/helpers/users_helper.rb
invoke test_unit
作成されるファイル
% git status
On branch master
Changes not staged for commit:
(use "git add <file>..." to update what will be committed)
(use "git restore <file>..." to discard changes in working directory)
modified: config/routes.rb
Untracked files:
(use "git add <file>..." to include in what will be committed)
app/controllers/users_controller.rb
app/helpers/users_helper.rb
app/views/users/
test/controllers/users_controller_test.rb
generate controller コマンドで実際に行われていること
config/routes.rb
ルーティング(url)を追加している。
Rails.application.routes.draw do
get 'users/index' # ここを追加
app/controllers/{controller名}_controller.rb
メインのコントローラーの処理を記述されるファイル。
下記クラスが自動で生成されるのでindex関数をよしなに変更してコントローラーを作成する。
class UsersController < ApplicationController
def index
end
end
app/helpers/{コントローラー名}_helper.rb
controllerで呼び出す実装の詳細を書くためのもの。
自動で空の関数が生成されるのでよしなに作成する。
module UsersHelper
end
app/views/{コントローラー名}/{アクション名}.html.erb
画面に反映されるhtmlファイル。
※erbファイル: embedded ruby の略、htmlファイルにruby を記述して動的に画面を記述することができる。pythonでいうjinjaテンプレートにあたるもの?
<h1>Users#index</h1>
<p>Find me in app/views/users/index.html.erb</p>
test/controllers/{コントローラー名}_controller_test.rb
app/controllers/{コントローラー名}_controller.rbのテストコード。
require "test_helper"
class UsersControllerTest < ActionDispatch::IntegrationTest
test "should get index" do
get users_index_url
assert_response :success
end
end
現状でサーバーを起動してみる。
rails s
コマンドを叩いてサーバーを起動。
その後、url/{コントローラー名}/{アクション名}
を叩いてみると下記のような表示に。
現状はテンプレのまま。
![](https://imarin.net/wp-content/uploads/2024/05/スクリーンショット-2024-05-06-21.40.56.png)
2. views配下のhtmlファイルを編集
現状のままでも画面が表示されるが、テンプレのFind me in app/views/users/index.html.erb
しか出ない。
app/views/users/index.html.erbを下記のように変更してみる。
hello
再びサーバーを起動
helloと出た。
![](https://imarin.net/wp-content/uploads/2024/05/スクリーンショット-2024-05-06-21.39.22.png)
3. htmlファイルに変数を渡す。
helloと出たが、これだけだと味気ないので変数を渡してみる。
下記のように「@変数名」つけて渡す。
- controller側: 「@変数名」で作成されたメソッドの中に定義
- view側: 「<%= @変数名 %>」の形式でhtmlの中に記述
試しに現在の日付を渡してみる。
app/controllers/users_controller.rb
class UsersController < ApplicationController
def index
@now_month = Time.now.month.to_s
@now_day = Time.now.day.to_s
end
end
app/views/users/index.html.erb
hello 今日は<%= @now_month %>月<%= @now_day %>日です。
再びサーバーを起動
日付が渡せた!
![](https://imarin.net/wp-content/uploads/2024/05/スクリーンショット-2024-05-06-21.55.11.png)
終わり
超ミニマムで画面を動的に表示してみました。
少しでも画面を動かしてみるとちょっとわかってきたかも感。
ディレクトリ名でMVCがくっきりわかれてて処理の責任が明確なのがいいなって思いました。
今回はこれで。(´∀`)ノシ