(備忘録)MacにゼロからRubyの環境構築をする方法

# 環境構築とは？
* プログラミングを書いたり、実行したりするような環境を自分のパソコンに整うこと

# 環境構築の手順

## ①テキストエディタの準備
* テキストエディタは文章を作成、編集するためのソフトウェア
* Microsoftが無料提供しているVisual Studio Codeが有名
* 今回はVisual Studio Codeを中心に進む
* Download URL ：　https://code.visualstudio.com/

## ②VSCodeに拡張機能導入(推奨)
#### 拡張機能とは？
* VSCode単体ではサポートしてない機能を後から付け加えるためのもの

#### Japanese Language Pack for Visual Studio Code
* 日本語表記にする

#### HTML Snippets
* HTMLタグ、CSSタグの入力を補完

#### Ruby
* Rubyの構文をチェック、間違った箇所を指摘
 
#### zenkaku
* 全角スペースを知らせる
* zenkakuに関してはインストールしただけでは使用でき図、以下を実行
①command + shift + pで、コマンドパレット(設定ファイル)の検索画面を開く
②「> Enable zenkaku」と入力して選択
③command + QでVSCodeを終了するか、「Code」を選択し、「Visual Studio Codeを終了する」を選択して終了
④finderでホームディレクトリを開く
⑤command + shift + .で隠しディレクトリ表示
⑥> .vscode > extensions > mosapride.zenkaku-0.0.3 > と移動
⑦extension.jsを2本指タップ、メニュー表示
⑧「このアプリケーションを開く」から「テキストエディット」を選択
⑨　5行目の「var enabled = false;」を「var enabled = true;」に変更、command + Sで保存

#### Code Spell Checker
* コードのスペルをチェック

## ③その他便利機能カスタマイズ
* tabキーで入力される半角スペースの数を設定
①VSCodeのサイドバー、「管理（下部の歯車マーク）」→ 「設定」
②Editor: Tab Sizeを２に設定
③Editor: Render Whitespaceで「all」を選択

* オートセーブ設定
①VSCodeのサイドバー、「管理（下部の歯車マーク）」→ 「設定」
②オートセーブの設定で「onFocusChange」を選択 

## ④APP開発のための環境を整える
* 最初、MacOSの状態を確認する必要あり
* 以下、MacOSがCatalina以降の場合を想定して進めます。
※Mojaveではbashというシェルを使用、Catalina以降はzshというシェルを使用

### ①まず、下記のコマンドを実行

```terminal
zshをデフォルト設定
% chsh -s /bin/zsh
ログインシェルを表示
% echo $SHELL
以下のように表示されればOK
/bin/zsh
```
:::note warn
```
% echo $SHELL コマンドで、/bin/zshと表示されなかった場合は、一度ターミナルを閉じて再度開木、もう一度echo $SHELLコマンド
```
:::
:::note warn
PWの入力を求められる場合あり
:::

### ②Command Line Toolsを用意
* Command Line Toolsとは、WebのAPP開発に必要なSWをダウンロードするため必要な機能

1)Command Line Toolsをインストール
##### ターミナル
```
% xcode-select --install
```

2)インストール→同意→ダウンロード開始→完了

### ③Homebrewを用意
* Homebrewは？ソフトウェア管理ツール
:::note warn
Macのチップモデルによって方法が異なる
:::
:::note warn
以下、M1チップではなくIntelモデルである前提で進める
:::

1)Homebrewをインストール
##### ターミナル
```terminal
# ホームディレクトリに移動
% cd

# ホームディレクトリにいるかどうか確認
% pwd

# コマンドを実行
% /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install.sh)"
```
2)ターミナル画面表示に従い、必要な場合PW入力かEnterキーを押す

3)Homebrewがインストールされているか確認
##### ターミナル
```terminal
% brew -v
Homebrew 2.5.1 # 数字は異なる場合あり
```
4)Homebrewをアップデート
##### ターミナル
```terminal
% brew update
```

5)Homebrewの権限を変更
##### ターミナル
```terminal
% sudo chown -R `whoami`:admin /usr/local/bin
```

### ④新しいバージョンのRubyをインストール
1)rbenv と ruby-buildをインストール
* rbenvとruby-buildはRrubyの土台となる

