1.2.1 開発環境

開発環境は、1人1人すべて異なります。なぜなら開発者は慣れてくるにつれて、自分の環境をカスタマイズするものだからです。開発環境を大別すると、テキストエディタやコマンドラインを組み合わせて使う環境と、IDE（統合開発環境）の2つに分けられます。そしてRailsチュートリアルでは、環境構築の複雑さを避けるためにAWS Cloud9という素晴らしいクラウドIDEサービスを使って進めていきます。AWS Cloud9ではRubyやRubyGems、Gitなど、Ruby on Railsの開発環境の構築に必要なソフトウェアがほとんど組み込まれています。Railsなどの一部のソフトウェアはインストールされていませんが、これらはもちろん本書の中で説明してあります（1.2.2）。

クラウドIDEにはWeb開発に必要な三種の神器であるテキストエディタ、ファイルブラウザ、コマンドラインターミナル（図 1.6）もしっかり組み込まれています。また、クラウドIDEのテキストエディタでは、Ruby on Railsの大きなプロジェクトには不可欠とも言うべき横断的ファイル検索も利用できます⁶。たとえクラウドIDEを今後使うことがないとしても、コマンドラインターミナルやテキストエディタなどの開発ツールで一般にどんなことができるのかを知っておくには最適です（筆者としても他のエディタの使い方は知っておいた方が良いと考えています）。

図 1.6: クラウドIDEの外観

クラウドIDEを利用するための手順は次のとおりです。AWSのサイトは継続的に更新されているため、詳細な手順は異なっているかもしれません。コラム 1.2の「熟練」の考え方を参考に細かな差異にも対応してみましょう。

1. Cloud9は現在Amazon Web Services（AWS）に統合されたため、Cloud9を使うためにはAWSアカウントが必要になります。AWSアカウントを既にお持ちの場合は、AWSにログインしてください。AWSコンソールに行き、検索ボックスから “Cloud9” と入力すると、Cloud9の開発環境を作成するためのページ（図 1.7）⁷に行けます。
2. Amazon Web Services（AWS）アカウントを持っていない場合は、AWS Cloud9のユーザー登録をします。悪用防止のためクレジットカード情報の入力が必須になりましたが、AWSには無料利用枠があるのでご安心ください。アカウントが有効になるまで最大で24時間かかりますが、著者の場合は約10分ほどで完了しました。
3. Cloud9の管理ページ（図 1.7）を開けるようになったら、 ドロップダウンメニューから住所に近いリージョンを選択し、“Create environment” をクリックして図 1.8の画面に進みます。Detailsセクションでは「rails-tutorial」を含む名前などの情報を適宜入力し（図 1.8）⁸、Environment Typeでは“New EC2 instance”を選択します。次のNew EC2 instanceの設定では、PlatformのドロップダウンメニューからUbuntu Serverを選択します（図 1.9）。
   

   図 1.7: AWS Cloud9で新しいワークスペースを作成する
   

   図 1.8: AWS Cloud9の新しいワークスペースに名前をつける
   

   図 1.9: Ubuntu Serverを選択する
4. 次のNetwork settingsはAWS Systems Manager(SSM) を選択していることを確認し、VPS settingsやTags-optionalはデフォルトのまま“Create”をクリックします（図 1.10）。このとき、“root”ユーザーになっているという警告が表示されるかもしれませんが、この段階では無視して構いません（ここでの望ましい方法は割と複雑になるので、13.4.4のIAM（Identity and Access Management）の項で後述します）。
   

   図 1.10: ネットワークの設定を確認してクラウドIDEを作成する
5. 上の手順で“Create”をクリックすると管理ページに移動します。しばらくすると図 1.11のようにメッセージが表示されるので、openをクリックして作成したクラウドIDEを開きましょう（図 1.12）。
   

   図 1.11: 作成が成功したらクラウドIDEを開く
   

   図 1.12: クラウドIDEの初期画面

Rubyの世界では、インデントに2つのスペースを使うのがほぼ常識になっているので、このエディタのインデント設定もデフォルトの4から2に変えておくことをオススメします。インデント設定を変更するには、右上の歯車アイコンをクリックして［Project Settings］を開き、［Soft Tabs］設定でマイナス記号をクリックして値を「2」にします（図 1.13）。このとき、［On Save, Strip Whitespace］設定もオンにしておくことをオススメします（不要なホワイトスペースが自動削除されるので、チーム開発で他のメンバーに迷惑をかけずに済みます）。設定の変更はその場で反映されるので、［Save］ボタンをクリックする必要はありません。

図 1.13: Cloud9でインデントをスペース2つに設定する

