ruby on rails Windows10 64ビットインストール Railsサーバー起動までlocalhost:3000

ruby on railsの設定方法について色々ぐぐったりしたけどほとんど間違っている内容だったので、正しいやり方を書きます。

rubyのダウンロード
https://rubyinstaller.org/downloads/
![Downloads.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/987832/27620a27-9adc-1ccf-f140-f0f5e0275483.png)



# インストール# 
「Ruby+Devkit 2.7.4-1 (x64)」 です。
最新版をインストールするのは辞めました。
最新版が良いという方は最新版でやってみると良いかもしれません。

WITH DEVKITを選ぶ理由はツールがまとめられてるからです。
自分が使ってるWindows10が32ビットか64ビット数を間違えないように注意します。
自分が使っているWindowsのビット数の確認方法は
Windowsのシステムからビット数を確認できます。

確認方法
コントロール パネル\すべてのコントロール パネル項目\システム
Windowsの左下の検索バーで「コントロールパネル」を入力

Windows10 64bit=(x64)
Windows10 32bit=(x86)

## インストールまでの作業
![スクリーンショット 2021-08-09 00.29.29.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/987832/602965bd-52a3-5273-8e27-c5ff7dadd381.png)

##MSYS2にチェックを入れて次へ進む
![2021-08-09 00.35.52.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/987832/df3d83b1-42d0-da4b-1a8c-9a8d21eee6a8.png)
※インストール後にこの記事を作成しており、すでにインストールされているというATTENTIONが表示されています。
※MSYS2とは 公式日本語訳
<details><summary>MSYS2<br>
MSYS2は、ネイティブWindowsソフトウェアを構築、インストール、および実行するための使いやすい環境を提供するツールとライブラリのコレクションです。これは、mintty、bashと呼ばれるコマンドライン端末 、gitやsubversionなどのバージョン管理システム、tarやawkなどのツール、さらにはautotoolsなどのビルドシステムで構成され、すべてCygwinの修正バージョンに基づいています。</summary>これらの中心的な部分のいくつかはCygwinに基づいていますが、MSYS2の主な焦点は、ネイティブWindowsソフトウェアのビルド環境を提供することであり、Cygwinを使用する部分は最小限に抑えられています。<br>MSYS2は、ほんの数例を挙げると、GCC、mingw-w64、CPython、CMake、Meson、OpenSSL、FFmpeg、Rust、Rubyの最新のネイティブビルドを提供します。<br>パッケージの簡単なインストールとそれらを最新の状態に保つ方法を提供するために、ArchLinuxユーザーにはなじみのあるPacmanと呼ばれるパッケージ管理システムを備えてい ます。依存関係の解決や単純な完全なシステムアップグレードなどの多くの強力な機能に加えて、簡単で再現性のあるパッケージ構築をもたらします。私たちのパッケージリポジトリには、インストールの準備ができている2000以上のビルド済みパッケージが含まれています。https://www.msys2.org/</details>

## コマンドプロント　MSYS2のインストール
RUbyinstaller

```
1-base installation
2-system update(optional)
3-and MINGW development toolchain
```

ここで［1,2,3］の選択がありますが、
`1,2,3`とまとめて入力して`ENTER`を押します。
その後、10分ほどインストールに時間を要します。
完了した後、また

```
1-base installation
2-system update(optional)
3-and MINGW development toolchain
```

と出ますが、無視して`ENTER`を押すとコマンドプロントが閉じされます。

これでRubyやMSYS2のインストールは終わりです。

## Rubyがインストールされているのかruby -vで確認する

コマンドプロントを起動させます。Windowsの左下の検索ボックスから「cmd」を入れてコマンドプロントを呼び出します。

```
Ruby -v
```

と入力して`ENTER`


# Railsのインストール
コマンドプロントを起動　cmd

```
gem install rails
```


※rubyに何かをインストールするときは`gem install`と最初に入れればOK

しばらく待つとインストールが完了します。

## railsがインストールされているのかrails -vで確認
インストール完了後に-vを入れて確認

```
rails -v
```

# SQLite3をインストールする

## SQLite3のライブラリをインストールします。

コマンドプロントを起動　cmd

```
gem install sqlite3
```

しばらく待つとインストールが完了します。

## SQLite3のEXEファイルやDLLなどを用意

ここでダウンロードします。
https://www.sqlite.org/download.html

ダウンロードページに移動後、少し下へスクロールすると、
`Precompiled Binaries for Windows`という項目があります、。
それがWindows用のファイルです。

![2021-08-09 01.36.10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/987832/3d0b5803-a640-8054-067f-92c63713ca97.png)


私はWindows　64ビットだったので`（sqlite-dll-win64-x64-3360000.zip）`を選びました。
`32ビットの人は上（sqlite-dll-win32-x86-3360000.zip）`を選んでください。

次にexeファイル（実行ファイル）である
`sqlite-tools-win32-x86-3360000.zip`をダウンロードします。
※なぜ実行ファイルは32ビットしかないのか不明ですがこれを使います。


