概要
プロジェクト生成直後などに、コントローラーとアクションを生成してページをつくり、確認する。
生成時
- コントローラーファイルが生成される
- アクションに対してビューファイルが生成される
- リクエストに対するコントローラーとアクションのルーティングが定義される
実行時
- ユーザー側のブラウザー／クライアントからGETなどのリクエストでページが要求される
- リクエストはプロジェクトのroutes.rbファイルの内容に従ってコントローラークラスのアクションメソッドに送られる
- アクションメソッドは必要な内容を実行し、ビューファイルをレンダリング
- レンダリングされたページがコントローラーを介してクライアントに送られる
手順
ディレクトリーの移動
プロジェクトディレクトリーに移動する。
cd project_name
コントローラーとアクションの生成
以下のコマンドでコンローラーを作成する。アクションを指定しない時はaction_nameを省略してもよい。
rails generate controller controller_name action_name
プロジェクトディレクトリー下に以下のファイルが作成される。
app/controllers/controller_name_controller.rbapp/views/controller_name/action_name.html.erbapp/assets/stylesheets/controller_name.scss
コントローラーファイル
ファイルの位置とファイル名
app/controllers下のファイルにコントローラーのクラスが定義される。
クラスファイル名はスネークケース末尾に'_controller'がつけられる。拡張子は.rb。
controller_name_controller.rb
ファイルの内容
ファイル内容はクラス定義で、コントローラーとアクションを指定して生成した場合、以下が定義されている。
- コントローラークラス
- コントローラークラスは
ApplicationControllerクラスを継承 - クラス名はパスカルケースで、末尾に
'_Controller'がつけられるControllerNameController
- コントローラークラスは
- アクションメソッド
- コントローラークラスのメソッドとして定義される
- アクション名はスネークケース
- action_name
|
1 2 3 4 |
class DemoContentsController < ApplicationController def top_page end end |
後からアクションを追加する場合、コントロールクラスのメソッドとして追加し、ルーティングを設定する。
ビューファイル
ファイルの位置とファイル名
app/viewsディレクトリーの下にコントローラー名と同じフォルダーが作成され、その下にアクション名と同じ名前のスネークケースでアクションメソッドが定義される。拡張子は.html.erb。
app/views/demo_contents/top_page.html.erb
ファイルの内容
コントローラー追加直後のビューファイルの内容はシンプルで、コントローラー#ビューの表示がH1要素で、その場所がp要素で書かれている。
|
1 2 |
<h1>DemoContents#top_page</h1> <p>Find me in app/views/demo_contents/top_page.html.erb</p> |
後からアクションを追加する場合、アクション名と同じファイル名でhtml.erbファイルを作成し、その内容にHTMLを書いていく。
スタイルシート
ファイルの位置とファイル名
コントローラーを生成すると、アプリケーション固有のスタイルシートがapp/assets/stylesheetsにつくられる。ファイル名はコントローラーと同じスネークケースで拡張子は.scss。
app/assets/stylesheets/controller_name.scss
拡張子からわかるように、スタイルシートはSCSSで書くことを想定している。
ファイルの内容
ファイルの内容はコメントのみで、ゼロからスタイルを指定するようになっている。
|
1 2 3 4 |
[vagrant@localhost demo_app]$ cat app/assets/stylesheets/demo_contents.scss // Place all the styles related to the demo_contents controller here. // They will automatically be included in application.css. // You can use Sass (SCSS) here: https://sass-lang.com/ |
ルーティングファイル
ファイルの位置とファイル名
ルーティングファイルはconfigディレクトリー下のroutes.rbファイル。
config/routes.rb
ファイルの内容
コントローラーが生成されるのに合わせて、routes.rbに1行追加される。
|
1 2 3 4 |
Rails.application.routes.draw do get 'controller_name/action_name' # For details on the DSL available within this file, see https://guides.rubyonrails.org/routing.html end |
この場合、ブラウザー側からは以下のURLでアクセスするとアクションメソッドで指定したページが表示される。
localhost:3000/controller_name/action_name
確認
ここでプロジェクトディレクトリー下でRailsサーバーを立ち上げる
rails s -b 0.0.0.0
その後ホストのブラウザーで以下のURLを直に入力すると、シンプルなページが表示される。
localhost:3000/controller_name/action_name
ページの削除
コントローラーの削除は以下のコマンドで実行。
rails destroy controller controller_name
このコマンドでコントローラーファイルやビューファイルなどはきれいに削除されるが、routes.rbの記述だけは残るため別途削除する必要がある。
|
1 2 3 |
Rails.application.routes.draw do get 'controller_name/action_name' →この1行を削除 end |
実行例
コントローラーとアクションの生成
demo_appというプロジェクトを作成した後、demo_contentsというコントローラーとその下のtop_pageというアクションを定義する。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
[vagrant@localhost demo_app]$ rails generate controller demo_contents top_page Running via Spring preloader in process 23232 create app/controllers/demo_contents_controller.rb route get 'demo_contents/top_page' invoke erb create app/views/demo_contents create app/views/demo_contents/top_page.html.erb invoke test_unit create test/controllers/demo_contents_controller_test.rb invoke helper create app/helpers/demo_contents_helper.rb invoke test_unit invoke assets invoke scss create app/assets/stylesheets/demo_contents.scss |
コントローラーファイル
ファイルの位置と名前
app/controllersディレクトリーの下に以下のファイルが生成される。
demo_contents_controller.rb
ファイル名はスネークケースで、コントローラー名の後ろに_controllersが付加される。拡張子は.rb。
ファイルの内容
パスカルケースでコントローラークラスの空の定義が生成される。この場合はdemo_contentsからDemoContentsControllerクラスが定義され、メソッド名はスネークケースでtop_pageとなっている。
|
1 2 3 4 5 |
[vagrant@localhost demo_app]$ cat app/controllers/demo_contents_controller.rb class DemoContentsController < ApplicationController def top_page end end |
ビューファイル
新たに作成されたapp/views/demo_contentsディレクトリーに、アクションに対応したビューファイルが生成されている。
|
1 2 3 |
[vagrant@localhost demo_app]$ cat app/views/demo_contents/top_page.html.erb <h1>DemoContents#top_page</h1> <p>Find me in app/views/demo_contents/top_page.html.erb</p> |
この場合、ディレクトリー名がコントローラー名demo_contents、ビューファイル名がアクション名に基づいてtest_page.html.erbとなっている。
ファイルの内容はシンプルなHTML。
- H1要素でコントローラークラス名とアクション名(
DemoContents#top_page)を表示 - p要素でビューファイルのパスを表示(
app/views/demo_contents/top_page.html.erb)
スタイルシート
app/assets/stylesheets/に作成されたスタイルシート(demo_contents.scss)の内容を確認してみる。コメントのみの空の内容なのが確認できる。
|
1 2 3 4 |
[vagrant@localhost demo_app]$ cat app/assets/stylesheets/demo_contents.scss // Place all the styles related to the demo_contents controller here. // They will automatically be included in application.css. // You can use Sass (SCSS) here: https://sass-lang.com/ |
ルーティングファイル
config/routes.rbを確認すると1行追加されている。
|
1 2 3 4 5 |
[vagrant@localhost demo_app]$ cat config/routes.rb Rails.application.routes.draw do get 'demo_contents/top_page' # For details on the DSL available within this file, see https://guides.rubyonrails.org/routing.html end |
以下のURLでアクションで設定されたページが表示される。
localhost:3000/demo_contents/top_page
表示結果は以下のとおりシンプル。
