Railsアプリの作り方【前編】環境構築からRailsウェルカムページまで

VScodeに拡張機能からWSLをインストール

VScodeを開き、表示 > ターミナル > 新しいターミナル でターミナルを開く

wsl --install

インストールしたらパソコンを再起動

左下のボタンをクリック→WSLへ接続→ディストリビューションの追加→

Ubuntuを選択

下の画像のように、ディストリビューションが正常にインストールされました。と出ればOK

VScodeの左下にある下図のボタンを選択し→WSLへ接続する

上記のボタンの表示がWSL:Ubuntuに変わる

これでWSL環境に接続できました。

sudo apt update && sudo apt upgrade -y

パッケージリストを最新の状態に更新することに成功したらインストール済みのパッケージをすべて最新バージョンにアップグレードします。

apt: Ubuntu/Debian系Linuxのパッケージ管理ツール（Advanced Package Tool）。

※-y は「すべての質問に自動的に ‘yes’ と答える」という意味で、確認プロンプトをスキップするオプションです。

git clone https://github.com/rbenv/rbenv.git ~/.rbenv

GitHubにあるrbenvのリポジトリを、ローカルマシンの~/.rbenvディレクトリにクローン（コピー）する

echo 'export PATH="$HOME/.rbenv/bin:$PATH"' >> ~/.bashrc

これがパスを通すという行為です。

~/.bashrc というファイルの末尾に export PATH=”$HOME/.rbenv/bin:$PATH” という行を追加します。

つまりPATHという環境変数に”$HOME/.rbenv/bin:$PATH”‘が追加されることによってパスが通るということです。

これによりシステムでrbenv -vなどのコマンドが使えるようになります。

補足:
.bashrc にexport PATH="$HOME/.rbenv/bin:$PATH"と書き込むことにより、書き込んだパスはずっと通ったままになり、rbev -vなどが永続的に使えるようになるということです。

.bashrcの中身を確認したい方は
cat ~/.bashrcで.bashrcファイルの中身を確認することができます。(やらなくてもいい)

echo 'eval "$(rbenv init - bash)"' >> ~/.bashrc

同様に~/.bashrcというファイルにeval “$(rbenv init – bash)”を追記します。

これを記載することによりrbenv を ただのパスが通ったコマンドから、高度なバージョン管理ツールへと進化させてくれます。

注意点として
eval “$(rbenv init – bash)” は ~/.bashrc の最後の方に書く
他の設定（特に PATH 関連）と競合しないよう、ファイルの末尾付近に追加します。
（先に export PATH=”$HOME/.rbenv/bin:$PATH” を記述しておく）

echo 'eval "$(rbenv init -)"' >> ~/.bashrc

これにより、eval “$(rbenv init -)” という文字が ~/.bashrc に追加され ます。

rbenv init – とは、rbenv を正しく動作させるための環境変数を設定するということです。

source ~/.bashrc

で変更を即時反映させます。

これにより今まで.bashrcに書き込んだ設定が反映されます。

これをしないとターミナルを再起動するまで設定が適用されません。

git clone https://github.com/rbenv/ruby-build.git ~/.rbenv/plugins/ruby-build

GitHubにあるruby-buildリポジトリを、ローカルの~/.rbenv/plugins/ruby-buildディレクトリにクローン（ダウンロード）する

rbenv install 3.2.2

rbenvをインストールします。

rbenv global 3.2.2

rbenvでグローバル（システム全体）のRubyバージョンを3.2.2に設定します。

ruby -v

rubyがインストールできているか確認。このときruby 3.2.2のようにバージョンが表示されていればOK

curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg -o yarn-pubkey.gpg

Yarnパッケージの正当性を検証するためのデジタル署名（GPG鍵）を取得し、後でシステムに登録できるようにローカルに保存するコマンドです。

分解すると

• -s：進捗表示を非表示（サイレントモード）
  
• -S：エラーがあった場合のみ表示
  
• -o yarn-pubkey.gpg：
  ダウンロードした内容を「yarn-pubkey.gpg」というファイルに出力（保存）

簡単に言うと「このYarnパッケージは本物ですよ」とLinuxシステムに証明するために行うコマンド です。

で、それを証明するためのファイルが、ローカル環境の今いるディレクトリの中にcurl -sS https://dl.yarnpkg.com/debian/pubkey.gpg -o yarn-pubkey.gpgyarn-pubkey.gpgによって作られたyarn-pubkey.gpgになるということです。

sudo mkdir -p /etc/apt/trusted.gpg.d/

