Codeanyware(Cloud9のようなCloud IDE)で無料でさくっとRuby on Rails開発を始めよう

# Codeanyware

Cloud9に代表されるCloud IDEの一つです。
https://codeanywhere.com/

以下の特徴があります。
- ブラウザ上で開発ができる
- 無料で始められる(クレジットカードの登録不要)
- 言語やWEBフレームワークごとのコンテナが用意されており環境構築の手間が省ける
- 他のユーザーとリアルタイムで一つのソースコードを編集できる(オンラインでのペアプロ)
- スマートフォンアプリが用意されていてどこでも開発できる
- ターミナルを使えるためyumやaptでミドルウェアをインストールできる
- コンテナをそのまま独自ドメインで公開できる
- 有料プランの内容にあわせてサービス内容やコンテナスペックをパワーアップさせられる
などなど...

以下のような方にはもってこいの環境ではないでしょうか。
- とりあえずプログラミングを始めてみたい（環境構築簡単）
- オンラインでプログラミングを教えたい・教わりたい
- Herokuのような環境+IDEがほしい

# Ruby on Rails環境構築

## Rubyのコンテナ作成

初回起動時はどのコンテナを起動するかの選択肢が表示されます。

Rubyというコンテナを選択すると、Ruby on Railsが導入済みのコンテナを作成することができます。
今回はCentOSバージョンを選択しました。

PHPの場合はLaravelやCakePHPなども選択可能です。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/106949/d714e248-260b-1b1c-6555-78817cf1df2d.png)

Createボタンを押すと、コンテナが作成され、起動し始めます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/106949/6b9f1858-851d-c04f-5a64-25aa100db419.png)

起動し終わると以下のような画面になります。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/106949/56b73bff-493c-801b-e252-09ec2c511a11.png)

ここで、歯車マークの隣りにある再生ボタンを押してみましょう。
別タブが開き、RailsのWelcomeメッセージが表示されます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/106949/a6b1d5bc-d0af-f9ea-55a8-f3da0d742c17.png)


ブラウザによってはポップアップブロックで引っかかるので、解除しましょう。

![popupblock.png](https://qiita-image-store.s3.amazonaws.com/0/106949/a2abf842-d4d2-5ccd-228c-74d2a65dc35f.png)

画面左側がファイルエクスプローラーになっています。
コンテナ起動直後はファイルが表示されていないかもしれませんが、再生ボタンを一度押した後、Connectionsの下にあるプロジェクト名部分を右クリックしてRefreshするとファイルが表示されるようになります。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/106949/95c30d7e-f15b-3313-925d-0a1038cbf446.png)

ファイルが表示されたかと思います。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/106949/5c12b1b0-12f5-40cb-9a6a-f5e49c18e494.png)

ターミナルはファイルエクスプローラー上でプロジェクト名を右クリックしSSH Termnalを選択します。
ターミナルが起動しました。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/106949/41d087cb-acd3-b22a-032b-9514df7c5248.png)


## アプリケーション開発

DBへのアクセスが可能かどうかを確認してみたいと思います。
titleとdetailというフィールドを持つTaskというデータにアクセスできるようにしてみます。

```
rails generate scaffold tasks title detail
```

![image.png](https://qiita-image-store.s3.amazonaws.com/0/106949/893c14e9-2890-dd38-2c50-a98e026363e0.png)

`rake db:create`を実行するとすでに存在すると言われます。
デフォルトではsqliteを利用するようです。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/106949/2bd7847e-2177-db0e-4cc9-8d94c58d93e7.png)

続いて以下のコマンドを叩いてみます。

```
rake db:migrate
```

![image.png](https://qiita-image-store.s3.amazonaws.com/0/106949/3703364b-0649-052d-f203-e4a7d5913df6.png)

tasksテーブルの生成に成功したようです。

歯車マークの隣の停止ボタンを押し、改めて再生ボタンを押してみましょう。

ブラウザの別タブが開くので、そのタブのURLの末尾に`/tasks`を追加すると、以下のような画面が表示されます。
New Taskのリンクからレコードを追加できるか試してみてください。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/106949/e795b8ae-06c2-0661-c52a-d0d66dc74578.png)

入力画面で値を適当に入れ、Craete Taskボタンを押します。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/106949/4c12c0c3-c000-1d61-f09a-51e141119068.png)

成功メッセージが表示されます。
Backのリンクを押します。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/106949/dc6c57e8-aa4f-1f0e-7597-b65544adc1fd.png)

一覧に先程入力した値が表示されれば動作確認OKです。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/106949/a81c75ac-d2ef-70e5-fae9-7974c85ba44e.png)

## ミドルウェア導入

yumやaptが使えるため自由に導入可能です。
例えばCentOSにmysqlを導入してみましょう。

```
sudo yum install mysql
```

![image.png](https://qiita-image-store.s3.amazonaws.com/0/106949/c9b81511-4ba4-157d-c0f2-9d94a6749d05.png)

`Is this ok [y/N]:`と聞かれるので`y`を入力するとインストールが継続されます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/106949/4046797b-8009-ed51-c9e0-01b336b8427a.png)

無事インストールできました。

# ペアプロ環境のセットアップ

メニューバーの中に三角のマークがあります。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/106949/6ba77e79-3af9-9104-6a60-2c6a2dc56fad.png)

これをクリックすると、共有相手を指定するダイアログが表示されます。
メールアドレスを指定して、プロジェクトに招待することが可能です。
また、招待URLを生成することも可能です。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/106949/41c5103a-0fd2-b593-ef7d-d9f59d544cdd.png)

共有を受けた側は、Codeanywareのダッシュボード上から共有を受けているプロジェクトを参照できます。

https://codeanywhere.com/dashboard/#sharedwithme
![image.png](https://qiita-image-store.s3.amazonaws.com/0/106949/62fafbe9-9cc2-10cd-52c5-92b9faf408b4.png)

編集権限で共有を受けている場合はソースコードを編集可能です。
Cloud9はリアルタイムでソースコードの変更が共有されますが、Codeanywareは即時反映ではないようで、誰かが編集した内容は、ファイルを開き直したときに反映されているようでした。

# 最後にCloud9との違いをゆるく記述

Cloud SDKではCloud9が有名ですが、AWSに統合されてからは使い始めるまでの手順が増え(AWSのアカウントが必要など)、Amazonに買収される前と比較して気軽に始めるにはハードルが高くなったと感じます。

その点、CodeanywareはSNSアカウントでアカウント作成し、カード登録もせずにコードを書き始められるなど、非常に手軽に始めることができました。
また、スマホアプリもあるというのも、Cloud9にない特徴かなと思いました。

使い倒していく上では、それ以外の細かい点での好き・嫌いがあると思いますし、有料プランで出来る内容も違うと思うので、両方使って比較するのが良いかなと思いました。
ペアプロするにはCloud9のリアルタイムでの更新の反映が非常にパワフルなので、Cloud9の方がオススメできるかなと思いました。