【Ruby/Ruby on Rails】頭に入れておきたいスキームまとめ【プログラミング学習開始135日目】

# はじめに
明日、志望しているWeb系企業の実技面接があります。

実技面接にてどのようなことを問われるのかは分かりませんが、初学者でも最低限これだけは説明できるのが望ましいのではないかというWeb制作におけるスキームなどを抜粋し、まとめを作成してみました。

面接にて要点を説明できるようにすることがこの記事の目的です。

# Railsを用いたWeb制作について頭に入れておきたいスキーム
## Railsのインストール～アプリの雛型作成までの流れ

```:Railsのインストール
(Homebrew, rbenv, ruby等はインストール済であるとして)
$ gem install rails
$ rails -v    # railsのバージョン確認
```

```:新規Railsアプリケーションの作成
(cdコマンドで対象ディレクトリに移動した後)
$ rails new　　アプリ名
```

```:gemのインストール
(Gemfileを編集した後)
$ bundle install

(本番環境用のgemをローカルの環境にはインストールしたくない場合は)
$ bundle install --without production
```

```:Railsサーバーの起動
$ rails s
この後、ブラウザにて localhost:3000　にアクセス
```

![image.png](https://qiita-image-store.s3.amazonaws.com/0/307533/69cb700c-38d9-c0af-1bf4-099530b3e5fb.png)

## ブラウザにWebサイトが表示するようになるまでの流れ(モデル、コントローラの生成、ルーティングの設定、ビューの編集)

```:コントローラの生成
$ rails g controller StaticPages home    # この場合はstatic_pagesコントローラとhomeアクションを生成
```

```app/controllers/static_pages_controller.rb
# homeアクションが生成されていることを確認 

class StaticPagesController < ApplicationController
  def home
  end
end
```

```config/routes.rb
# ルーティングの設定（書き方は色々あるので場面に応じて適当なものを選択）

# パターン(1) root_pathとして設定したい場合
root 'static_pages#home'

# パターン(2) 個別にルーティングを設定したい場合
get '/', to: 'static_pages#home'

# パターン(3) resourcesメソッドを使ってpathを一気に指定したい場合
resources :static_pages    # 「, only: :home」のように必要なものだけ選ぶことも可能
```

```html:app/views/static_pages/home.html.erb
<!-- ビューファイルの編集 -->
<!-- ビューファイルを生成していない場合はtouchコマンド等でビューファイルを作成する -->

<h1>StaticPages#home</h1>
<p>例えば、ここに"Hello, World!"とか書いてみる</p>
```

```:Railsサーバーの起動・ブラウザでの確認
$ rails s
localhost:3000 にアクセス
```

![image.png](https://qiita-image-store.s3.amazonaws.com/0/307533/8a90177e-2a53-a701-fc7c-fc20c31d0340.png)

## マイグレーションファイルの生成、属性の追加

```:モデルの生成
(name属性とemail属性を有するUserモデルを生成したい場合)
$ rails g model User name:string email:string
```

```app/models/user.rb
# モデルが生成できているか確認
class User < ApplicationRecord
end
```

```db/migrate/20190108120018_create_users.rb
# マイグレーションファイルが問題なく生成されているか確認
class CreateUsers < ActiveRecord::Migration[5.2]
  def change
    create_table :users do |t|
      t.string :name
      t.string :email

      t.timestamps
    end
  end
end
```

```:マイグレーションの適用
$ rails db:migrate
db/development.sqlite3 というファイルが生成される ＆ usersテーブルにname属性とemail属性が追加される
```

## モデルの関連付けの流れ

例えば、下図のようにUserモデルとMicropostモデルが1対多の関係の場合を想定する。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/307533/e9ef02f7-a6be-af63-bd52-42b37cb6727c.png)
(出典：[Railsチュートリアル13章1.3節](https://railstutorial.jp/chapters/user_microposts?version=5.1#sec-user_micropost_associations))

まず、`belongs_to :user`を用いてマイクロポストは1人のユーザーに紐付いていることを明示する。

```app/models/micropost.rb
class Micropost < ApplicationRecord
  belongs_to :user    # マイクロポストは1人のユーザーに紐付いている
  ・
  ・
  ・
end
```

次に、`has_many :microposts`を用いてユーザーは複数のマイクロポストを有していてもOKであることを明示する。
また、`dependent: :destroy`を追記することでユーザーを削除したらマイクロポストも削除されるように設定する。

```app/models/user.rb
class User < ApplicationRecord
  # ユーザーは複数のマイクロポストを有していてもOK、且つ、ユーザーを削除したらマイクロポストも削除されるように設定
  has_many :microposts, dependent: :destroy
  .
  .
  .
end
```

すると、例えばmicropostsコントローラのcreateアクションにて`@user.books.build`のような形でユーザーに紐付いたマイクロポストの投稿が可能となる。

```app/controllers/microposts_controller.rb
 class MicropostsController < ApplicationController
  ・
  ・
  ・
  def create
  @user = User.find_by(id: params[:id])  
  @micropost = @user.microposts.build(micropost_params)    # ユーザーに紐付いたマイクロポストを投稿
  ・
  ・
  ・
  private

    def micropost_params
      params.require(:micropost).permit(:content)
    end
end
```

## Gitによるバージョン管理の流れ

```:アプリ作成後、初プッシュを想定
(名前・メールアドレスの登録、GitHubにて新規リポジトリの作成などは完了しているとして、)
$ git init                        # Gitのリポジトリの新規作成
$ git add -A                      # 共有したいファイルの選択（-Aとすると修正ファイルを自動で全てステージングエリアへ移動）
$ git commit -m "メッセージ"        # 選択したいファイルの記録
$ git remote add origin リモートのURL    # リモートの登録
$ git push origin master          # ファイルのアップロード
```

```:アプリ制作時のバージョン管理の流れ
$ git checkout -b ブランチ名    # ブランチを切る

〜 アプリ制作・ファイルの編集 〜

(一段落着いた後、)
$ git add -A
$ git commit -m "何をしたか伝わるようなメッセージを記入"
$ git push origin ブランチ名

〜 GitHubに行ってプルリク申請・共同開発者とやり取り 〜

(納得したものが出来たら)
$ git checkout master    # masterブランチだったり、developブランチだったりする
$ git merge ブランチ名     # ファイルのマージ
$ git push origin master # ファイルのアップロード
```

## rails generateのやり直し

```
$ rails destroy controller StaticPages home
$ rails destroy model StaticPages
```

## rails db:migrateのやり直し

```
$ rails db:rollback    # 1つ前の状態に戻す
$ rails db:migrate VERSION=0    # 最初の状態に戻す
```

## bundle installとbundle updateの違い

簡単に言えば、

- `bundle install`は元々あったgem自体には手を加えずに`gemfile.lock`を更新
- `bundle update`は必要であれば元々あったgemも含めて`gemfile.lock`を更新

## 埋め込みRuby、<%= %>と<% %>の違い

- `<% ・・・ %>`とするとテンプレートには反映されない状態で埋め込まれる（＝検証ツールでは確認できない）
  - if文やeachメソッドの記述の際に利用される
- `<%= ・・・ %>`とするとテンプレートに反映される状態で埋め込まれる（＝検証ツールではHTMLのタグとして確認できる）
  - link_toヘルパーなどの記述で利用される

## Railsでリンク付き画像を埋め込む方法

```erb:リンク付き画像を埋め込む方法
<%= link_to "https://~", target: "_blank" do %>
  <%= image_tag "画像の名前.jpg" %>
<% end %>
```

## デバッグの方法

`byebug gem`を用いたデバッグを想定、gemはインストール済とする

＜使い方＞

- デバッグをしたいところ(エラーが起きてそうなところ)に`debugger`メソッドを挿入する
- `debugger`メソッドを挿入したら、ブラウザから目的のURLにアクセス
- Railsサーバーを立ち上げたターミナルを確認
- `byebug`プロンプトが表示されており、アプリケーションの`debugger`が呼び出された瞬間の状態を確認可能

＜具体例＞

`debugger`メソッドを挿入

```app/controllers/users_controller.rb
class UsersController < ApplicationController
  ・
  ・
  ・
  def show
    @user = User.find(params[:id])
    @books = @user.books.page(params[:page]).per(5)
    debugger
    redirect_to root_url and return unless @user.activated?
  end
  ・
  ・
  ・
end
```

ブラウザで`localhost:3000/users/1`　にアクセス

その後、Railsサーバーを立ち上げたターミナルを確認

```ruby:Railsサーバー
   13:
   14:   def show
   15:     @user = User.find(params[:id])
   16:     @books = @user.books.page(params[:page]).per(5)
   17:     debugger
=> 18:     redirect_to root_url and return unless @user.activated?
   19:   end
   20:
   21:   def create
   22:     @user = User.new(user_params)
(byebug)
```

例えば、`(byebug)`のところに`@user`と入れると以下のように`@user`に関する情報が表示される

```:Railsサーバー
(byebug) #<User id: 1, name: "Example User", email: "example@railstutorial.org", created_at: "2019-01-05 09:47:17", updated_at: "2019-01-05 09:47:17", password_digest: "$2a$10$TTFabWl2Ym00v18ZpSnydOaTs7/udrO.CVbru3FOuHH...", remember_digest: nil, admin: true, activation_digest: "$2a$10$hE7gx6bTvnEPhF2VTwL4I./tjR1iHC.TkfvBroqpTpp...", activated: true, activated_at: "2019-01-05 09:47:17", reset_digest: nil, reset_sent_at: nil>
```

# まとめ
- 実技面接に向けて、初学者でも最低限これだけは説明できるのが望ましいのではないかというWeb制作におけるスキームなどを抜粋し、まとめを作成した。。
- 何も見ずにすらすらと記述できるところもあれば、意外と迷うところもあり、知識の定着していない箇所について改めて把握することができた。
- 他にも押さえておくべきスキームは沢山あると思うので、適宜更新していきたい。

# 参考URL
- [Railsチュートリアル1章](https://railstutorial.jp/chapters/beginning?version=5.1#sec-installing_rails)
- [Railsチュートリアル3章](https://railstutorial.jp/chapters/static_pages?version=5.1#cha-static_pages)
- [Railsチュートリアル5章](https://railstutorial.jp/chapters/modeling_users?version=5.1#cha-modeling_users)
- [Railsチュートリアル7章](https://railstutorial.jp/chapters/sign_up?version=5.1#sec-rails_environments)
- [Railsチュートリアル13章](https://railstutorial.jp/chapters/user_microposts?version=5.1#sec-user_micropost_associations)
- [30分でできるRuby on RailsとGitHubやエディタまわりの環境構築](https://qiita.com/_kanacan_/items/59f3959169c41a167b1e)
- [Railsチュートリアルに沿った開発環境構築の方法(Cloud9)](https://qiita.com/iwato/items/57965c19c24567eb72e8)
- [bundle install と bundle updateの違いについて](https://qiita.com/lasershow/items/1a048d03ddaaba98171e)
- [【簡単解説】Gitリポジトリの新規作成するinitコマンドの使い方](https://eng-entrance.com/git-init)
- [Gitを覚えたての新人がよく使うコマンドまとめ](http://tech.innovation.co.jp/2016/07/15/Git-command.html)
- [Railsのテンプレート（ERB）での動的処理とコメント](https://qiita.com/chobi9999/items/a48e790952a0f183e91d)
- [[Rails] link_toで画像とテキストを使ったリンクボタンを作りたい](https://qiita.com/ezawa800/items/3f18961e043afcb2cf73)