Cloud9を使ってみよう

こんにちはtyadです。今日はオンライン統合開発環境であるCloud9を紹介します！

Cloud9とは

Cloud9とは、JavascriptやNode.jsのアプリケーションのための統合開発環境です。
HTML、CSS、PHP、Java、Rudyなど様々な言語にも対応しています。
Cloud9 IDEのサイトにサインアップし、オンラインで利用できますが、
今回はubuntuでローカル環境に構築する方法を紹介します。

Cloud9をインストールしてみよう

1.Node.jsのインストール

Cloud9にはNode.jsを使います。
そのためにまずはNode.jsをインストールしましょう。

・必要なものを一通りインスト―ル

$ sudo apt-get install -y build-essential curl libssl-dev libxml2-dev

・Node.jsをwgetでダウンロードして展開。

$ wget http://nodejs.org/dist/node-latest.tar.gz
$ tar zxvf node-latest.tar.gz
$ ls
node-latest.tar.gz  node-v0.10.10

・インストール

$ cd node-v0.10.10
$ ./configure
$ make
$ make install

・確認

$ node -v
v0.10.10

これでNode.jsが使えるようになりました。

2.Cloud9をインストール

・Cloud9をクローン

$ git clone git://github.com/ajaxorg/cloud9.git

・Cloud9に必要なnodeモジュールをインストール

$ cd cloud9
$ npm install

これでインストールは完了です。

Cloud9を使ってみよう

・Cloud9を起動

$ ./bin/cloud9.sh

すると

...
...
Started '/home/tyad/cloud9/configs/default'!
IDE server initialized. Listening on localhost:3131

このように表示されるのでlocalhost:xxxx(ここでは3131)にブラウザでアクセスします。

するとこんな画面が出てくると思います。
ここでファイルやディレクトリの作成・編集といった操作の他、
画面下の入力がコンソールとなっていてコマンドを実行することができます。

では実際にNode.jsのコードを書いてみましょう！
コードは以前高木さんが紹介されていたNode.jsのコードを使ってみます！
→http://blog.t-lab.cs.teu.ac.jp/2012/12/nodejs.html
左上の「File」をクリックして「New File」でファイルを作成します。
ファイル名は「helloworld.js」にしました。

コードはこんな感じ。（"暇人乙"を"Hello world"にしてみました。）

var http = require('http');
var server = http.createServer(function(req, res){
  res.write('Hello world');
  res.end();
});
server.listen(30000);

これを書いたらCtrl+Sで保存して「Run」をクリックすると

こんな感じでコンソールになんか表示されますのでブラウザでlocalhost:30000にアクセス。

「Hello world」が表示されました。
こんな感じでコードを書いて開発することができます。

Cloud9のここが便利！

さて、実際にコードを書いて開発することができましたがここまでの説明だと、
普通にIDEをインストールして開発してるのと対して変わらない気がしないでもないですね。
というわけで一番便利だと思った機能の説明をします。

・Cloud9を起動する際にオプションをつけます。

$ ./bin/cloud9.sh -l 192.168.xxx.xxx -p 3000 

「-l」で自身のプライベートIPアドレス(今回は.192.168.1.15)、
「-p」でポート(今回は3000)を指定します。
こうして起動することで、
同じネットワーク内のどのパソコンからも、
ブラウザから同じリポジトリで開発することができるのです。
タブレットからでもできます！(重いですが。)

これは便利！まさにクラウドって感じがします。

まとめ

今回の記事ではCloud9の導入方法と、初歩的な使い方を紹介いたしました。
Cloud9は他のIDEのようにブレークポイントを設定してデバッグすることや、
コード補完、コードチェックなど様々な機能があります。
また、githubやWindows Azureなど他のウェブサービスとの連携も可能となっています。
ぜひ利用してみてください！