【初学者】Ruby on Railsのローカル開発環境を構築してみた【Webアプリ開発の道~その1~】

はじめに

こんにちは。
最初の記事で書いたとおり、Webアプリを開発するためにバックエンドでRuby on Railsを使っていきたいと思います。

私のRails理解度は現時点でRailsチュートリアルを解説動画を購入して、見ながら一通りほとんどコピペで終わらせ、その後ProgateのRails5講座をダーっと終わらせたくらいのレベルです。
チュートリアルと同じSampleAppをもう一周丁寧にする選択肢もありますが、同じものを作るのもなんとなく嫌なので、チュートリアルをベースにして改変しながら、自分のオリジナルアプリを制作していこうと思います。

Railsチュートリアルでは推奨環境のAWS内でCloud9を用いて開発しましたが、自分のWebアプリを開発する環境として何が最適か迷っていました。DockerやAWSのリソースを使って環境構築することも視野に入れましたが、おそらく、あれもこれもと手を出していくとハードルが高くなっていきそうだなと感じたので、まずローカルPCで環境構築してアプリをほぼ完成させた後に、次のステップとしてAWSリソースの活用やDockerの導入という風に取り組もうと考えています。

今回はなんとか、Railsサーバを立ち上げてルートの画面表示を行うところまでできましたので、備忘録的に環境構築手順や学んだことを書いていこうと思います。
やはりAWSのCloud9で教科書どおりにやるのとは違ってエラー続出で、結局丸1日くらいかかってしまいました…。

参考情報

参考記事など

・【完全版】MacでRails環境構築する手順の全て
・VS codeの初期設定とRuby on Railsの環境設定 環境構築
・Railsチュートリアル第6版第1章 ※たしか3章までは無料で見れたはずです。

ローカル開発に使用したPCハードウェア情報

MacBook Air (13-inch, Early 2014)
プロセッサ：1.4 GHz デュアルコアIntel Core i5
メモリ：4 GB 1600 MHz DDR3

OSのバージョン確認

$ sw_vers
ProductName:    macOS
ProductVersion: 11.6.3
BuildVersion:   20G415

本題（目次）

最初に注意ですが、以下に記載していく手順で環境構築することが推奨ということではありません。あくまで自分で開発環境を構築していった時にどうデバッグしたかもメモしておきたいため、実際に自分が行った順番でインストール等を記載しています。
同じようなエラーが起きた方の参考にはなるかもしれませんが、正しい手順はRailsの公式ドキュメントや他の熟練エンジニアの記事を参考になさってください。

おおまかな流れは以下のとおりです。
0. VScodeの設定
1. Homebrewのインストール（Command Line Toolsの導入）
2. rbenvのインストール
3. Rubyのインストール
4. bundlerのインストール
5. データベースの用意
6. railsのインストール(skip bundle)
　（このあとからエラー多発でデバッグ地獄…泣）
7. nodebrewのインストール
8. node.jsのインストール
9. yarnのインストール
10. webpackerのインストール
11. Railsサーバーの立ち上げ

0. VScodeの設定

私は統合開発環境（IDE）としてVScodeを使用しました。特に大きな理由はありませんが、ドットインストールの講座でVScodeをインストール済みだったため、こちらを選択したという感じです。Macであれば、Xcodeでもいいと思います。
・VS codeの初期設定とRuby on Railsの環境設定 環境構築
を参考に拡張機能などの初期設定を行いました。

1. Homebrewのインストール（Command Line Toolsの導入）

rbenvとは、Rubyのバージョン管理ツールです。これをインストールするためにはHomebrewというmacOS（またはLinux）用パッケージマネージャーが必要のようです。
パッケージマネージャー（パッケージ管理システムなどとも呼ばれる）はパッケージのインストール（アンインストール）作業を一元的管理するもので、MacやLinuxにはこのHomebrewというのを使うらしい。
公式HPよりコピペして

# Homebrewのインストール　※アップデートでコマンドが変わる可能性があるので、毎回公式HPからコピペするのが無難
$ /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

参考記事ではxcode-select --installでXcodeをインストールすることで、Command Line Toolsを入れていますが、私はこの手順を飛ばしてしまいました。よくよく調査すると、HomebrewをインストールすることでCommand Line Toolsも一緒にインストールされるので、飛ばしてOKだったようです。
【Homebrew】Command Line Toolsのインストールについて

2. rbenvのインストール

こちらはこれに習って
・【完全版】MacでRails環境構築する手順の全て

# (1) rbenvへのPATHを通す
$ echo 'export PATH="$HOME/.rbenv/bin:$PATH"' >> ~/.bashrc

# (2) rbenvを使うために必要な「rbenv init -」コマンドを設定
$ echo 'eval "$(rbenv init -)"' >> ~/.bash_profile

