【Rails入門】Cloud 9 で（ちょっと）Railsやってみよう！

どうも。高校生プログラマのdrumathです。この間Life is TechのWebプログラミングコースを体験してきました。そこでWebプログラミングって楽しいなぁって感じたので今回の記事を書かせていただきました。ちなみにLife is TechではSinatraというフレームワークを使いました。

Cloud9でRails

まずCloud 9　にアクセスしましょう。アカウントを持っていない方はまずそこから。

で、新規作成(Create a new WorkSpace)を押して、適当な名前を付け、Railsマークのついた「Ruby」の項目にマーク。

コンテナが出来たら、READMEが出ていますので、一回消して
下のbashコンソールを使ってRailsの環境を整えます。

サーバを立てよう

Railsは標準でサーバーを用意してくれているので、まずサーバを立ち上げてみます。
Bashに

rails server -p $PORT -b $IP

と入力すると立ち上がります。するとCloud 9からメッセージが出てきますので、そこの黄色いURLをクリックするとこんな画面が出てきます。

この画面が出れば、成功です。まずはRailsサーバ開通おめでとうございます。

コントロールを作ろう

再びbashの方に移って、今度は

rails generate controller hello

と打ちましょう。すると

シェルではこんな出力が出て、右のツリーで「hello　」から始まるファイルが追加されているのがわかります。Rails開発ではappフォルダの中身をいじっていくことが多くなるので覚えておきましょう。開発においてMVCモデルというのが重要になっていきます。わからない人は調べてみてください。簡単に言うと、Mはモデル、Vはビュー、Cはコントローラの略で、それぞれ、データベースやHTML、CSSやスクリプトの役割を意味します。今回はコントローラ部分だけをいじっていこうと思います。

Hello, World!

hello_controller.rb

最初にappフォルダ内のhello_controll.rbにコードを記述していきます。
初期のファイルの中は

class HelloController < ApplicationController
end

ですが、クラスの中に

class HelloController < ApplicationController
    def index
        render text: "Hello, World!"
    end
end

と記述してください。render text:'something'で文字を出力するのは、一般的なやり方ではありません。さきほど述べた、ビューをここに埋め込んでHTML（正確にはERB）を操作する形になります。しかし、今回はHello,Worldだけなので、とりあえず。。。

ルーティング

では次にルーティングの設定を行います。ルーティングとはブラウザにどのファイルを表示するか、みたいなものです。この設定はconfigフォルダ内のroutes.rbに記述します。
初期の段階では

Rails.application.routes.draw do
  # The priority is based upon order of creation: first created -> highest priority.
  # See how all your routes lay out with "rake routes".

  # You can have the root of your site routed with "root"
  # root 'welcome#index'

  # Example of regular route:
  #   get 'products/:id' => 'catalog#view'

  # Example of named route that can be invoked with purchase_url(id: product.id)
  #   get 'products/:id/purchase' => 'catalog#purchase', as: :purchase

  # Example resource route (maps HTTP verbs to controller actions automatically):
  #   resources :products

  # Example resource route with options:
  #   resources :products do
  #     member do
  #       get 'short'
  #       post 'toggle'
  #     end
  #
  #     collection do
  #       get 'sold'
  #     end
  #   end

  # Example resource route with sub-resources:
  #   resources :products do
  #     resources :comments, :sales
  #     resource :seller
  #   end

  # Example resource route with more complex sub-resources:
  #   resources :products do
  #     resources :comments
  #     resources :sales do
  #       get 'recent', on: :collection
  #     end
  #   end

  # Example resource route with concerns:
  #   concern :toggleable do
  #     post 'toggle'
  #   end
  #   resources :posts, concerns: :toggleable
  #   resources :photos, concerns: :toggleable

  # Example resource route within a namespace:
  #   namespace :admin do
  #     # Directs /admin/products/* to Admin::ProductsController
  #     # (app/controllers/admin/products_controller.rb)
  #     resources :products
  #   end
end

こんな感じの長いコメントがありますが、気にしないでください。
この最後のendの前に一行足します。

Rails.application.routes.draw do
  #～中略～
  match ':controller(/:action(/:id))', via: [:get, :post, :patch]
end

これでルーティングの設定は終わりです。:controllerはようするにhelloのことでさきほどrails generate controller helloをしましたよね。helloというルーティングに行ったときに”Hello,World”が表示されるという意味になります。かっこがついているのは省略可能という意味です。

実際に動かしてみる

ではまたrails s -p $PORT -b $IPでサーバを起動してみましょう。
その次にURLの後ろに/hello/indexと打ちます。すると

Hello,Worldと表示されました。

最後に

今回、Railsを使ってHello,Worldをやってみたわけですが、実際いじったのはコントローラ部分だけです。ここからHTMLを編集したり、データベースをいじったりすることで、Webプログラミングができます。