ちょびのプログラミング学習 Ralis-3

テクノロジー
この記事は約10分で読めます。
0

どうも、ちょびブログのちょびです

今回はRailsの学習パート3になります。


前回は、Railsコマンドの「scaffold」を使って

ソッコーでユーザー管理ができるアプリを作成しました。


今回は、そのアプリを構成しているプログラム

エディターを使って覗いていきます。

スポンサーリンク

ちょびブログのPC


この記事通りにプログラミングをしても

PCによっては上手く動作しない可能性があるので注意してください。


参考までに、僕のPC環境を紹介しておきます。

ちょびブログのPCスペック

スポンサーリンク

アプリの構成(MVC)


まず、Railsアプリを語る上で「MVC」を理解しておく必要があります。


いきなりよくわからない言葉が出てきましたが…

これは「M (モデル)」「V (ビュー)」「C (コントラーラー)」

Railsはこれらの概念でアプリを構成しています。


MVC(モデル・ビュー・コントローラー)

教本によると、UIに関するアーキテクチャの一種とされています(←はい、わかりません。)

もう少し噛み砕くと、

Railsで作成されたようなWebアプリでは主に、

ユーザーから受けた入力や、その他データなどを処理するために

M・V・Cの3つに役割分担して処理する仕組みです。

今回はそのMVCとその働きを見ていきましょう。

M-モデル


モデルはアプリケーション内のデータとデータのやりとりや、

それぞれの処理を論理的に実行するオブジェクトです。


その他にも、アプリケーション独特の処理を追加したい時も

モデルにメソッドとして記載することで使うことができます。


データベースとのやりとりもモデルが担当しています。


エディターで「scaffold_app」を開きます

(僕はVScodeを使用)

すると、たくさんのファイルで構成されていることがわかります。


まずは「userモデル」を見るために「user.rb」を開きましょう

app/models/user.rb

user.rb

たったこれだけしかコードがありません

でも安心してください、

これだけでもしっかり機能しています。


データベースとやりとりをしたり、

ここにメソッドなどを書くことで機能を追加することもできます。

V-ビュー


次にビューを見ていきます

ビューはその名の通り、見た目を担当するオブジェクトです。


Webアプリケーションでのビューファイルは、

決められたHTMLで動的な動作をすることが多いのでテンプレートファイルと呼んだりします。


決められた動作をアクションと呼び、

ビューファイルは通常、「アクション名.html.erb」という名前で作成します

例えば、「index」なら「index.html.erb」となります。


それではエディターでビューファイルも見ていきましょう。


ビューファイルの「index.html.erb」を開きます

app/views/users/index.html.erb

index.html.erb

今回はモデルに比べてたくさんのコードが表示されました。


コードの多くはHTMLで書かれているのですが

Railsで表現を制御している箇所はRailsの書き方で書かれています。


例えばタグで<%= %>といった書き方はRailsでの書き方ですし、

Railsのヘルパーメソッドとして「link_to」といったものもあります

これは一見ただのリンクなのですが、

この後の章に出てくるコントローラーで取得した情報をもとに

そのリンクの行き先(パス)が変わります。

C-コントローラー


最後にコントローラーです

コントローラーは簡単にいうと仕事の振り分けを担当しています。


Webアプリケーション上でリクエストを受けたときに

そのリクエストに対してあらかじめコントローラーに定義した処理を実行します。


例えば前の記事でも表示した、ユーザー画面一覧を表示したいとします

そのためにはURLの後ろに「/users」を追記しました

これが「リクエスト」です。


http://localhont:3000/users

すると、プログラムの中ではリクエストによってコントローラーが呼ばれ

「usersコントローラー」の「一覧画面(index)」の処理が実行されます。


ユーザー一覧画面

usersコントローラーの中身を見てみましょう

「users_controller.rb」を開きます

app/controller/users_controller.rb

users_controller.rb

すると5行目に「def index」という記述があります

今回のユーザー画面一覧表示では

リクエストが送られることで、これが実行されているのです。

スポンサーリンク

さいごに


今回はすごくざっくりとMVCについて説明しました。


どうですか?理解しにくいでしょう?笑


僕もテックキャンプで学び始めた時は全く理解できず困りました。


とりあえずいまは

MVCのおかげでWebアプリケーションはユーザーにあった、

動的な(人によってそれぞれ違う)表示ができていると思ってください。


次回はこのMVCの他にもたくさんあるファイル構成を説明しようかと思っています。

0

コメント