# (3) 設定の反映
$ source ~/.bash_profile

# (4) rbenvのインストール
$ brew install rbenv ruby-build

3. Rubyのインストール

Rubyのバージョンを何にするか迷いましたが、とりあえず3系を入れてみようかと。何か不具合があれば2系にダウングレードするかもしれません。

$ rbenv install --list
#=>
2.6.9
2.7.5
3.0.3
3.1.0
jruby-9.3.3.0
mruby-3.0.0
rbx-5.0
truffleruby-22.0.0.2
truffleruby+graalvm-22.0.0.2

現状、どうやらRubyの3.0.3か3.1.0が選択できるようなので、最新の3.1.0をインストールしました。

# Ruby2.5.7をインストール
$ rbenv install 3.1.0
# インストール済みのRubyのバージョン一覧を表示する
$ rbenv versions
#=>
*   system　(set by /Users/<ユーザー名>/.rbenv/version)
　　　　　　　　3.1.0 

「*」がついている方が、現在の環境に適用されているバージョンとのことなので、こちらを3.1.0に設定し直す必要がある。rbenv globalとするとPCでデフォルトで使うRubyバージョンを指定し、rbenv localとすると作業中のディレクトリ内のみでのRubyバージョン指定ができるとのこと。特に他のディレクトリでRuby開発してないので、globalで設定しました。

# 現在のディレクトリにRuby3.1.0を適用
$ rbenv global 3.1.0

# 適用を反映
$ rbenv rehash

4. bundlerのインストール

ターミナルでbundler -vを実行して、bundlerがインストールされているか確認する。もしnot foundとエラーが表示されれば、インストールを行う

$ bundler -v
#=>
Bundler version 2.3.3

（注）記事の最後に追記あり

5. データベースの用意

Railsチュートリアル（第６版）ではdevelopment環境とtest環境ではsqlite3、Herokuの本番環境ではPostgreSQLを使っています。
これも何にしようか迷いましたが、今の時点では全ての環境でPostgreSQLを使うことにしたいと思います。

次のコマンドを打ち込んで、インストールと起動を一気にやりました。

# PostgreSQLのインストール
$ brew install postgresql

# PostgreSQLの起動
$ brew services start postgresql
==> Successfully started `postgresql` (label: homebrew.mxcl.postgresql)

6. Railsのインストール(skip bundle)

RailsのバージョンはRailsチュートリアル（第６版）に合わせて6.0.3をインストール。
-d postgresqlはデフォルトのデータベースとしてPostgreSQLを使うという意味とのこと。
--skip-bundleをつけるとgemのインストールは後回しにしてRailsアプリに必要なファイルだけを先に作ってくれるとのこと。

# Railsのインストール
$ gem install rails -v 6.0.3

開発環境(environment)ディレクトリを作っておき、以降はその中で作業しました。

# 作業ディレクトリを作成
$ mkdir ~/environment

# 作業ディレクトリへ移動
$ cd environment

やっとrails newできるぞ！

# Rails new（gemのインストールはスキップ）
$ rails _5.2.3_ new . -d postgresql --skip-bundle

できたファイルの中からGemfileを開き、次のように書き変える。
確実に6.0.3をインストールするための処置だが、開発の過程でここも変更するかも。

Gemfile

# 変更前
gem 'rails', '~> 6.0.3'
# 変更後
gem 'rails', '6.0.3

# 各種gemをインストール
$ bundle install 

bundle install --path vendor/bundleとpathを指定するオプションをつけるやり方もあるらしい。ですが、ここはRailsチュートリアルどおりにオプションなしで実行しました。

さて、参考にした記事では、このあとrails serverでサーバーを立ち上げて、
http://localhost:3000/
にアクセスして終わり！となっているのですが、ここから苦労しました笑

まずbundle installで何やらエラーが出ているようでした。でも、なんとか終了した感じだし、前の工程でRails newはできたので、とりあえずrailsのバーション確認をしてみると。

$ rails -v
#=>
Could not find gem 'rails (= 6.0.3)' in locally installed gems.
Run `bundle install` to install missing gems.

やっぱり、bundle installがうまくいってない。デバックしていくしかない泣。

デバッグ1（mimemagic gem）

# もういちどbundle installしてエラー内容をみていく
$ bundle install 
#=>
#略
An error occurred while installing mimemagic (0.3.10), and Bundler cannot continue.
#略

mimemagicというgemインストールで失敗しているようでbundle installがうまくいっていないみたい。
エラーをググってみた。

(参考)
https://qiita.com/suzuki_sh/items/84806ce231ed9b0f2e6d
https://hackmd.io/@mametter/mimemagic-info-ja

まず、mimemagicとは、MIME Typeを識別するgemであるようだ。（MIMETypeとはファイルの種類を表す情報）
railsチュートリアルではrails 6.0.3で行っているが、どうやらこれだとbundle installに失敗するらしい。

