未来を感じずにはいられないクラウドIDE 〜Cloud9〜

f:id:Naotsugu:20160717225445p:plain

Cloud9 IDE とは

Webブラウザ上で動作する統合開発環境です。

クライアント環境に依存せず、Docker コンテナ上に構築されたワークスペースを共有でき、GitHub や Heroku などのサービスとの連携もスムーズです。

あらかじめ容易されたワークスペースのテンプレートを利用することで、素早く簡単に開発環境を手に入れることができます。

Cloud9 は先日 Amazon.com に買収されましたが、現状のサービスは継続して提供されます。今後、AWS との連携が強化されていくことになるのでしょう。

Cloud9 のはじめ方

Cloud9 IDE は無料枠で利用を開始できます。

c9.io にアクセスしてアカウントを作成します。メールアドレスを登録して「Sign Up」

f:id:Naotsugu:20160717171729p:plain

次に氏名を登録します。

f:id:Naotsugu:20160717171918p:plain

続いてアカウント名を登録します。

f:id:Naotsugu:20160717171941p:plain

幾つか質問に答え、

f:id:Naotsugu:20160717172051p:plain

登録内容の確認。

f:id:Naotsugu:20160717172227p:plain

クレジットカードの情報を登録します。大量のアカウント取得などを制限するためにクレジットカードの情報登録が必須になっています(以前は不要だった)。無料枠であれば課金されることもないため、安心してください。

f:id:Naotsugu:20160717172645p:plain

で、bot 対応に答えて完了です。

f:id:Naotsugu:20160717172252p:plain

ワークスペースの作成

アカウントの登録が完了すると、ワークスペースの選択画面になります。

「Create a new workspace」でワークスペースを作成していきます。

f:id:Naotsugu:20160717172437p:plain

ワークスペース名とテンプレートを選びます。今回は「Raild Tutorial」を選択しました。

f:id:Naotsugu:20160717172750p:plain

すると統合開発環境の画面になります。よくあるIDEと同じ構成で特に迷いはないかと思います。

f:id:Naotsugu:20160717172501p:plain

Welcome 画面でテーマなど変更できます。

f:id:Naotsugu:20160717173230p:plain

Rails Tutorial をかじる

画面下部がターミナルになっており、クラウド上の Ubuntu(この時点では Ubuntu 14.04.3 LTS) がそのまま使えます。

今回選択したテンプレートでは、ruby はインストール済みですが、Rails は入っていないので、gem でインストールします。

$ gem install rails -v 4.2.2

終わったら rails new します。

$ rails _4.2.2_ new hello_app

f:id:Naotsugu:20160717173510p:plain

必要に応じて Gemfile を編集しアプリケーションに必要なgemをインストールおよびインクルードします。

$ cd hello_app/
$ bundle install

サーバの実行

ではrails server で実行してみましょう。

$ rails server -b $IP -p $PORT

f:id:Naotsugu:20160717173639p:plain

緑色のポップアップでURLが出るのでリンクをクリックします。

f:id:Naotsugu:20160717173723p:plain

動いていますね。

Hello World する

app/controllers/application_controller.rb を開きます。

class ApplicationController < ActionController::Base
  # Prevent CSRF attacks by raising an exception.
  # For APIs, you may want to use :null_session instead.
  protect_from_forgery with: :exception

  def hello
    render text: "hello, world!"
  end
end

Applicationコントローラに hello を追加しました。

f:id:Naotsugu:20160717173756p:plain

config/routes.rb を開きます。

Rails.application.routes.draw do
  .
  # You can have the root of your site routed with "root"
  # root 'welcome#index'
  root 'application#hello'
  .
end

作成した hello を指定します。

f:id:Naotsugu:20160717173811p:plain