1.2.1 開発環境

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

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

図 1.6: クラウドIDEの外観

クラウドIDEを利用するための手順は次のとおりです。⁴

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

   確認ボタンを数回クリックしてデフォルトの設定を受け付けると、AWSがIDEのプロビジョニングを開始します（図 1.11）。このとき、“root”ユーザーになっているという警告が表示されるかもしれませんが、この段階では無視して構いません（ここでの望ましい方法は割と複雑になるので、13.4.4のIAM（Identity and Access Management）の項で後述します）。

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

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

図 1.9: Ubuntu Serverを選択する

図 1.10: IDEをプロビジョニングする直前の手順

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

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

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

なお、クラウドIDEを使っている場合はGitHubとHerokuコマンドをセットアップする必要があります。細かな手順は 1.4.3と1.5.1のインストール手順で説明します。

また、今すぐ設定する必要はありませんが、クラウドIDE上でテスト環境をセットアップする際の応用的な設定は3.6で解説しています。詳細は3.6.2まで進んだときに学びましょう。

1.2.2 Railsをインストールする

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

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

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

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

$ gem install rails -v 6.0.3

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

$ rails -v
Rails 6.0.3

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

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

$ gem install bundler -v 2.2.17

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

もうひとつインストールするものがあります。JavaScriptソフトウェアの依存関係を管理するYarnというプログラムです。ネイティブOS上で開発する場合は、自分のプラットフォームに合ったYarnインストール手順（英語）に従ってください。クラウドIDEで開発する場合は、リスト 1.4のコマンドを実行するだけで必要なツールをCDN経由でダウンロードおよびセットアップできます。リスト 1.4では、Cloud9環境でディスク容量が不足しないよう、ワークスペース環境に容量を追加するコマンドも事前に実行しています。

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

なお、以下のような警告メッセージがときどき表示されることがあると思います。

========================================
  Your Yarn packages are out of date!
  Please run `yarn install --check-files` to update.
========================================

そんなときは、メッセージの指示に従ってyarnコマンドを実行すればOKです。

$ yarn install --check-files

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

1.3.1 Bundler

Railsアプリケーションを新規作成したら、次はBundlerを実行して、アプリケーションに必要なgemをインストールします。Bundlerはrailsコマンド（リスト1.6）によって自動的に実行（この場合はbundle install）されます。ここではデフォルトのアプリケーションgemを変更してBundlerを再度実行してみます。そのために、テキストエディタでGemfileを開きます（クラウドIDEの場合は、ファイルナビゲーターで矢印をクリックしてサンプルアプリのディレクトリを開き、Gemfileアイコンをダブルクリックします）。Gemfileの内容は、だいたい図 1.14やリスト 1.7のようになります。バージョン番号など細かな点で多少の違いがあるかもしれません。Gemfileの内容はRubyのコードですが、ここでは文法を気にする必要はありません。Rubyの詳細については第4章で説明します。ファイルやディレクトリが図 1.14のように表示されない場合、ナビゲーターの歯車アイコンをクリックして［Refresh File Tree］を選択します。

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

図 1.14: テキストエディタでデフォルトのGemfileを開く

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

ruby '2.6.3'

# Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
gem 'rails', '~> 6.0.3'
# Use sqlite3 as the database for Active Record
gem 'sqlite3', '~> 1.4'
# Use Puma as the app server
gem 'puma', '~> 3.11'
# Use SCSS for stylesheets
gem 'sass-rails', '~> 5'
# Transpile app-like JavaScript. Read more: https://github.com/rails/webpacker
gem 'webpacker', '~> 4.0'
# Turbolinks makes navigating your web application faster.
# Read more: https://github.com/turbolinks/turbolinks
gem 'turbolinks', '~> 5'
# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder
gem 'jbuilder', '~> 2.7'
# Use Redis adapter to run Action Cable in production
# gem 'redis', '~> 4.0'
# Use Active Model has_secure_password
# gem 'bcrypt', '~> 3.1.7'

# Use Active Storage variant
# gem 'image_processing', '~> 1.2'

# Reduces boot times through caching; required in config/boot.rb
gem 'bootsnap', '>= 1.4.2', require: false

group :development, :test do
  # Call 'byebug' anywhere in the code to stop execution and get a
  # debugger console
  gem 'byebug', platforms: [:mri, :mingw, :x64_mingw]
end

group :development do
  # Access an interactive console on exception pages or by calling 'console'
  # anywhere in the code.
  gem 'web-console', '>= 3.3.0'
  gem 'listen', '>= 3.0.5', '< 3.2'
  # Spring speeds up development by keeping your application running in the
  # background. Read more: https://github.com/rails/spring
  gem 'spring'
  gem 'spring-watcher-listen', '~> 2.0.0'
end

group :test do
  # Adds support for Capybara system testing and selenium driver
  gem 'capybara', '>= 2.15'
  gem 'selenium-webdriver'
  # Easy installation and use of web drivers to run system tests with browsers
  gem 'webdrivers'
end

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

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

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

gem 'sqlite3'

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

gem 'capybara', '>= 2.15'

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

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

gem 'rails', '~> 6.0.3'

このように指定すると、rails gemのバージョンが6.0.3と同じかそれより上であり、かつ6.1より小さい場合にインストールされます。つまり、以下のコードを実行すると、>=という記法では常に最新のgemがインストールされ、~> 6.0.3という記法ではマイナーバージョンの部分に相当するアップデート済みのgemをインストールします（例: 6.0.4はインストールされますが、6.1.0はインストールされません）¹¹。

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

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

なお、この置換えのついでに、sqlite3 gemをdevelopment環境とtest環境（7.1.1）だけで使う（つまりproduction環境では使わない）ように変更している点にもご注目ください。これは、後でHerokuで使うデータベースと競合する可能性を防ぐための処置です（1.5）。

最後に、Rubyの正確なバージョン番号を指定する行（ruby '2.6.3'）をリスト 1.7から削除している点に注意してください。業務でWebサービスを開発する場面では削除しないことをオススメしますが、本チュートリアルでは、この行が残っているとエラーになる可能性が高まります。

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

gem 'rails',      '6.0.3'
gem 'puma',       '4.3.6'
gem 'sass-rails', '5.1.0'
gem 'webpacker',  '4.0.7'
gem 'turbolinks', '5.2.0'
gem 'jbuilder',   '2.9.1'
gem 'bootsnap',   '1.4.5', require: false

group :development, :test do
  gem 'sqlite3', '1.4.1'
  gem 'byebug',  '11.0.1', platforms: [:mri, :mingw, :x64_mingw]
end

group :development do
  gem 'web-console',           '4.0.1'
  gem 'listen',                '3.1.5'
  gem 'spring',                '2.1.0'
  gem 'spring-watcher-listen', '2.0.1'
end

group :test do
  gem 'capybara',           '3.28.0'
  gem 'selenium-webdriver', '3.142.4'
  gem 'webdrivers',         '4.1.2'
end

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

アプリケーションのGemfileの内容をリスト 1.8で置き換えたら、bundle installを実行してgemをインストールします¹³。

$ cd hello_app/
$ bundle _2.2.17_ install
Fetching source index for https://rubygems.org/
.
.
.

bundle installコマンドの実行にはしばらく時間がかかるかもしれません。完了後、アプリケーションが実行可能になります。

ちなみに、bundle installを実行すると「まずbundle updateを実行してください」というようなメッセージが表示される場合があります。その場合は、メッセージのとおりにbundle updateをまず実行しましょう（マニュアルどおりに行かない場合に慌てず落ち着いて対応することもスキルの１つです。こうしたエラーメッセージにはその場で問題を解決する方法が含まれているものなので、よく読んでおきましょう）。

最後に、1.2.2でセットアップしたYarnを使ってWebpackerをインストールして完了です。Webpackerの使い方は第5章で説明します。

$ rails webpacker:install

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.9と図 1.15に示した2行を追加します。

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

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

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

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

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

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

（クラウドでない）OSでrails serverの結果を表示するには、ブラウザのアドレスバーにhttp://localhost:3000を貼り付けてください。クラウドIDEの場合は、Previewを開いて［Preview Running Application］をクリックして（図 1.18）ブラウザのウィンドウかタブで表示します（図 1.19）。いずれの場合も、図 1.20のように表示されるはずです。

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

図 1.19: 実行中のアプリをブラウザウィンドウやタブで開く

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

1.3.3 Model-View-Controller（MVC）

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

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

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

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

1.3.4 Hello, world!

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

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

$ ls app/controllers/*_controller.rb

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

class ApplicationController < ActionController::Base

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

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

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

root 'controller_name#action_name'

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

Rails.application.routes.draw do
  # For details on the DSL available within this file,
  # see https://guides.rubyonrails.org/routing.html
end

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

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

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

演習

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

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

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

1.4.1 インストールとセットアップ

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

$ git config --global user.name "自分の名前"
$ git config --global user.email your.email@example.com

$ sudo ln -sf `which nano` /usr/bin

$ git config --global alias.co checkout

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

$ cd ~/environment/hello_app    # Just in case you weren't already there
$ git init
Reinitialized existing Git repository in
/home/ubuntu/environment/hello_app/.git/

$ git add -A

$ git status
On branch master

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"
[master (root-commit) df0a62f] Initialize repository
.
.
.

$ git log
commit b981e5714e4d4a4f518aeca90270843c178b714e (HEAD -> master)
Author: Michael Hartl <michael@michaelhartl.com>
Date:   Sun Aug 18 17:57:06 2019 +0000

    Initialize repository

1.4.2 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 master
Changes not staged for commit:
  (use "git add/rm <file>..." to update what will be committed)
  (use "git checkout -- <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")

ファイルがいくつか削除されましたが、この変更が行われたのは現在の「作業ツリー」内のみなので、まだコミット（保存）されていません。つまり、以前のコミットをcheckoutコマンド（と、現在までの変更を強制的に上書きして元に戻すための-fフラグ）でチェックアウトすれば、簡単に削除前の状態に戻すことができます。

$ git checkout -f
$ git status
On branch master
nothing to commit, working tree clean
$ ls app/controllers/
application_controller.rb  concerns/

削除されたディレクトリとファイルを無事復旧できました。これでひと安心です。

1.4.3 GitHub

Gitを使ってプロジェクトをバージョン管理下に置くことができたので、今度はGitHubにソースコードをアップロードしてみましょう。GitHubはGitリポジトリのホスティングと共有に特化したサイトです。リポジトリをGitHubにわざわざプッシュするのには2つの理由があります。１つ目は、ソースコード（とそのすべての変更履歴）の完全なバックアップを作成することです。２つ目は、他の開発者との共同作業をより簡単に行うことです。

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

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

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

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

新しいリポジトリページのフィールドに、リポジトリ名（hello_app）と適当なdescription（説明）を入力したら、万全の注意を払って確実に“Private”オプションを選択してください（ 1.27）。公開されているpublicリポジトリで自分のRailsアプリをうっかり人目にさらしてしまっても原理的には安全ではありますが、それでも秘密鍵を漏らしてしまうなど、何があってもおかしくありません。ですから、何か起きる前にリポジトリをデフォルトでprivateにしておく用心深さが大事です²³。

図 1.27: GitHubでprivateリポジトリを作成する

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

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

次にGitHubのドキュメントに従って、リポジトリをプッシュする際に必要な個人アクセストークンを作成しましょう。²⁴説明通りに必要事項を入力していき、Expirationでは個人アクセストークンの有効期限を設定します。

図 1.29: 有効期限は必要に応じて自由に設定できます

Select scopesでは個人アクセストークンに含める権限を設定します。本チュートリアルではrepoを追加してください。（その他の権限についてはGitHubのドキュメントをご覧ください）

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

Generate tokenをクリックして発行される個人アクセストークンは、ページを閉じるか移動すると消えてしまうので、次のステップで入力するまでページを開いたままにしておきましょう。また、ここで生成されたトークンはパスワードと同じように重要なものとして扱ってください。

最後にリスト 1.18のコマンドを実行し、メッセージに従って任意のユーザーネームと、Passwordには先ほど作成した個人アクセストークンを入力します。以後は設定した有効期間内であればパスワード入力は不要になります。²⁵

$ git remote add origin https://github.com/<あなたのGitHubアカウント名>/hello_app.git
$ git push -u origin master

リスト 1.18の最初のコマンドは、GitHubをリポジトリのoriginとしてGitの設定ファイルに追加するためのものです。次のコマンドでは、ローカルのリポジトリをリモートのoriginにプッシュ（push）します（-uフラグについては気にする必要はありません。気になる方は "git set upstream" で検索してみてください。また、ブランチ名についてはコラム 1.4で解説しています。）なお、リスト 1.18の<あなたのGitHubアカウント名>の部分は実際のユーザー名に置き換える必要があります。たとえば著者が行うのであれば、実行するコマンドは次のようになります。

$ git remote add origin https://github.com/mhartl/hello_app.git

上のコマンドを実行すると、hello_appのリポジトリのページがGitHub上に作成されます。このページでは、ファイルの参照、全コミット履歴などさまざまな機能を利用できます（図 1.31）。

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

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

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

Railsが自動生成したREADMEをそのまま使ってもよいですし、プロジェクトに合わせて内容を書き換えてももちろん構いません。ここでは、READMEをRailsチュートリアル固有の内容に合わせて書き換えてみましょう。それと同時に、Gitでbranch、edit、commit、mergeを行う際にお勧めのワークフローの実例をご覧いただきます²⁷。

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

$ git checkout -b modify-README
Switched to a new branch 'modify-README'
$ git branch
  master
* modify-README

Edit（編集）

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

リスト 1.19: 新しい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.33: READMEファイルを編集する

$ git status
On branch modify-README
Changes not staged for commit:
  (use "git add <file>..." to update what will be committed)
  (use "git checkout -- <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 checkout master
Switched to branch 'master'
$ 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 checkout -b topic-branch
$ <ココで何か変更を加えてみてください>
$ git add -A
$ git commit -a -m "Make major mistake"
$ git checkout master
$ git branch -D topic-branch

Push（プッシュ）

READMEファイルの更新が終わったので、GitHubに変更をプッシュして結果を見てみましょう。既に1.4.3で一度プッシュを行ったので、大抵のシステムではgit pushを実行するときにorigin masterを省略できます。

$ git push

デフォルトのREADMEと同様、更新されたREADMEもGitHubでよしなにHTMLに変換してくれます（図 1.34）。

図 1.34: GitHub上の更新したREADMEファイル

1.5.1 Herokuのセットアップとデプロイ

HerokuではPostgreSQLデータベースを使います（ちなみに発音は “post-gres-cue-ell” で、よく“Postgres”と略されます）。そのためには、本番（production）環境にpg gemをインストールしてRailsがPostgreSQLと通信できるようにします。

group :production do
  gem 'pg', '1.1.4'
end

HerokuではSQLiteがサポートされていないため、リスト 1.8の変更を行って、sqlite3 gemが本番環境に導入されないようにしておきます³²。

group :development, :test do
  gem 'sqlite3', '1.4.1'
  gem 'byebug',  '11.0.1', platforms: [:mri, :mingw, :x64_mingw]
end

最終的にGemfileはリスト 1.20のようになります。

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

gem 'rails',      '6.0.3'
gem 'puma',       '4.3.6'
gem 'sass-rails', '5.1.0'
gem 'webpacker',  '4.0.7'
gem 'turbolinks', '5.2.0'
gem 'jbuilder',   '2.9.1'
gem 'bootsnap',   '1.4.5', require: false

group :development, :test do
  gem 'sqlite3', '1.4.1'
  gem 'byebug',  '11.0.1', platforms: [:mri, :mingw, :x64_mingw]
end

group :development do
  gem 'web-console',           '4.0.1'
  gem 'listen',                '3.1.5'
  gem 'spring',                '2.1.0'
  gem 'spring-watcher-listen', '2.0.1'
end

group :test do
  gem 'capybara',           '3.28.0'
  gem 'selenium-webdriver', '3.142.4'
  gem 'webdrivers',         '4.1.2'
end

group :production do
  gem 'pg', '1.1.4'
end

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

本番用のgem（この場合はpg gem）をローカルの環境にはインストールしないようにするために、最初に特殊なbundle configコマンドを使って、本番でしか使わないgemをローカル環境にインストールしないようにしておきます（リスト 1.21）。

$ bundle _2.2.17_ config set --local without 'production'
$ bundle _2.2.17_ install

リスト 1.20で追加したgemは本番環境でしか使わないので、このフラグを追加したコマンドを実行してもローカル環境には本番用gemは反映されません。ではなぜ今リスト 1.21のコマンドを実行したかというと、pg gemを追加したことをGemfile.lockに反映させないと、本番環境へのデプロイで失敗してしまうためです。これから行う本番環境へのデプロイを成功させるために、変更した内容のコミットも忘れずにおこないましょう。

$ git commit -a -m "Update Gemfile for Heroku"

次にHerokuのアカウントを新規作成して設定します。まずはHerokuのユーザー登録を行います。続いて、自分のシステムにHerokuコマンドラインクライアントがインストールされているかどうかを確認します。

$ heroku --version

Herokuがインストールされていると、バージョン番号とともにherokuのコマンドラインインターフェース（Command Line Interface: CLI）が利用可能であるというメッセージが表示されます。ただしほとんどの場合は最初からインストールされていないので、The Heroku CLIからインストールする必要があります。クラウドIDEを使っている場合は、リスト 1.22のコマンドを実行することでHeroku CLIをインストールできます。

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

リスト 1.22のコマンドでインストールできたかどうかは、次のコマンドで確認することができます。正しくインストールできていれば、バージョン番号が表示されるようになります（バージョン番号は異なっていても大丈夫です）。

$ heroku --version
heroku/7.27.1 linux-x64 node-v11.14.0

Herokuのコマンドラインインターフェイス（CLI）がインストールされていることが確認できたら、いよいよherokuコマンドで、Herokuユーザー登録時に使ったメールアドレスとパスワードを入力して³³ログインします（なお--interactiveオプションを使うと、herokuコマンドでブラウザを開かないようにできます）。

$ heroku login --interactive

最後にheroku createコマンドを実行して、Herokuサーバー上に今回開発したアプリケーションの実行場所を作成します（リスト 1.23）。

$ heroku create
Creating app... done, blooming-bayou-75897
https://blooming-bayou-75897.herokuapp.com/ |
https://git.heroku.com/blooming-bayou-75897.git

このherokuコマンドを実行すると、Railsアプリケーション専用のサブドメインが作成され、ただちにブラウザで表示可能になります。今はまだ何もありませんが、すぐにデプロイしてWebページを表示させましょう。

1.5.2 Herokuにデプロイする（1）

Railsアプリケーションを実際にHerokuにデプロイするには、まずGitを使ってHerokuにリポジトリをプッシュします。警告メッセージが表示されることもありますが、今は無視してください。詳しくは7.5で解説します。

$ git push heroku master

1.5.3 Herokuにデプロイする（2）

失礼、その2はありません。以上でおしまいです。

デプロイされたアプリケーションの表示は、heroku create（リスト 1.23）を実行した際に生成されたアドレスをブラウザで開くだけです³⁴。実行結果を図 1.35に示します。ページの内容は図 1.22とまったく同じですが、今やそれがインターネット上の本番Webページとして確かに公開されているのです³⁵。

図 1.35: Heroku上で動いている最初のRailsチュートリアルアプリケーション

1.5.4 Herokuコマンド

Herokuのコマンドはたくさんあるので、ここでは簡単に触れる程度にとどめますが、少しだけ使ってみましょう。アプリケーションの名前を変更してみます。

$ heroku rename rails-tutorial-hello

実際は、Herokuで生成されたデフォルトのアドレスでも十分です。本当にアプリケーションの名前を変えてみたい場合は、次のようなランダムなサブドメイン名を設定し、この章の冒頭で説明したアプリケーションのセキュリティを実装してみる方法もあります。

hwpcbmze.herokuapp.com
seyjhflo.herokuapp.com
jhyicevg.herokuapp.com

このようなでたらめのサブドメイン名なら、URLを教えない限りサイトにアクセスされる心配もありません³⁶。ちなみに、Rubyの威力の一端をお見せするために、サブドメイン用のランダムな文字列を生成するコンパクトなコードをササっと書いてみます。

('a'..'z').to_a.shuffle[0..7].join

ここで使ったコード片は第4でまた登場します。³⁷

Herokuではサブドメインの他に独自ドメインも使えます。実を言うと、このRailsチュートリアルもHeroku上に置かれているのです。したがって、本チュートリアルをオンラインで読んでいるのであれば、まさに今HerokuにホスティングされたWebサイトを見ているということになります。カスタムドメインや他のHeroku関連の詳細な情報については、Herokuのドキュメント（英語）を参照してください。

1.6.1 本章のまとめ

• Ruby on Railsとは、Web開発のためのフレームワークであり、Rubyプログラミング言語によって記述されている。
• 事前設定済みのクラウド環境を利用することで、Railsのインストール、アプリケーションの生成、生成されたファイルの編集を簡単に行うことができる。
• Railsにはrailsという名前のコマンドラインコマンドがあり、rails newで新しいアプリケーションを生成したり、rails serverでローカルサーバーを実行したりできる。
• コントローラのアクションを追加したり、ルートルーティングを変更したりするだけで「hello, world」アプリケーションを作成できる。
• データの喪失を防止し、他の開発者との共同作業を行えるようにするため、Gitによるバージョン管理を導入してGitHubの非公開リポジトリにプッシュする。
• 作成したアプリケーションをHerokuの本番環境にデプロイした。