（2021/03/27現在）Rails 5.2.5 / 6.0.3.6 / 6.1.3.1 はmimemagicに依存しなくなったとのこと。バージョンを5.2.5か6.0.3.6、6.1.3.1にすることで解決できるらしい。

今回はrails6系のチュートリアルを参考にするため、gemfileのrailsを6.0.3.6とすることに。

Gemfile

# 変更前
gem 'rails', '6.0.3'

# 変更後
gem 'rails', '6.0.3.6'

再度、bundle installすると今度は成功！

念の為railsのバージョン確認

$ rails -v
Rails 6.0.3.6

思い通り6.0.3.6がインストールされている。

よし、とりあえずrailsサーバ立ち上げてみるか！

$ rails s
=> Booting Puma
=> Rails 6.0.3.6 application starting in development 
=> Run `rails server --help` for more startup options
#略~ 
Webpacker configuration file not found  Please run rails webpacker:install 
#略~ 
Error: No such file or directory 

またエラーです。よく読んでみるとWebpackerがインストールされていないよう。
言いつけ通りにインストールしてみよう。

デバッグ2（webpacker gem）

Railsチュートリアルにも書いてある。以下のコマンドを実行。

$ rails webpacker:install
#=>
Rails couldn’t infer whether you are using multiple databases from your database.yml and can't generate the tasks for the non-primary databases. If you'd like to use this feature, please simplify your ERB.
sh: node: command not found
sh: nodejs: command not found
Node.js not installed. Please download and install Node.js　https://nodejs.org/en/download/

またエラー。最初のエラーはdatabase.yml あたりのエラーっぽい。今回PostgreSQLを入れているのですが、その辺の設定だろうか。ちょっと保留。

２つ目nodeコマンドと３つ目はnodejsコマンドが見つからないよエラーから解決していく。

Railsチュートリアルをよく読むと、WebpackerのインストールにはJavaScriptソフトウェアの依存関係を管理するYarnというプログラムが必要になるとのこと。色々ググって調べると、YarnをインストールするにはNode.jsが必要になる。Node.jsをインストールするにはnodebrewが必要ということが分かりました。

つまり、
①最初にインストールしたhomebrewを使って、nodebrewをインストール
②nodebrewを使って、Node.jsをインストール
③Yarnをインストール
④Webpackerをインストール
という順番が良さそう。

というわけで、仕切り直して以下の「7. nodebrewのインストール」以降の手順で実施していく。

7. nodebrewのインストール

