Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
23
Help us understand the problem. What is going on with this article?
@drumath2237

【Rails入門】Cloud 9 で(ちょっと)Railsやってみよう!

More than 5 years have passed since last update.

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

Cloud9でRails

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

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

image

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

サーバを立てよう

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

rails server -p $PORT -b $IP

と入力すると立ち上がります。するとCloud 9からメッセージが出てきますので、そこの黄色いURLをクリックするとこんな画面が出てきます。
image
この画面が出れば、成功です。まずはRailsサーバ開通おめでとうございます。

コントロールを作ろう

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

rails generate controller hello

と打ちましょう。すると
image
シェルではこんな出力が出て、右のツリーで「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と打ちます。すると
image
Hello,Worldと表示されました。

最後に

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

23
Help us understand the problem. What is going on with this article?
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
drumath2237
≪リアルとバーチャルの健全な融和≫を目指して。 xR、CG、アバターシステムなどに興味があるB3学生

Comments

No comments
Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account Login
23
Help us understand the problem. What is going on with this article?