Ruby on Rails初心者の学習記録 Part1

はじめに

Ruby on Rails初心者の学習記録です。
Railsを利用して、簡単なWebアプリケーションを開発できるようになることをゴールにしています。

• Part2：モデル
• Part3：CRUD（前編）
• Part4：CRUD（後編）

1. Rubyの基礎を学習

Rubyも利用したことがなかったので、まずはRubyを簡単に勉強しました。
Progateというオンラインプログラミング学習サービスを利用しました。初心者がつまりやすい開発環境の構築が不要なので、手っ取り早くRubyの文法を学ぶうえでは、利用しやすかったです。

2. Railsインストール

1.である程度Rubyの雰囲気はつかめたので、次はRailsのインストール及び関連作業を行い、Railsを利用したWebアプリケーション開発の準備をします。
※利用OSはWindows11です。

ⅰ. Rubyインストール

Railsをインストールする前にRubyをする必要があります。「Rubyのインストールと環境設定」を参考にインストールしました。
インストール後、コマンドプロンプト（ターミナル）で「ruby -v」と入力して、実行すると以下のようにRubyのバージョンが表示されます。

ⅱ. SQLiteの設定

また、Railsで利用するデフォルトのデータベースであるSQLiteも事前にインストールが必要なようです。
「RailsからSQLite3を利用できるようにする」を参考に設定しました。
「sqlite3 --version」でバージョンを確認できます。

ⅲ. Railsインストール

以下のコマンドで、インストールします。

gem install rails

「rails -v」でバージョンを確認できます。

3. Webアプリケーションの開発

次は実際にアプリケーションの開発を行います。
「Getting Started with Rails」と「アプリケーション作成から実行までの手順」を参考にしました。

ⅰ. アプリケーションの作成

以下のコマンドで、アプリケーションを作成します。

rails new blog

作成が完了すると、アプリケーション名と同じ名前でフォルダが作成されました（今回は「blog」という名前のアプリケーションを作成）。
さらにその下には、各種フォルダ/ファイルが作成されています。各種フォルダ/ファイルの用途については、Rails公式ドキュメントに記載があります。
RailsはMVC（Model、View、Controller）アーキテクチャに基づいて構築されていますが、それらのフォルダはappフォルダ内にありました。ぱっと見では、実装時にどこに何を書けばよいかわかりやすそうです。

ⅱ. アプリケーションの起動

以下のコマンドでローカルサーバーを起動します。

rails server

http://localhost:3000/にアクセスすると、デフォルトのページが表示されます。

また、log/development.logの中身を見てみると、コマンドプロンプト（TERMINAL）と同じ内容が書き込まれています。

ⅲ. ルーティング

作成したアプリケーションに新しい画面を追加します。

Railsでは、config/routes.rbでルーティングの定義をしているようです。
/articlesにアクセスしたら、indexを表示するように定義します。

routes.rb

Rails.application.routes.draw do
  get "/articles", to: "articles#index"

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

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

次にコントローラーを作成するために以下のコマンドを実行します。

rails generate controller Articles index --skip-routes

実行後、以下のファイルが作成されます。

http://localhost:3000/articlesにアクセスすると、以下のページが表示されます。

こちらの画面のレイアウトは、先ほどのコマンドで作成されたファイル内に含まれているapp/views/articles/index.html.erbで定義しています。

index.html.erb

<h1>Articles#index</h1>
<p>Find me in app/views/articles/index.html.erb</p>

そのため、ファイル内を書き換えると、画面の表示も変わります。

index.html.erb

<h1>Hello, Rails!</h1>
<p>Find me in app/views/articles/index.html.erb</p>

ⅳ. デフォルト画面の設定

次は、http://localhost:3000 アクセス時も同じ画面が表示されるようにします。

設定ファイルは同じくconfig/routes.rbになります。
以下のようにrootの設定を追加します。

routes.rb

Rails.application.routes.draw do
  root "articles#index"
  
  get "/articles", to: "articles#index"

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

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

http://localhost:3000 にアクセスするとArticlesControllerのindexに指定した画面が表示されます。

最後に

今回はRubyの基本文法やRailsを利用したWebアプリケーションの開発環境構築手順及びルーティングについて学びました。
今後はMVCアーキテクチャのModelの部分やProgateで学んだRubyのコードをWebアプリケーションの開発でも利用してみたいと思っています。

最後までお読みいただきありがとうございました！

• Part2：モデル
• Part3：CRUD（前編）
• Part4：CRUD（後編）
• [Part5：復習])(https://qiita.com/Yasushi-Mo/items/032b671eed16acdadc6b)

参考

• Getting Started with Rails
• Progate
• RailsからSQLite3を利用できるようにする
• Ruby on Rails入門
• Rubyのインストールと環境設定
• アプリケーション作成から実行までの手順