【Ruby on Rails チュートリアル①】環境構築からHello Worldまで

こんにちは、Kosaku(@bouru_02)です。

この記事では、Ruby on Rails チュートリアル(以後、チュートリアル)を初めて学習する人向けに、つまづきがちな所を解説しながら一緒に進めていきます。

詳しい手順を解説するというより、自分がチュートリアルを進めていてつまづいたポイントを解説していく形式なので、以下の公式サイトと合わせてご覧ください。

Ruby on Rails チュートリアル

今回は、Rubyを実際に動かすための環境構築から「Hello World!」と表示する簡単なアプリを作成するまでを解説します。

初心者でもわかりやすいよう、専門用語は適宜簡単に解説しながら進めていきますのでご安心ください!

注意!

この記事では、Windows10でローカル環境を使って開発を進めていきます。

Macユーザーや、クラウドIDEで開発をおこないたい場合はこの記事の解説通りに進まない可能性があります。

Ruby on Rails チュートリアルを始めるための前提知識

チュートリアル本編でも書かれていますが、Ruby on Railsを理解するには、ある程度の前提知識が必要となります。

具体的には、以下の知識があればOKです。

  • HTML/CSSで簡単なサイトを作れる
  • コマンドラインの基本的な使い方
  • SQLの基本操作(CRUD)
  • Rubyの基本的な文法

これらの基礎知識の中でまったく学んだことのないものがあるなら、先にProgateで対象のコースを学ぶことをおすすめします。


1.Ruby on Railsを動かすための開発環境構築

この項では、チュートリアルの「1.2 さっそく動かす」の内容の解説をしていきます。

環境構築とは

ここでいう環境構築とは、簡単にいえばプログラミングしたコードを実際に動かすための設定です。

HTML/CSS、javascriptなどはファイルを作成しブラウザで開くだけで実行されますが、Rubyはただコードを書いただけでは動きません。

これはRubyがサーバサイドで実行される言語で、サーバ上に適切に配置して初めて実行することができるからです。

参考サイト:【完全初心者向け】サーバサイドとは? 一体なんぞや?

チュートリアルでは、AWS Cloud9というクラウドサービスか、ローカルPC上に疑似的にサーバを構築し、そこでRubyを実行します。

つまり、今回おこなう環境構築は、Rubyを実行するための疑似的なサーバを構築し、Ruby on Railsを使用するための各種ファイルやソフトを準備、サーバに配置するということです。

なお、この記事ではローカル環境でRubyの環境構築をおこないます。

Ruby on Railsのローカル環境でのセットアップ方法

今回は、チュートリアルでも紹介されているRails Girls インストール・レシピに従って進めていきます。

この記事を書くにあたっては「Windows 用セットアップ」の手順でセットアップしています。

各種ソフトウェアのインストールに割と時間がかかりますが、「2-4 Rubyのインストール」までを指示に従って進めましょう。

「3. Railsのインストール」以降は、チュートリアルに戻って進めていきます。

Railsをインストールする

Ruby on RailsのインストールはRails Girls インストール・レシピではなくチュートリアルの手順で進めていきます。

これは、チュートリアルで使うRailsのバージョンとRails Girls インストール・レシピで紹介されているバージョンが違うからです。

1.「Hello World!」と表示する簡単なアプリを作成

ここからはチュートリアルの「1.3 最初のアプリケーション」の内容についてです。

チュートリアルは以下の流れで進んでいきます。

  1. プロジェクト(アプリはプロジェクトという単位で管理する)で使うenvironmentディレクトリの作成
  2. rails newコマンドを実行し、新規プロジェクトを作成
  3. Bundlerを実行して、アプリケーションに必要なgemをインストール
  4. rails serverコマンドを実行し、ローカルWebサーバーを起動
  5. アプリケーションを起動
  6. アプリケーションを編集して「hello, world!」という文字列を表示する

わかりにくい箇所の解説をしていきます。

プロジェクトで使うenvironmentディレクトリの作成

まずはアプリケーションを作成するための準備です。

Ruby on Railsではアプリケーションはプロジェクトという単位で管理します。

チュートリアルでは「environment」という名前のフォルダを作り、その中に各プロジェクトを格納します。

Bundlerを実行して、アプリケーションに必要なgemをインストール

rails newコマンドを実行し、「hello_app」という名前の新規プロジェクトを作成し、「1.3.1 Bundler」に入ったところからの解説です。

僕はここでいくつかつまづいたので、順番に解説していきます。

つまづきポイント①:Bundlerとは?gemとは?

「1.3.1 Bundler」では説明がなく、突然「Bundler」や「gem」という言葉が出てきます。

GemというのはRubyのライブラリで、ライブラリとは簡単にいうとプログラミングにつかえる便利な部品を集めたものです。

Gemを使うことで複雑な機能を簡単に実装できます。

例えば、ファイルのアップロードに関する処理をまとめたGemや、複雑な検索機能を作れるGemなど、Gemは無数に作られており、Ruby on RailsもGemの一種です。

Bundlerというのは、Gemを管理するためのツールです。

つまづきポイント②:Gemfileの場所がわからない

「1.3.1 Bundler」でGemfileを開いて編集する必要がありますが、Gemfileの場所がなかなかわからず時間がかかってしまいました…。

Ubuntuのルートパスから「/home/[ユーザー名]/environment/hello_app/Gemfile」という構成になっていることはわかるのですが、そもそもUbuntuがどこに保存されているのかがわからない!

PC内を検索してみつけたUbuntuへのパスは以下の通りです。

C:\Users\[ユーザー名]\AppData\Local\Packages\CanonicalGroupLimited.UbuntuonWindows_79rhkp1fndgsc\LocalState\rootfs\

この「rootfs」フォルダの下に「home」フォルダがあるので、そこから探していくとGemfileを見つけることができます。

ちなみにGemfileとは、Railsアプリで利用するgemが記述されているファイルのことです。

チュートリアルでは、「Hello World!」と表示するアプリで利用するgemに書き換えているのですね。

アプリケーションを編集して「hello, world!」という文字列を表示する

rails serverコマンドを実行し、アプリケーションがブラウザで表示できたら、アプリケーションを編集して「hello, world!」という文字列を表示するように変更していきます。

ここはチュートリアル通りに進めていけば問題なく「hello, world!」が表示できると思います。

問題はその後、「演習」で「hello, world!」の代わりに「hola, mundo!」と表示されるようにするという箇所。

つまづきポイント①:サーバを再起動しないと変更が反映されない

チュートリアル通りに進めて「hola, mundo!」と表示されるようにコードを編集したのですが、ブラウザをいくら更新しても変更が反映されませんでした。

試しにrails serverコマンドを再実行してみると正常に変更されていましたが、変更するたびに一々サーバを再起動するのはとても面倒ですよね…。

調べてみると、development.rbに以下を追加すればいいとのこと。

これでブラウザの更新をするだけで反映されるようになりました!

おわりに

ということで今回はRubyを実際に動かすための環境構築から「Hello World!」と表示する簡単なアプリを作成するまでを解説してきました。

環境構築は同じ手順でおこなっても同じようにうまくいかないことも多いですが、この記事が少しでもお役に立てれば幸いです。

つづきはこちらから!

【Ruby on Rails チュートリアル②】Gitによるバージョン管理~Herokuにデプロイまで

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です