## ダウンロードしたフォルダを解凍
ZIPファイルなので通常はダブルクリックで中身を取り出せると思います。

## sqlite3.dllやexeファイルをrubyのbinフォルダへ移動
### まずはsqlite3.dllだけを選びます。
![2021-08-09 01.45.59.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/987832/c85ac5dd-3468-dbb3-9bbe-6f9ba9d5ab26.png)

### exeファイル
中に三つあるので全部binフォルダへ移動させます。
![2021-08-09 01.55.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/987832/040fa56f-a8d9-1671-19aa-a24b143177c5.png)

sqlite3.exeだけ入れるといったことが書かれてているサイトなどがあり、その通りに何回やっても失敗しましたが、全部入れたらうまくできました。

### 移動先　Rubyのフォルダを開きbinへ
rubyは通常Cドライブにあります。
![2021-08-09 01.50.44.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/987832/6ee698b7-8c18-ce33-996a-a81bba0e99b9.png)
一番上にbinフォルダがあるので、ここへさっきのdllファイルを入れます。


### Rubyのbinフォルダへ移す
![2021-08-09 02.05.21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/987832/2f2cb227-d6a1-78f0-f1d6-8210b7afe7dc.png)
合計４つ移動させます。

## Node.jsをインストール

Node.jsの公式サイトでファイルをダウンロードします。
https://nodejs.org/ja/
左の`推奨版`をダウンロード
![2021-08-09 02.08.36.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/987832/8ef51580-2817-622e-9eb2-45437e5be01d.png)

すべて`NEXT`を押してインストールを進めます。
※途中、チェックボックスがありますが、チェック入れました。

## Windowsのシステムの環境変数でNode.jsの実行ファイルのパスを通す
左下のWindowsのアイコン上で右クリックしてシステムを選択します。
![2021-08-09 02.16.50.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/987832/20a3340a-bacf-ccea-53c5-74b547b9e14e.png)

少し下へスクロールすると関連設定に`システム情報`があるのでそれをクリックします。
![2021-08-09 02.18.56.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/987832/993f9460-5206-3f8b-a3fc-26da69b5b23f.png)

次に「システムの詳細設定」があるのでそれをクリック
![2021-08-09 02.21.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/987832/4f50e221-7296-210b-8ec5-6d6679551249.png)
次にシステムプロパティの詳細設定タブが表示されているので、一番下にある「環境変数」をクリック。
![2021-08-09 02.24.25.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/987832/6f54b840-069c-1419-d5c5-1c6cfde874c7.png)

ユーザーの環境変数のところに`Path`があるのでそれをダブルクリック
![2021-08-09 02.27.08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/987832/caf07676-57c0-2cd1-f421-aa2ef7bcaa1d.png)
※以前にrubyの最新を入れて失敗したのでその時のパスが残ってます。

###Node.jsの実行ファイルパスを入力します。
参照をクリックして、C:\Program Files\nodejs\node_modules\npm\bin\node-gyp-bin
![2021-08-09 02.46.21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/987832/586e56d0-0e6e-74f6-8911-0ecbd6e93309.png)

#### Program Filesは
`Program Files`と`Program Files（x86）`があります。node.jsは前者にあります。

これの設定にあたってはこちらのURLを参考にしました。
https://note.affi-sapo-sv.com/nodejs-windows-setting-knowledge.php
設定後は「OK」を押して環境変数のウインドウを閉じます。

### node.jsのバージョンを確認

```
node.js -v
```

バージョンが表示されたらインストール完了です。

##yarnをインストールします（作業はnode.jsと同じ）

yarn公式ページ　Windowsインストーラーダウンロードページ
https://classic.yarnpkg.com/en/docs/install#windows-stable

公式ページに移動後少し下へスクロールします。
![2021-08-09 02.56.26.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/987832/703dad08-704a-a252-3451-8f820096510d.png)
コマンド入力でなく、

`「Alternatives」
Click to expand / collapse`
でクリックします。
OSは「Windows」バージョンは「classic stabke」
![2021-08-09 02.59.13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/987832/32c192a0-b1a0-c759-2d13-ded120a935c2.png)

インストールはすべてNEXTを選べばよいと思います。
環境変数でyarnのpathを通します。
参照から、`C:\Program Files (x86)\Yarn\bin`　でOKです。こちらのプログラムファイルはx86の方を選びました。
![2021-08-09 03.03.10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/987832/2f036fa6-ccc7-df43-9f88-81d5ef0790ad.png)

yarnがインストールされているか確認

```
yarn-v
```

##　Rails アプリを作成

```
rails new アプリケーション名
```

かなり長いですが
しばらく待つと完了します。
![2021-08-09 03.09.27.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/987832/f57ab31c-694f-5906-6de2-6add1ba197fb.png)

#Railsを起動させる

```
rails s
```


http://localhost:3000

これで表示されます。