初学者によるプログラミングMemo #10 View基礎知識
はじめに
今回はViewの基礎知識についてそこしお話しします
なお、本記述はMacにおいて、Railsでの開発を前提としています
また、まだまだひよっこですので、不備等ございましたらご指摘いただけると幸いです
目次
- Viewの役割
- application.html.erbデフォルトでの役割
Viewの役割
Viewの役割はもちろん画面の表示処理です
それだけだとMemoにならないので、Viewファイルの階層構造も一緒に説明します
一例がこちら
*hamlを使っていますが、ファイル名としては末尾が.hamlか.erbかの違いだけで、置き場所や役割は同じです
Viewsの中がアプリケーションのViewファイルの置き場所です
"rails new"をした場合、自動的にこのディレクトリが作成されますが、中身として"layouts"のディレクトリも同時に作成されます
画像内での"groups"や"users"は、他のモデルやコントローラと連動する名前にしなければいけません
そうすることで、Railsが自動的に各モデルやコントローラーとの関係を認識し、処理を行ってくれます
コントローラーの話が少し入ってきますが、例えば"groups_controller"に"index"アクションを加えたとしましょう
そのアクションに対応する"view"は、"views/groups/index.html.erb"となります
このようにたかだかファイル名と思われるかもしれませんが、非常に重要になってきます
application.html.erbのデフォルトでの役割
先ほど少し触れた"layouts"のディレクトリ内には"application.html.erb"というファイルも自動生成されます
イメージとしてはviewの統括者とでも思っていただければいいです
例えばこのQiita記事のheaderにあたる部分はどの記事を閲覧しに行っても、マイページを開いても共通ですよね
このように、どのページでも共通している部分に関しては、application.html.erbに記述するだけで、各viewファイルに書かなくても、全てに反映させることができます
これは、デフォルトでは全てのビューが読み込まれるときに、application.html.erbが読み込まれるからです
基本的にはヘッダーとフッターを書くことが多いかと思います
また、装飾となるcssを全体に反映させるのもこのファイルへの記述で行います
cssの読み込み
application.html.erbにstylesheet_link_tag 'application'という記述があります
この記述により"app/assets/stylesheets/application.css"が読み込まれます
そして、"application.css"には"require tree ."という記述があるので、この記述のおかげで、同じディレクトリにあるcssファイルを全て読み込むことができます
まとめ
- viewの役割は画面への表示
- ディレクトリ名やファイル名はコントローラーやモデルと連動した名前にする
- application.html.erbには共通して表示させたい項目を記述する
Author And Source
この問題について(初学者によるプログラミングMemo #10 View基礎知識), 我々は、より多くの情報をここで見つけました https://qiita.com/Ikuy_h/items/2490575a3a14fc58f315著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .