30DAYSトライアル4th

30DYASトライアル4th(Rails)のまとめ【DAY11】

4th(Rails)DAY11の課題は「Progate Rails コース(1章まで)」です。

いよいよRuby on Railsに突入します。

DAY11学習範囲の全体イメージ

Railsで開発を始める

Railsで開発を始めるにはターミナルで以下のコマンドを実行する。

実行するとカレントディレクトリにアプリケーション名と同じ名前のフォルダが作成される。

フォルダイメージ

・アプリケーション名/
  ∟app/
  ∟config/
  ∟db/
 ・
 ・
 ・

サーバーの起動

ターミナルで以下のコマンドを実行するとRailsのWebサーバーを起動することができる。(コマンドを実行したターミナルはそのままにしておく必要がある)

サーバーを起動するとブラウザで「localhost:3000」にアクセスするとRailsのページを確認することができる。

Webページを自動生成する

ターミナルで以下のコマンドを実行することWebサイトを自動生成することができる。

作成したコントローラの配下にWebページを追加する

既に作成したコントローラにWebページを追加する場合は、Webページを自動生成した際に使用したコマンドは使用できないので、以下を手動で行う。

作成したコントローラの配下にWebページを追加する方法
  1. ルーティング(アプリケーション名/app/config/routes.rb」に以下のコードを追加
  2. コントローラ(アプリケーション名/app/contorollers/コントラーラ名_contoroller.rb」に以下のコードを追加
  3. ビューを作成する(アプリケーション名/app/views/コントローラ名/アクション名.html.erb)

Webページのスタイルを編集する

CSSは「アプリケーション名/assets/stylesheets/コントローラ名.scss」に格納されている(rails generate controllerコマンドで作成される)。

このファイルを修正することで対応するコントローラの全てのビューに対してCSSが適用される。

Webページに画像を表示させる

画像は「アプリケーション名/public」フォルダに保存しておくことで、「/画像ファイル名」でCSSに指定することができる。

localhost:3000のルーティング

ルーティングを「get “/” = “コントローラ名#アクション名”」とすることでlocalhost:3000のルーティングを変更することができる。

リンクを作成する

ビューファイルのaタグのhref要素の指定をルーティングのURLと同じ記述にすることでリンクを作成することができる。

まとめ

Railsを使用してTOPページとaboutページを作成しながら、コントローラやアクション、ビューなどRailsの根幹の仕組みの理解が中心の内容でした。

コントローラなどを理解していないと、今後必ずつまづくはずなので、よくわくわからないからと投げ出すのではなくて、何周かしてでも理解する必要があります。

僕はProgateの学習内容以外に可能な限り図解してまとめようとしていますが、その時にRailsにおけるMVC(モデル/ビュー/コントローラ)がとても参考になりました。

ただ提示された内容をこなすだけではなく、自分なりにまとめてみるとかなり頭に入りやすくなるのでおすすめです。

ABOUT ME
Jyu2
【PC1台で稼ぐブロガー兼Webエンジニアを目指し中】IT情報やWebサービス、アプリなどの情報を発信/SIerで10年以上勤務→ストレスMAXで休職中→ブログとWebの学習を行い脱サラ計画中/ #30DAYSトライアル 1st完了→2nd実施中 / 日々の学習内容をブログにアウトプット / まずは月収5万円を目指す