最後に、本チュートリアルはRuby 3.1.2を標準として使います。rvm（Ruby Version Manager）を利用すれば、さまざまなバージョンのRubyを指定してインストールできます⁹。

$ rvm get stable
$ rvm install 3.1.2
$ rvm --default use 3.1.2

1.7でも後述するように、本チュートリアルではUnixのプロンプトとして$記号を使いますので、上の各行冒頭にある$記号は入力しないでください。

Rubyのインストールが完了したら、以下を実行してRubyのバージョンを確認できます（実際に表示されるバージョンはこれと異なることもあります）。

$ ruby -v
ruby 3.1.2p20 (2022-04-12 revision 4491bb740a) [x86_64-linux]

1.2.2 Railsをインストールする

1.2.1の開発環境には必要なソフトウェアがすべて含まれていますが、Railsそのものはまだ含まれていません（これは意図したものです）。チュートリアルを期待どおりに進めるには、Railsの正確なバージョンをインストールすることが重要だからです。

まずはインストール時間を短縮するため、インストールに時間のかかるRubyドキュメントをインストールしないようにする設定を追加してみましょう（リスト 1.1）¹⁰。このコマンドは1回実行するだけでOKです（コマンドラインの慣習については 1.7で説明します）。

$ echo "gem: --no-document" >> ~/.gemrc

Railsをインストールするには、RubyGemsが提供するgemコマンドを使います。リスト 1.2のコマンドをターミナルに入力してください。クラウドIDEを使っている場合は図 1.6の右下にあるコマンドライン領域に入力してください（ローカル環境で開発している場合は通常のターミナルウィンドウに入力してください）。

$ gem install rails -v 7.0.4

-vというオプションを使うことで、インストールされるRailsのバージョンを正確に指定できます。railsコマンドに-vオプション渡せばインストールされたことを確認できます。

$ rails -v
Rails 7.0.4

このコマンドで出力されるRailsのバージョン番号は、インストールされたRailsのバージョン（リスト 1.2）と正確に一致する必要があります。

経験上、リスト 1.3で示すようにbundler gemのバージョンも揃えておくとよいことがわかっています。

$ gem install bundler -v 2.3.14

bundler gemは重要です。詳しくは 1.3.1で学びます。

最後に、Cloud9環境でディスク容量が不足しないよう、ワークスペース環境のディスク容量を追加するコマンドも事前に実行しておくことをオススメします（リスト 1.4）。

