押さえておきたいWeb知識 
オススメのサービス!!
このページではRuby on Railsのviewの基礎知識を詳しく解説していきます。
最後まで読んでいただくことでRuby on Railsのviewの基礎知識を習得することができるようになります。
是非、読んでいただけたらと思います。
目次
1.viewとは?
RailsはMVCフレームワークとなっており、機能毎にModel、View、Controllerの3つに分かれています。
RailsのViewという機能で、Modelと連携を取りながら、適宜変化するWebページを作成することができます。
それでは実際にViewを使いながら、見ていきましょう。
このページでは「WebApp」というWebアプリケーションの作成、コントローラーの作成を終えているという前提でお話を進めていきます。
もし、Webアプリケーションの作成方法が分からない方は以下の記事をご覧ください。
[入門者向け] Ruby on Railsのアプリケーション作成方法を分かりやすく解説!
[入門者向け] Ruby on Railsのcontrollerを分かりやすく解説!
Webアプリケーションの作成を終えるとappフォルダの中にviewsフォルダが作成され、sampleコントローラーの作成を終えるとviewsフォルダの中にsampleフォルダが作成されました。
sampleコントローラーに対応するsampleビューのファイルはsampleフォルダに用意して作成していきます。
2.viewファイル作成
それでは早速sampleコントローラーに用意したindexというアクションメソッド用のviewファイルを作成していきましょう。
viewファイル名は「アクションメソッド名.html.erb」という名前でつけます。
末尾に「erb」という拡張子がついていますが、どのような意味を持っているのでしょうか。
「erb」は「Embedded Ruby」という技術をしたファイルという意味を持っています。
「erb」はhtmlタグの中に特殊なタグを埋め込んでRubyのコードを実行できるようにするための技術です。
Railsは「erb」を利用してテンプレートが作成されていきます。
今回はsampleフォルダに「index.html.erb」という名前でファイルを作成してください。
indexファイルを作成し終えたら、ファイル内に以下のようにコードを打ち込んでみましょう。
そのため、bodyタグの内容だけを記述しておけばいいのです。
3.stylesheetに記述
次にsampleフォルダ内に用意したindexファイルの内容をstylesheetで装飾していきましょう。
stylesheetフォルダはassetフォルダの中に用意されています。
stylesheetフォルダ内を見るとsample.scssというファイルが用意されているかと思います。
拡張子が「scss」となっていますが、「Sass」というスタイルシートを拡張したプログラムのファイルとなっています。
「Sass」はスタイルシートを記述するための言語の一つとなっています。
「Sass」は「Css」とはコードの記述の方法は異なりますが、cssでのコードも読み込むことができます。
ここではcssの方法でコードを記述していきます。
それでは、stylesheetの中に記述していきましょう。
上記のように記述しておくことでsampleというコントローラーがsample.scssというスタイルシートを読み込んでくれます。
そのため、スタイルシートを読み込ませるためのコードを記述する必要はありません。
4.コントローラーに記述
最後にsampleコントローラーにindexというアクションメソッドを追加しましょう。
indexというアクションメソッド内には何も記述されていません。
Railsではアクションメソッド内に何も記述されていない場合、アクションに対応するファイルを読み込み、ページを表示するようになっています。
ここでは、index.html.erbというファイルを読み込んで表示します。
サーバーを起動して、indexページにアクセスすると以下のように表示されます。
5.Ruby on Railsを学ぶことができるオススメの教材
Ruby on Railsを学習している皆様にオススメの教材をご紹介させていただきます。
現場で使える Ruby on Rails 5速習実践ガイド
以下の本はRuby on Railsの学習を一通り終えてある程度知識を身につけた方にオススメしたい本です。
「現場で使える Ruby on Rails 5速習実践ガイド」は現場で実際にどのように使われているのかという視点も交えて解説されています。
そのため、初心者の方が次のステップに進むために最適な本となっていますので、オススメです。
これらの本で是非学習を進めてみてはいかがでしょうか?
レベル別におすすめの本も紹介していますので、どのような本がオススメか知りたい方はこちらもご覧になって下さい。
[2022年最新版] Ruby on Railsを学ぶことができるおすすめの本/参考書
Udemy
UdemyではRuby on Railsを学ぶことができる講座を多数取り扱っています。
以下の記事でRuby on Railsを学ぶことができるオススメの講座をまとめていますので、よかったらご覧になって下さい。
[2021年最新版] Udemy(ユーデミー) おすすめのRuby on Rails講座
プログラミングスクール
TechAcademy、WebCamp、CodeCamp、Tech CampなどでRuby on Railsを学ぶことができます。
それぞれ無料体験も行っているので、どのようなものか試してみるのもいいでしょう。
以下の記事で各プログラミングスクールをまとめているのでこちらもよかったらご覧になってください。
いくら? 悪評は? TechAcademy(テックアカデミー)とは? 口コミもまとめてみました!
[受講した方の感想アリ!] DMM WEBCAMP SKILLSとは? 料金・口コミをまとめてみた!
[課題が難しい?] 初心者向け! CodeCamp(コードキャンプ)とは? 特徴・料金・口コミをまとめてみました!
[感想・体験談アリ!] 実際にTech Camp(テックキャンプ)のプログラミング教養でプログラミングをやってみた!
【体験談】Tech Camp(テックキャンプ)プログラミング教養の学習内容は?
働きながらTECH CAMP(テックキャンプ)で学ぶことはできるのか? 結論：可能です!
TECH CAMP(テックキャンプ)ではどのような言語・技術を学ぶことができるの?
TECH CAMP(テックキャンプ)の受講料はどのくらい? 安く通う方法もお話します!
[体験談・感想あり!]TECH CAMP(テックキャンプ)でどのようなスキルが身につくの?
6.ポイント
- コントローラーに用意したアクションメソッドに応じたビューを作成することで自動的に読み込んで表示させることができます
SAMURAI ENGINEER Plus+
リクナビ NEXT
