前のパートに戻る 完了して次のパートへ  

  2-1 Top画面の作成

Top画面の作成


この章で学べること


この章では以下の内容について学ぶことができます。

- コントローラーの作成
- rootURLの設定
- Deviseを使ったユーザー新規登録・サインイン機能の実装
- Bootstrap
- font-awesome-sass
- Viewportについて
- カラムの追加
- jQueryを使用した画像のプレビュー
- carrierwaveを使用した画像アップロードの処理

学習キーワード


- コントローラー
- ルーティング

top_controllerを作成する


まずtop_controllerを作ります。controllerは以下の「rails g controller コントローラー名」コマンドで作成できます。以下のようにアクション名を追加して、「rails g controller コントローラ名 アクション名」と続けることも可能です。

$ rails g controller top index

上記の例では、後ろにindexをつけることでtopコントローラーとindexアクションを一緒に作成してくれます。

詳しくは、 コントローラとアクションの作成とルーティングの設定 - Ruby on Rails入門 を参考にしてみてください。

topコントローラのindexアクションをroot_urlに設定


先ほどの操作でtopコントローラーを作成した際、ルーティングの設定へtopコントローラーのindexアクションが追加されました。

ブラウザからアプリケーションの「/」ルートにアクセスしたとき、topコントローラーのindexアクションが呼ばれるようにします。 そのためにconfig/routes.rbを以下のように編集してください。

config
└── routes.rb


書き変えたら、ターミナル上で「rails s」とコマンドを実行してローカルサーバーを立ち上げてhttp://localhost:3000/ を開いてください。 以下の画面のようにtop#indexと表示されていれば問題なく動作しています。 (すでにローカルサーバーが立ち上がっている場合はサーバーを再起動してください)

6774fc6b87a9fb5381b91a4c4c84dede.png

以上で今回のパートは終了です。

議論
2 質問