$ source <(curl -sL https://cdn.learnenough.com/resize)

以上でインストールは完了です！Ruby on RailsでWeb開発を行うための準備が完全に整いました。

1.3.1 Bundler

Railsアプリケーションを新規作成したら、次はBundlerを実行して、アプリケーションに必要なgemをインストールします。Gemfileは、railsコマンド（リスト 1.6）によって自動的に作成されますが、ここではGemfileに記載されているデフォルトのアプリケーションgemを少し変更します。

そのために、テキストエディタでGemfileを開きます（クラウドIDEの場合は、ファイルナビゲーター画面で矢印をクリックしてサンプルアプリのディレクトリを開き、Gemfileアイコンをダブルクリックします）。

Gemfileの内容は、だいたい図 1.15やリスト 1.7のようになります（バージョン番号など細かな点は異なる可能性があります）。Gemfileの内容はRubyのコードですが、ここでは文法を気にする必要はありません。Rubyの詳細については第4章で説明します。

ファイルやディレクトリが図 1.15のように表示されない場合、ナビゲーターの歯車アイコンをクリックして［Refresh File Tree］を選択します。

一般に、ファイルやディレクトリがうまく表示されていない場合は、このようにファイルツリーを再表示してみてください¹⁵。

図 1.15: hello_appディレクトリにあるデフォルトのGemfileをテキストエディタで開く

  source "https://rubygems.org"
  git_source(:github) { |repo| "https://github.com/#{repo}.git" }

  ruby "3.1.2"

  # Bundle edge Rails instead: gem "rails", github: "rails/rails", branch: "main"
  gem "rails", "~> 7.0.4"

  # The original asset pipeline for Rails
  # [https://github.com/rails/sprockets-rails]
  gem "sprockets-rails"

  # Use the Puma web server [https://github.com/puma/puma]
  gem "puma", "~> 5.0"

  # Use JavaScript with ESM import maps
  # [https://github.com/rails/importmap-rails]
  gem "importmap-rails"

  # Hotwire's SPA-like page accelerator [https://turbo.hotwired.dev]
  gem "turbo-rails"

  # Hotwire's modest JavaScript framework [https://stimulus.hotwired.dev]
  gem "stimulus-rails"

  # Build JSON APIs with ease [https://github.com/rails/jbuilder]
  gem "jbuilder"

  # Use Redis adapter to run Action Cable in production
  # gem "redis", "~> 4.0"

  # Use Kredis to get higher-level data types in Redis
  # [https://github.com/rails/kredis]
  # gem "kredis"

  # Use Active Model has_secure_password
  # [https://guides.rubyonrails.org/active_model_basics.html#securepassword]
  # gem "bcrypt", "~> 3.1.7"

  # Windows does not include zoneinfo files, so bundle the tzinfo-data gem
  gem "tzinfo-data", platforms: %i[ mingw mswin x64_mingw jruby ]

  # Reduces boot times through caching; required in config/boot.rb
  gem "bootsnap", require: false

  # Use Sass to process CSS
  # gem "sassc-rails"

  # Use Active Storage variants
  # [guides.rubyonrails.org/active_storage_overview.html#transforming-images]
  # gem "image_processing", "~> 1.2"

  group :development, :test do
    # See https://guides.rubyonrails.org/
    # debugging_rails_applications.html#debugging-with-the-debug-gem
    gem "debug", platforms: %i[ mri mingw x64_mingw ]
  end

  group :development do
    # Use console on exceptions pages [https://github.com/rails/web-console]
    gem "web-console"

    # Add speed badges [https://github.com/MiniProfiler/rack-mini-profiler]
    # gem "rack-mini-profiler"

    # Speed up commands on slow machines / big apps
    # [https://github.com/rails/spring]
    # gem "spring"
  end

  group :test do
    # Use system testing
    # [https://guides.rubyonrails.org/testing.html#system-testing]
    gem "capybara"
    gem "selenium-webdriver"
    gem "webdrivers"
  end

ほとんどの行はハッシュシンボル #（4.2）でコメントされています。これらの行では、よく使われているgemとBundlerの文法の例をコメント形式で紹介しています。この時点では、デフォルト以外のgemをインストールする必要はありません。

gemコマンドで特定のバージョン番号を指定しない限り、Bundlerは自動的に最新バージョンのgemを取得してインストールします。例えば、Gemfileに次のような記述があるとします。

gem "sprockets-rails"

このgemのバージョンを指定する主な方法は2通りあります。これにより、Railsで使われるgemのバージョンを「ある程度」制御できます。1番目の方法は次のとおりです。

gem "capybara", ">= 3.26"

これで最新バージョンのcapybara gemがインストールされます（これはテストで使うgemです）。極端に言えば、バージョンが7.2であっても、3.26と同じかそれより上のバージョンならインストールされます 。

2番目の方法は次のとおりです。

  gem "puma", "~> 5.0"

このように指定すると、バージョンが5.0以上（つまりマイナーアップデート）のpuma gemがインストールされますが、バージョンが6以上（つまりメジャーアップデート）のpuma gemはインストールされません。つまり、>=という記法では最新のgemを探してインストールし、~> 5.0という記法ではバージョン5.1などの新しいマイナーバージョンがあればインストールされますが、バージョン6.0のようなメジャーバージョンアップはインストールされません¹⁶。

gemのバージョン指定に~>を使う主な理由は、「一般には」マイナーアップデートの方が安全度が高いからです。しかし経験上は、ちょっとしたマイナーアップデートでも問題が発生することがあります。

このため、Railsチュートリアルでは基本的に事実上すべてのgemでバージョンを「ピンポイントで」指定し、がっちり固定してあります。ベテラン開発者にはGemfileで~>を使って指定し、最新のgemを使って進めることをオススメしていますが、チュートリアルが思い通りに動かなくなる可能性があることはご承知おきください¹⁷。

リスト 1.7のGemfileを、実際に使用する正確なバージョンのgemに置き換えたものをリスト 1.8に示します¹⁸。

最後に、リスト 1.8ではRubyの正確なバージョン番号を指定する行（ruby '3.1.2'）をリスト 1.7から削除している点にもご注意ください。また、最後の行はWindows環境特有の設定なので、ネイティブのWindows環境でRailsを実行する場合は、この行のコメントアウトを解除しておきましょう¹⁹。

source "https://rubygems.org"
git_source(:github) { |repo| "https://github.com/#{repo}.git" }

gem "rails",           "7.0.4"
gem "sprockets-rails", "3.4.2"
gem "importmap-rails", "1.1.0"
gem "turbo-rails",     "1.1.1"
gem "stimulus-rails",  "1.0.4"
gem "jbuilder",        "2.11.5"
gem "puma",            "5.6.4"
gem "bootsnap",        "1.12.0", require: false

group :development, :test do
  gem "debug",   "1.5.0", platforms: %i[ mri mingw x64_mingw ]
end

group :development do
  gem "web-console", "4.2.0"
end

group :test do
  gem "capybara",           "3.37.1"
  gem "selenium-webdriver", "4.2.0"
  gem "webdrivers",         "5.0.0"
end

# Windows ではタイムゾーン情報用の tzinfo-data gem を含める必要があります
# gem "tzinfo-data", platforms: [:mingw, :mswin, :x64_mingw, :jruby]

前置きが長くなりましたが、いよいよBundlerを使ってhelloアプリに必要なgemsをインストールする準備が整いました。アプリケーションのGemfileをエディタで開き、リスト 1.8の内容で置き換えて保存したら、bundle installを実行してgemをインストールします²⁰。

リスト 1.6のrailsコマンドのときと同様に、リスト 1.9でもバージョン番号を明示的に指定しています。これにより、正しいバージョン（つまりリスト 1.3でインストールしたバージョン）のbundler gemを使ってbundleコマンドが実行されるようになります。本チュートリアルでは、互換性を最大限に高めてスムーズに作業するためにこの方法を使っています。ただしこれはあくまでチュートリアル向けの方法なので、実際の業務では一般にbundleコマンドでバージョンを指定しないことが多いでしょう（コラム 1.4）。またリスト 1.9の最後には、一部のシステムで必要となるLinuxデプロイプラットフォーム向けの行も含めてあります。

$ cd hello_app/
$ bundle _2.3.14_ install
Fetching source index for https://rubygems.org/
.
.
.
$ bundle _2.3.14_ lock --add-platform x86_64-linux

bundle installコマンドの実行には少し時間がかかるかもしれません。完了後、アプリケーションが実行可能になります（なお、ネイティブのWindowsでRailsを実行する場合は、リスト 1.8の末尾の行のコメント解除をお忘れなく）。

    $ rails new hello_world

    $ bundle install

    $ bundle

    $ bundle update

    $ rm -f Gemfile.lock
    $ bundle

1.3.2 rails server

1.3のrails newコマンドと1.3.1のbundle installコマンドを実行したことにより、実際に動かせるアプリケーションが作成されました。さて、アプリケーションを起動するにはどうすればよいでしょうか？

ありがたいことに、Railsには開発マシンでのみブラウズできるローカルWebサーバーを起動するためのコマンドラインプログラム（スクリプト）が付属しているので、rails serverというコマンドを実行するだけでRailsアプリケーションを手軽に起動できます。

システムによっては（クラウドIDEであっても）、rails serverコマンドを実行する前にローカルWebサーバーへの接続を許可する必要が生じることがあります。これを行うには、config/environments/development.rbファイルをエディタで開き、リスト 1.10と図 1.16に示した2行を追加してから、ファイルを保存します。

Rails.application.configure do
  .
  .
  .
  # Cloud9 への接続を許可する
  config.hosts.clear
end

図 1.16: Cloud9でのRailsサーバーへの接続を許可する

なお、リスト 1.11に表示されているこのrails serverコマンドは、ターミナルタブをもうひとつ開いてそこで実行することをオススメします。そうすることで、最初に開いたタブで引き続きコマンドを実行できるので便利です（図 1.17と図 1.18）²¹。リスト 1.11で「Ctrl-C」キー²²を押すことでサーバーをシャットダウンできます。

$ cd ~/environment/hello_app/
$ rails server
=> Booting Puma
=> Ctrl-C to shutdown server

図 1.17: 新しくターミナルを開く

図 1.18: Railsサーバーを別のタブで実行する

（クラウドでない）OSでrails serverの結果を表示するには、ブラウザのアドレスバーにhttp://localhost:3000を貼り付けてください。クラウドIDEの場合は、Previewを開いて［Preview Running Application］をクリックする（図 1.19）ことで、実行中のアプリをブラウザのウィンドウまたはタブで表示します（図 1.20）。ブラウザの設定によってはうまく表示されない場合があります。「WEBサイトによるトラッキング」をブロックしている場合は、解除して²³IDEを再読み込みすることで表示できます。いずれの場合も、図 1.21のように表示されるはずです。

図 1.19: クラウドワークスペース上で実行するローカルサーバーを共有する

図 1.20: クラウドIDEのタブからブラウザウィンドウを開く

図 1.21: rails serverを実行したときのデフォルトのRailsページ

1.3.3 Model-View-Controller（MVC）

まだ始まったばかりですが、今のうちにRailsアプリケーションの全体的な仕組みを知っておくと後々役立ちます（図 1.22）。デフォルトのRailsアプリ構造（図 1.14）を眺めてみると、app/というディレクトリがあり、その中に「models」「views」「controllers」という3つのサブディレクトリがあることに気付いた方もいると思います。ここにはRailsがMVC（model-view-controller）というアーキテクチャパターンを採用していることが暗に示されています。MVCでは、アプリケーション内のデータ（ユーザー情報など）と、データを表示するコードを分離します。アプリケーションのグラフィカルユーザーインターフェイス（GUI）は多くの場合このようにして構成されます。

ブラウザがRailsアプリと通信する際、一般的にWebサーバーにリクエスト（request）を送信し、これはリクエストを処理する役割を担っているRailsのコントローラ（controller）に渡されます。コントローラは、場合によってはすぐにビュー（view）を生成してHTMLをブラウザに送り返します。動的なサイトでは、一般にコントローラは（ユーザーなどの）サイトの要素を表しており、データベースとの通信を担当しているRubyのオブジェクトであるモデル（model） と対話します。モデルを呼び出した後、コントローラは、ビューを描画（レンダリング）し、完成したWebページをHTMLとしてブラウザに返します。

図 1.22: Model-View-Controller（MVC）アーキテクチャの概念図

今はこの解説がまだ少し抽象的に思えるかもしれませんが、この章は後に何度も参照しますのでご安心ください。特に1.3.4では、MVCを扱うお試しアプリケーションをご覧に入れます。2.2.2では、このtoyアプリを使ってMVCの詳細を解説します。サンプルアプリケーションでは、MVCの3つの要素をすべて扱います。3.2でまずコントローラとビューを扱い、モデルについては6.1から扱い始める予定です。その後、これら3つの要素を協調動作させる方法を7.1.2で見ていきます。

1.3.4 Hello, world!

記念すべき最初のMVCフレームワークアプリケーションとして、先ほど作ったアプリにほんのちょっぴり変更を加えることにしましょう。「hello, world!」という文字列を表示するだけのコントローラのアクションを追加し、図 1.21のデフォルトRailsページを置き換えてみましょう（コントローラのアクションについては2.2.2で詳しく解説します）。

コントローラという名前から想像できるように、コントローラのアクションはコントローラ内で定義します。ここでは、Applicationという名前のコントローラの中にhelloという名前のアクションを作成することにします。実際、この時点ではコントローラはApplicationひとつしかありません。次のコマンドを実行すると、現在あるコントローラを確認できます。

$ ls app/controllers/*_controller.rb

新しいコントローラの作成は第2章で行います。リスト 1.12に、helloを定義したところを示します。ここではrenderメソッドで「hello, world!」というテキストを表示しています。この時点ではRubyの文法については気にする必要はありません。第4章で詳しく解説します。

class ApplicationController < ActionController::Base

  def hello
    render html: "hello, world!"
  end
end

表示したい文字列を返すアクションを定義したので、今度はデフォルトのページ（図 1.21）の代わりにこのアクションを使うようRailsに指示します。そのためには、Railsのルーター（router）を編集します。ルーターはコントローラとブラウザの間に配置され（図 1.22）、ブラウザからのリクエストをコントローラに振り分ける（=ルーティング）役割を果たします（図 1.22はわかりやすくするためルーターを省略していますが、2.2.2で詳しく解説します）。ここではデフォルトのページを差し替えたいので、ルートのルーティング（ルート URLにアクセスした場合のルーティング）を変更することにします。例えば http://www.example.com/ というURLの末尾は「/」になっているので、ルートURLは単に「/」（スラッシュ）と簡略表記することもあります。本チュートリアルではrouteやroutingを「ルーティング」、rootを「ルート」と表記します。

Railsのルーティングファイル（config/routes.rb）にはRailsガイドの「ルーティング」を参照するようコメントがあり、ルートルーティングの構成方法がリンク先に示されています（リスト 1.13）。たとえば、具体的なルーティングの文法は次のような形式になります。

root "controller_name#action_name"

上のコードの場合、コントローラ名はapplicationであり、アクション名は helloです。変更後のコードをリスト 1.14に示します。

Rails.application.routes.draw do
  # Define your application routes per the DSL in
  # https://guides.rubyonrails.org/routing.html

  # Defines the root path route ("/")
  # root "articles#index"
end

Rails.application.routes.draw do
  root "application#hello"
end

リスト 1.12のコードとリスト 1.14のコードを使うと、ルートルーティングから「hello, world!」が返されるようになります（図 1.23）²⁴。

図 1.23: 「hello, world!」をブラウザで表示する

演習

1. リスト 1.12のhelloアクションを書き換え、「hello, world!」の代わりに「hola, mundo!」と表示されるようにしてみましょう。
2. Railsでは「非ASCII文字」もサポートされています。「¡Hola, mundo!」にはスペイン語特有の逆さ感嘆符「¡」が含まれています（図 1.24）²⁵。「¡」文字をMacで入力するには、Optionキーを押しながら1キーを押します。この文字をコピーして自分のエディタに貼り付ける方が早いかもしれません。
3. リスト 1.12のhelloアクションを参考にして、2つ目のアクションgoodbyeを追加しましょう。このアクションは、「goodbye, world!」というテキストを表示します。リスト 1.14のルーティングを編集して、ルートルーティングの割り当て先をhelloアクションからgoodbyeアクションに変更します（図 1.25）。

図 1.24: ルートルーティングで「¡Hola, mundo!」を表示するよう変更する

図 1.25: ルートルーティングで「goodbye, world!」を表示するよう変更する

1.4.1 Gitのセットアップ

推奨環境であるクラウドIDE（1.2.1）にはデフォルトでGitが導入されていますので、追加で導入する必要はありません。何らかの理由で導入が必要な方は『Git/GitHub編』の「Gitのインストールとセットアップ」などを参考に、Gitを導入してみてください。

クラウドIDEの場合は、以下を実行してGitのバージョンが2.28.0以上であることを確かめれば十分です。

  $ git --version          # 2.28.0以上であること
  git version 2.17.1

上のようにGitのバージョンが2.28.0未満の場合は、Gitをアップグレードする必要があります。クラウドIDEの場合は、以下のリスト 1.15のコマンドを実行すればアップグレードできます。

  $ source <(curl -sL https://cdn.learnenough.com/upgrade_git)

クラウドIDE以外の環境でGitをアップグレードする必要がある場合は、『Git/GitHub編』の第1章「Gitのインストールとセットアップ」を参照してください。

$ git config --global user.name "自分のニックネームまたは名前など"
$ git config --global user.email your.email@example.com

$ git config --global init.defaultBranch main

$ git config --global alias.s status

$ git config --global credential.helper "cache --timeout=86400"

$ cd ~/environment/hello_app    # ディレクトリに移動済みの場合は不要
$ git init
Reinitialized existing Git repository in
/home/ubuntu/environment/hello_app/.git/

$ git add -A

$ git status
On branch main

No commits yet

Changes to be committed:
  (use "git rm --cached <file>..." to unstage)

        new file:   .browserslistrc
        new file:   .gitignore
        new file:   .ruby-version
        new file:   Gemfile
        new file:   Gemfile.lock
        .
        .
        .

$ git commit -m "Initialize repository"
[main (root-commit) df0a62f] Initialize repository
.
.
.

$ git log
commit b981e5714e4d4a4f518aeca90270843c178b714e (HEAD -> main)
Author: Michael Hartl <michael@michaelhartl.com>
Date:   Wed Mar 9 17:57:06 2022 +0000

    Initialize repository

1.4.2 Gitのメリット

「ソースコードのバージョンをGitで管理する理由が分からない」という方もいるかもしれませんので、1つ例をご紹介します。仮に、あなたが重要なapp/controllers/ディレクトリを削除してしまったとしましょう（ホーマー・シンプソンがやらかすような感じで）。

$ ls app/controllers/
application_controller.rb  concerns/
$ rm -rf app/controllers/
$ ls app/controllers/
ls: app/controllers/: No such file or directory

ここでは、Unixコマンドのlsでapp/controllers/ディレクトリの中身を表示した後、rmコマンドでうっかりディレクトリごと削除してしまったとします（表 1.1）。詳しくは『コマンドライン編』の「ディレクトリのリネーム/コピー/削除を行う」で解説しますが、ここで使っている-rfオプションは、「recursive」（ディレクトリ内にあるすべてのファイルとサブディレクトリを削除する）と、「force」（削除して良いかどうかの確認・警告をせずに削除する）という意味になります。

現在の状態を確認してみましょう。

$ git status
On branch main
Changes not staged for commit:
  (use "git add/rm <file>..." to update what will be committed)
  (use "git restore -- <file>..." to discard changes in working directory)

        deleted:    app/controllers/application_controller.rb
        deleted:    app/controllers/concerns/.keep

no changes added to commit (use "git add" and/or "git commit -a")

ファイルがいくつか削除されましたが、この変更はまだステージングに追加されておらず、コミットもされていません。つまり、restoreコマンド（と、対象ディレクトリまたはファイル名）を使えば、直前にコミットした状態まで簡単に戻すことができます²⁹。

$ git restore .
$ git status
On branch main
nothing to commit, working tree clean
$ ls app/controllers/
application_controller.rb  concerns/

うっかり削除してしまったディレクトリやファイルが、無事に復旧できましたね。これがGitを使うメリットの1つです。

1.4.3 GitHub

Gitを使ったソースコードのバージョン管理ができるようになったので、今度はGitHubにソースコードをアップロードしてみましょう。GitHubはGitに特化したソフトウェア開発のプラットフォームです³⁰。

ローカルマシンにあるGitリポジトリを、わざわざGitHubにプッシュする主な理由は2つあります。1つ目は、ソースコードとそのすべての変更履歴（コミット記録）の完全なバックアップを作成するためです。2つ目は、他の開発者との共同作業をより簡単に行うためです。

GitHubを始める方法は単純明快です。GitHubアカウントをお持ちでない方はGitHubアカウントに登録（サインアップ）しましょう（図 1.26）³¹。

GitHubにアカウントを作るときに、2要素認証（2FA）も設定しておくことをオススメします（特に「Git に GitHub の認証情報をキャッシュする」を読んでおくとよいでしょう）。

図 1.26: GitHubにユーザー登録する

ユーザー登録が完了したら、+記号のドロップダウンメニューをクリックして“New repository”を選択します（図 1.27）。

図 1.27: “New repository”オプションを選択する

新しいリポジトリを作成するページが表示されたら、リポジトリ名にhello_appを入力しましょう。Description（説明欄）の内容は空欄でも大丈夫です。そして万全の注意を払って、確実に、“Private”オプションを選択してください（図 1.28）。

Publicオプションを選択し、本チュートリアルで取り扱うRailsアプリのソースコードをうっかり公開しても原理的には安全です。とはいえ、特にGitを今回初めて使うような場合は秘密鍵のような重要なファイルをうっかりコミットしてしまう可能性もゼロではありません。ですから、何か起きる前にひとまずPrivateにしておく用心深さが大事です³²。

図 1.28: GitHubでPrivateリポジトリを作成する

“Create repository”ボタンをクリックすると、図 1.29のように既存のリポジトリをGitHubに追加するコマンドが表示されるはずです。ここではHTTPSオプションを選択してください。³³

図 1.29: 既存のリポジトリを追加する

最後にリスト 1.20のコマンドを実行し、メッセージに従ってGitHubのユーザー名（Username）と、デフォルトブランチ名を設定します。

[website (main)]$ git remote add origin https://github.com/<ユーザー名>/hello_app.git
[website (main)]$ git branch -M main
[website (main)]$ git push -u origin main

1行目のコマンドは、GitHubに置いたGitリポジトリをプッシュ（push）先の1つとして登録するコマンドです。今回はoriginという名前で登録しています。 2行目のコマンドは、mainブランチをデフォルトブランチ名に設定します（ここでは既にmainになっているので何も変更されません）。 3行目のコマンドは、ローカルマシンにあるGitリポジトリを、先ほど登録したorigin（GitHub）にアップロードしています³⁴。

今はこれらの操作について詳しく知らなくても大丈夫です。このようなコマンドはGitHubのWebページのリポジトリに表示されるものをコピペして使えば済むので、意味を理解していなくても作業できるでしょう。

リスト 1.20の<ユーザー名>の部分は、実際のユーザー名に置き換えてください。たとえば著者のユーザー名mhartlの場合は以下のようになります。

[website (main)]$ git remote add origin https://github.com/mhartl/hello_app.git
[website (main)]$ git branch -M main
[website (main)]$ git push -u origin main

リスト 1.20の3行目のコマンドを実行すると、ユーザー名とパスワードの入力を求められます。ユーザー名はGitHubのユーザー名をそのまま入力しますが、パスワードには次に説明する個人アクセストークンを入力します。GitHubのWebページにログインするときのパスワードではありませんのでご注意ください。

図 1.30: ユーザー名を入力し、パスワードには個人アクセストークンを入力する

繰り返しますが、「Password:」に入力するのは個人アクセストークンでなければなりません³⁵ 。個人アクセストークンは、GitHubの「個人アクセストークンを使用する」ドキュメントの手順に沿って作成できます³⁶。

なお、個人アクセストークンを作成するときは、「No expiration」（期限なし）を選び、トークンの適用範囲に「repo」を選んでおくことをおすすめします（図 1.31）³⁷。こうすることで、個人アクセストークンをコマンドラインで使えるようになります。

図 1.31: トークンに含めたい権限にチェックを入れる

個人アクセストークンを作成したらメモ帳アプリなどに保存しておきましょう³⁸。コマンドラインでリスト 1.20のgit pushを実行してパスワード入力を求められたら、この個人アクセストークンをコマンドラインにコピペしてください³⁹。

リスト 1.20の通りに最初のgit pushを実行したら、ブラウザで「Cmd-R」キーを押すか図 1.32のアイコンをクリックしてページを再読み込みしてください。これで、GitHubのhello_appリポジトリページが表示されます。このページで、リポジトリのファイルを見たりコミット履歴を参照するなど、さまざまな機能が利用できるようになります（図 1.33）。

図 1.32: ブラウザの再読み込みボタン

図 1.33: GitHubのリポジトリページ

1.4.4 ブランチ、編集、コミット、マージ

1.4.3の手順に沿って進めた場合、READMEファイルの内容がGitHubリポジトリのページに表示されることに気付いたでしょうか（図 1.34）。このREADME.mdファイルは、リスト 1.6のコマンドを実行したときに自動生成されました。ファイル名の拡張子が「.md」となっているファイルは、Markdownという人間にとって読みやすい記法を使って書きます⁴⁰。Markdownは簡単にHTMLに変換できるため、GitHubでもMarkdownで書かれたREADME.mdファイルをHTMLで表示してくれます。

Railsが自動生成したREADMEをそのまま使ってもよいですし、プロジェクトに合わせて内容を書き換えても構いません。とはいえ良い練習になるので、今回はREADMEを書き換えながらGitの使い方に慣れてみましょう。具体的には、Gitの基本的なコマンドであるブランチ（branch）、編集（edit）、コミット（commit）、マージ（merge）の4つを紹介します⁴¹。

図 1.34: GitHubのデフォルトRails READMEの表示

$ git switch -c modify-README
Switched to a new branch 'modify-README'
$ git branch
  main
* modify-README

Gitの編集（Edit）

トピックブランチを作ったら、READMEを編集（edit）してコンテンツを追加しましょう（リスト 1.21と図 1.35）。

リスト 1.21: 新しいREADMEファイル README.md

# Ruby on Rails Tutorial

## "hello, world!"

This is the first application for the
[*Ruby on Rails Tutorial*](https://railstutorial.jp/)
by [Michael Hartl](https://www.michaelhartl.com/). Hello, world!

図 1.35: READMEファイルを編集する

$ git status
On branch modify-README
Changes not staged for commit:
  (use "git add <file>..." to update what will be committed)
  (use "git restore -- <file>..." to discard changes in working directory)

        modified:   README.md

no changes added to commit (use "git add" and/or "git commit -a")

$ git commit -a -m "Improve the README file"
[modify-README 34bb6a5] Improve the README file
 1 file changed, 5 insertions(+), 22 deletions(-)

$ git switch main
Switched to branch 'main'

$ git merge modify-README
Updating b981e57..015008c
Fast-forward
 README.md | 27 +++++----------------------
 1 file changed, 5 insertions(+), 22 deletions(-)

$ git branch -d modify-README
Deleted branch modify-README (was 015008c).

# これはあくまで例です。誤ってブランチを作ったとき以外は実行しないでください。
$ git switch -c topic-branch
$ <ココで何か変更を加えてみてください>
$ git add -A
$ git commit -a -m "Make major mistake"
$ git switch main
$ git branch -D topic-branch

Push（プッシュ）

READMEファイルの更新が終わったので、プッシュ（push）コマンドでGitHubに変更をアップロードしてみましょう。既に1.4.3で一度プッシュしているため、今回はgit push origin mainを省略したgit pushでも実行できるはずです。

$ git push

無事にアップロードできたら、GitHub上にあるhello_appのページを確認してみましょう。README.mdの部分が更新されていれば成功です（図 1.36）。

図 1.36: GitHub上で更新されているREADMEファイル

1.6.1 本章のまとめ

• Ruby on Railsとは、Webアプリケーションを開発するためのフレームワークであり、プログラミング言語Rubyで作られている。
• クラウドIDEを利用すると、Railsのインストールやアプリケーションの生成、生成したファイルの編集などが簡単にができる。
• Railsにはrailsコマンドが用意されていて、rails newで新しいアプリケーションを生成したり、rails serverで開発環境用のサーバーを立ち上げられる。
• コントローラのアクションを追加したり、ルーティングを変更するだけで「hello, world」を表示するアプリケーションを作成できた。
• データの喪失を防止し、他の開発者と共同作業できるようにするため、Gitによるバージョン管理を導入し、GitHubの非公開リポジトリに保存した。
• Gitを導入していたため、アプリケーションを本番環境（Render）にすぐデプロイできた。