でディレクトリをつくる。

sudo gpg --dearmor -o /etc/apt/trusted.gpg.d/yarn.gpg yarn-pubkey.gpg

yarn-pubkey.gpg というGPG鍵ファイルを、ASCII形式からバイナリ形式に変換（–dearmor）し、/etc/apt/trusted.gpg.d/yarn.gpg というファイル名で保存する

分解すると

• sudo
  管理者権限で実行
• gpg
  GNU Privacy Guard (暗号化/復号ツール)
• --dearmor
  ASCIIアーマー形式（テキスト形式）のGPG鍵をバイナリ形式に変換
• -o /etc/apt/trusted.gpg.d/yarn.gpg
  出力先ファイルを指定（この場合、APTの信頼済み鍵ディレクトリに保存）
• yarn-pubkey.gpg
  入力元のGPG鍵ファイル
  (先ほど、ローカルのカレントディレクトリに保存したテキストファイル)

このコマンドの目的:

この操作は、Yarn公式リポジトリのGPG公開鍵を、Ubuntu/Debianシステムが認識できる形式で正しい場所に保存するために行います。

これにより、aptパッケージマネージャーがYarnパッケージの正当性を検証できるようになります。

echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list

“deb https://dl.yarnpkg.com/debian/ stable main“という文字を管理者権限でyarn.listというファイルに書き込む。

yarn.listにyarnのパッケージのURLを記載することにより、システムはそのURLからyarnをインストールするようになる。

sudo apt update

システム上のパッケージ情報を最新に更新する。

インターネットからリポジトリの最新データを取得し、どのパッケージがアップデート可能か確認できるようにする。（実際のパッケージのアップグレードは行いません）

sudo apt install yarn -y

先ほどyarn.listで指定したURL(https://dl.yarnpkg.com/debian/ stable main)からyarnをインストールする。
質問はすべてyes(-y)

gem install rails -v 7.1.3

システムにrailsの7.1.3バージョンをインストールする

rbenv rehash

railsをインストールしたのでrailsコマンドを認識させるために打つコマンド。

自動的に実行されることもありますが明示的に打つと確実

rails -v

システムにrailsがインストールできているか確認

sudo apt install postgresql postgresql-contrib libpq-dev -y

PostgreSQLデータベースサーバー、追加機能パッケージ、および開発用ライブラリを、質問は全部「yes」で(-y)インストールする。

• postgresql : PostgreSQLデータベースサーバー本体
  
• postgresql-contrib : PostgreSQLの追加機能モジュール
  
• libpq-dev : PostgreSQL用C言語ライブラリ(開発用)

rails new testapp -d postgresql

testappというrailsアプリをpostgresqlというデータベースと組み合わせて作成します

cd testapp

現在はWSL環境の一番上の階層にいるので今作ったtestappディレクトリに移動します。

VScodeでtestappディレクトリ(フォルダ)を開く

をクリックすると下の画像のようにディレクトリやファイルが表示されます。

config/database.ymlを編集する

default: &defaultの設定のところ(上の画像の場合は21行目から23行目)に

を追記する。

※ ymlファイルはインデントが合っていないと正常に動かないので注意

補足:

host: localhostにする理由

アプリケーションが同じマシン上で動作しているデータベースに接続する場合に推奨される設定。

今回の場合、RailsアプリとデータベースともにWSL環境で動作しているためhost: localhostとするのが適切。

今回はDockerを使用しないのでここでは詳しく説明しませんが、Dockerを使用する場合はhost: db が推奨されます。

sudo -u postgres psql

postgresというシステムユーザーとして、PostgreSQLの対話型ターミナル（psql）を起動します

下の画像のようになっていればPostgreSQLの対話型ターミナルに入れています。

• sudo：管理者権限で実行
  
• -u postgres：「postgres」というユーザーとして実行
  
• psql：PostgreSQLの対話型ターミナル

ALTER USER postgres WITH PASSWORD 'password';

postgresというデータベースユーザーのパスワードを’password’に変更します

• ALTER USER : ユーザー設定を変更
  
• postgres : 操作対象のユーザー名 PostgreSQLのデフォルト管理者
  
• WITH PASSWORD : パスワードを設定
  
• 'password' : 設定するパスワード database.ymlと同じ文字列に
  
• ; : SQL文の終了 必須

\q 

対話型ターミナルから抜ける

rails db:create

データベースを作る

rails s

Railsサーバーを起動する

ブラウザでhttp://localhost:3000/にアクセスして下記画像のようになっていれば成功です。