参考(https://www.webdesignleaves.com/pr/jquery/node_installation_mac.html)
こちらの参考ページが大変わかりやすかったです。
nodebrewとは Node.jsのバージョン管理ツールで、nodebrewを使うと複数のバージョンのNode.jsを切り替えて利用することができる。nodebrew以外にもnodenvやnvmなどの Node.jsのバージョン管理ツールがある。nodenv ディレクトリごとに利用するバージョンを切り替えることができるので、そのような環境が必要な場合は nodenvなどの使用を検討した方が良いかも知れないとのこと。

#Homebrew を使ってnodebrewをインストール
$ brew install nodebrew

#nodebrew をセットアップ
$ nodebrew setup

#~/.bash_profile に環境変数 PATH にパスを追加。
$ echo 'export PATH=$HOME/.nodebrew/current/bin:$PATH' >> ~/.bash_profile

#source コマンドで .bash_profile を更新して設定を反映
$ source ~/.bash_profile

#nodebrewのヘルプ表示とバージョン確認ができればOK
$ nodebrew -help
#=>
nodebrew 1.1.0
#(略)

8. Node.jsのインストール

nodebrewを使ってNode.jsをインストールしていきます。

#Node.js の現在の安定版をインストール
$ nodebrew install stable

#有効化していないのでまだnodeコマンドは使えない。
$ node -v
#=>
bash: node: command not found

#以下のコマンドを実行し、current:noneとなっているのが有効化していない証拠。
$ nodebrew ls
#=>
v16.14.0

current: none

#use コマンドでバージョンを指定して使用する Node.js を有効化。
$ nodebrew use v16.14.0
#=>
use v16.14.0

#nodeコマンドで再度バージョンを確認
$ node -v
#=>
v16.14.0

#先ほどcurrent:noneだったところがv16.14.0に変わっている。
$ nodebrew ls
#=>
v16.14.0

current: v16.14.0

補足：Node.js をインストールするとパッケージ管理ツールの npm（Node Package Manager）も一緒にインストールされるようです。npmもyarnも同じパッケージ管理ツールで、yarnはnpmより後発。

9. yarnのインストール

さて、お次はyarnのインストールです。homebrewを使用してインストールしました。

$ brew install yarn
Running `brew update --preinstall`...
==> Auto-updated Homebrew!
Updated 1 tap (homebrew/core).
==> Updated Formulae
Updated 7 formulae.

#yarnがうまくインストールされているか確認。
$ yarn -v
#=>
1.22.17

これでようやくWebpackerがインストールできる環境が整いました。

10. webpackerのインストール

以下のデバッグ2でやっていたコマンドを再度実行してみる。

$ rails webpacker:install
Rails couldn’t infer whether you are using multiple databases from your database.yml and can't generate the tasks for the non-primary databases. If you'd like to use this feature, please simplify your ERB.
Rails couldn’t infer whether you are using multiple databases from your database.yml and can't generate the tasks for the non-primary databases. If you'd like to use this feature, please simplify your ERB.
      create  config/webpacker.yml
Copying webpack core config
      create  config/webpack
      create  config/webpack/development.js
      create  config/webpack/environment.js
      create  config/webpack/production.js
      create  config/webpack/test.js

#略

rails aborted!
Psych::BadAlias: Unknown alias: default

#略

またdatabese.yamlあたりのエラーと最後Psych::BadAlias: Unknown alias: defaultのエラーが出ているようだけどインストールできたのか？？
とりあえず再度railsサーバ立ち上げてみる。

$ rails s
=> Booting Puma
=> Rails 6.0.3.6 application starting in development 
=> Run `rails server --help` for more startup options
Exiting
#略
***/ruby/3.1.0/psych/visitors/to_ruby.rb:430:in `visit_Psych_Nodes_Alias': Unknown alias: default (Psych::BadAlias)

デバッグ3（psych gem）

とりあえずググる！
参考(https://teratail.com/questions/343233)
Gemfileにgem 'psych', '~> 3.1'という行を追加して、bundle installを行うと改善するかもしれないとのこと。Ruby標準でpsychというYAML解釈用のGemがあり、これの4系列では解釈法が変わっているため、3系列でないとdatabase.ymlの解釈に失敗するとのこと。

なるほど、Gemfileに'psych', '~> 3.1'書き足してbundle install実行

Gemfile

# 追加
gem 'psych', '~> 3.1'

$ bundle install

11. Railsサーバーの立ち上げ

Kosukes-MacBook-Air:environment miyashitakosuke$ rails s
=> Booting Puma
=> Rails 6.0.3.6 application starting in development 
=> Run `rails server --help` for more startup options
Puma starting in single mode...
#略
Use Ctrl-C to stop

やったサーバ立ち上がった！
http://localhost:3000/
意気揚々とにアクセスすると

Started GET "/" for ::1 at 2022-02-12 12:09:53 +0900
ActiveRecord::NoDatabaseError (connection to server on socket "/tmp/.s.PGSQL.5432" failed: FATAL:  database "environment_development" does not exist
):

またエラー…。泣きながらググりました。

デバッグ4（開発環境用データベースの作成）

参考（https://rails-ambassador.herokuapp.com/debugs/NoDatabaseError)
あ、そうか、開発環境用のデータベースが作成されていなかったのか。
うっかりしていました。
以下のコマンドを実行してデータベースを作成。

$ rails db:create
#=>
Created database 'environment_development'
Created database 'environment_test'

再びRailサーバを立ち上げる。

$ rails s
=> Booting Puma
=> Rails 6.0.3.6 application starting in development 
=> Run `rails server --help` for more startup options
Puma starting in single mode...
#略
Use Ctrl-C to stop

これでまたブラウザから
http://localhost:3000/
にアクセスすると

やったー！最初の画面だ（やっとできた泣）

最後に

最後まで読んでいただきありがとうございます！
とりあえずローカル開発用の環境は構築できました。
今後開発を進める中で、艦橋は変えていくと思いますが、現段階でのメモです。
エラーデバッグの何かお役に立てば幸いです。
もし記載に誤りがあればご指摘ください。よろしくお願いいたします。

追記

「4. bundlerのインストール」で私のPCには既にbundlerが入っていたので、この時はインストールせずに、先に進みましたが、Railsチュートリアルとバージョンを合わせた方がいいかなと後で思い立ち、bundlerをインストールし直しました。

$ gem uninstall bundler
$ gem install bundler -v 2.2.17
#（この後Gemfile.lockのBUNDLED WITHを2.2.17に直して、bundle installしました。）

これが正解かは分かりませんが、Railsサーバの立ち上げまではうまくいっています。
⇒（2022.2.16追記）
色々調べてみると、Gemfile.lockの内容を自分で変更するのはあまり好ましくないようなので、Gemfile.lockを一旦削除→bundlerダウングレード→変更後のバージョンを指定してbundle install（この時に新たにGemfile.lockが生成される）の手順が良いかもしれません。