##### ターミナル
```terminal
% brew install rbenv ruby-build
```

2)rbenvをどこからも使用できるように設定
##### ターミナル
```terminal
% echo 'eval "$(rbenv init -)"' >> ~/.zshrc
```

3)zshrcの変更を反映
##### ターミナル
```terminal
% source ~/.zshrc
```

4)readlineをinstall
* ターミナルのirb上で日本語入力を可能にする設定を行うため
##### ターミナル
```terminal
% brew install readline
```

5)readlineをどこからも使用できるように設定
##### ターミナル
```terminal
% brew link readline --force
```

6)rbenvを利用、Rubyをインストール
##### ターミナル
```terminal
% RUBY_CONFIGURE_OPTS="--with-readline-dir=$(brew --prefix readline)"
% rbenv install 2.6.5
```

7)利用するRubyのバージョンを指定
##### ターミナル
```terminal
% rbenv global 2.6.5
```

8)rbenvを読み込んで変更を反映
##### ターミナル
```terminal
% rbenv rehash
```

9)正しくバージョン指定するできたか、最終確認
##### ターミナル
```terminal
% ruby -v
```

### ⑤MySQLを用意
* MySQLは、アプリケーションでデータを管理するツール

1)MySQLのインストール
##### ターミナル
```terminal
% brew install mysql@5.7
```

2)MySQLの自動起動設定

* MySQLは本来、PC再起動のたびに起動し直す必要があるが、面倒であるため、自動起動設定を推奨
##### ターミナル
```terminal
% mkdir ~/Library/LaunchAgents 
% ln -sfv /usr/local/opt/mysql\@5.7/*.plist ~/Library/LaunchAgents
% launchctl load ~/Library/LaunchAgents/homebrew.mxcl.mysql\@5.7.plist
```

3)mysqlコマンドをどこからでも実行できるように設定
##### ターミナル
```terminal
# mysqlのコマンドを実行できるようにする設定
% echo 'export PATH="/usr/local/opt/mysql@5.7/bin:$PATH"' >> ~/.zshrc 
% source ~/.zshrc #  設定を読み込むコマンド
% which mysql # mysqlのコマンドが打てるか確認する

# 以下のような表示でOK
/usr/local/opt/mysql@5.7/bin/mysql
```

4)MySQLの起動確認
##### ターミナル
```terminal
# MySQLの状態を確認
% mysql.server status 

# 以下表示でOK
 SUCCESS! MySQL running
```

### ⑥shared-mime-infoを用意
1)shared-mime-infoをインストール
##### ターミナル
```terminal
% brew install shared-mime-info
```

2)shared-mime-infoがインストールされているか確認
##### ターミナル
```terminal
% brew list
```

### ⑦Railsを用意

1)bundlerをインストール
* bundler（バンドラー）とは？Rubyの拡張機能（gem）の管理のためのツール
##### ターミナル
```terminal
% gem install bundler --version='2.1.4'
```
2)Railsをインストール
##### ターミナル
```terminal
% gem install rails --version='6.0.0'
```

3)rbenvを再読み込みし、変更を反映
##### ターミナル
```terminal
% rbenv rehash
```

4)Railsの導入確認
##### ターミナル
```terminal
% rails -v
Rails 6.0.0  
# 「Rails」あとの数字は変わる可能性があり
```
### ⑧Node.jsを用意
* Node.jsはJavaScript実行の為に必要なもの
* Homebrewを用いて、Node.jsをインストール

1)Node.jsをインストール
##### ターミナル
```terminal
% brew install node@14
```

2)Node.jsへのパス設定
##### ターミナル
```terminal
% echo 'export PATH="/usr/local/opt/node@14/bin:$PATH"' >> ~/.zshrc
% source ~/.zshrc
```

3)Node.jsの導入確認
##### ターミナル
```terminal
% node -v
v14.15.3 # 数値は異なる場合あり
```

### ⑨yarnを用意
* yarnとは、プログラム同士の関係性を管理するもの

1)yarnをインストール
##### ターミナル
```terminal
% brew install yarn
```

2)yarnの導入確認
##### ターミナル
```terminal
% yarn -v
```