ADACHI TECH BLOG

ADACHI TECH BLOG

フリーランスwebエンジニアを目指す22歳の発信ブログ

【Rails初心者向け】アプリ作成から「Hello,World!」表示までの手順を紹介

f:id:adachi0055:20190606112033j:plain

こんにちは!足立です。
今日は備忘録も兼ねて、Ruby on Railsのアプリ作成からビュー表示までの一連の手順を紹介しようと思います!よろしくお願いします。


アプリケーションの作成

ターミナル

$ Rails new rails-twitter -d mysql  # アプリケーション作成
$ cd rails-twitter            # 作成したアプリのフォルダに移動
$ rake db:create                # データベースを作成

Rails new ○○○ -d mysqlによりRailsアプリを作成することができます。
しかし、このままでは何も表示できないため、ルーティング・コントローラ・ビューの三つを作っていきます。

ルーティング・コントローラ・ビューの作成

ルーティングの設定

config/routes.rb

Rails.application.routes.draw do
  get "tweets" => "tweets#index"
end

ルーティングの設定によりコントローラのアクションにURLを割り当てることができます。
今回は/tweetsのURLにアクセスするときはtweetsコントローラのindexアクションを使用してください!と指示しました。

続いて、tweetsコントローラとindexアクションを作成していきます。

コントローラの作成

ターミナル

$ rails g controller tweets

ターミナルで上記のコマンドを実行することでtweetsコントローラが作成されます。
tweetsコントローラの中身も編集していきましょう!

app/controllers/tweets_controller.rb

class TweetsController < ApplicationController
  #indexアクションを定義。中身はひとまず空っぽで良い。
  def index
  end

end

これでtweetsコントローラのindexアクションを定義することができました。
indexアクションの中身は空ですが、特に指定しない場合は「app/views/tweets/index.html.erbを読み込んでください」といった命令が自動で実行されるため、後はHTMLを書くだけで画面を表示することができます。
では、HTML文を書いていきましょう!

ビューの作成

app/views/tweets/index.html.erb

<h1>Hello world!</h1>

最後にターミナルでrails sを行いRailsサーバーを起動させます。 その後、ブラウザで「http://localhost:3000/tweets」にアクセスして以下の画面が表示されていれば成功です!

f:id:adachi0055:20190609140359p:plain

まとめ

いかがだったでしょうか?
ここから更にモデルを追加したり、gemの機能を追加したりすることで様々なサービスを作ることができます。ぜひ調べて実装して見ましょう!