クラウドIDEを使ってみよう!無料で使えるCloud9の使い方

cloud9-top
Pocket

プログラミングをするには開発環境の構築が必要です。しかし、開発環境の構築は面倒であり、慣れていないと難しいです。開発環境を構築する必要がなく、無料かつ簡単に使えるサービスがあれば良いですよね。

そこで、クラウドIDE(統合開発環境)の出番です。

クラウドIDEとは、クラウド上で開発環境を使えるサービスです。手軽に始めることができるため、プログラミングの勉強やアプリケーションの作成などに向いています。

本記事では、Amazonが買収したことでも有名なクラウドIDE「Cloud9」を紹介します。Cloud9の特徴、料金プランを確認したのち、アカウントの作成、ワークスペースの使い方を見ていきましょう。

スポンサーリンク

Cloud9とは

Cloud9とは、クラウドIDEというクラウド上で開発環境を使えるサービスの1つです。クラウド上であるため、ローカル(自分のPC)にインストールする必要がなく、ブラウザがあれば使うことができます。

開発環境を構築するのが面倒な場合や手軽に始めてみたいという場合におすすめです。

特徴

  • インストール不要
  • 40種類以上のプログラミング言語をサポート
  • 共同開発ができる
  • 様々なサービスと連携できる

インストール不要

クラウド上で使うサービスであるため、ローカル(自分のPC)にインストールは不要です。そのため、PCやタブレットなどデバイスに依存せず使うことができます。

40種類以上のプログラミング言語をサポート

Web開発で必要なプログラミング言語はほぼサポートしています。マイナーな言語でない限りは特に気にせず使うことができます。

詳細なリストについては、公式サイト(Supported Languages)をご参照ください。なお、サポートしているプログラミング言語のフルリストはCloud9内の「View」→「Syntax」で確認できます。

共同開発ができる

ワークスペースを作成するときに公開範囲を設定することができます。「Private」であれば個人のみで使うことができ、「Public」であればシェアした人と共同開発ができます。

様々なサービスと連携できる

  • GitHub
  • Google Cloud Platform
  • Bitbucket
  • Heroku

ソースコードを管理する「GitHub」や「Bitbucket」、アプリケーションを実行するためのプラットフォーム「Heroku」などと連携することができます。

料金プラン

cloud9-pricing-guide

Free Individual Teams(BETA) Education
料金 無料 月額$19 月額$29 × 人 月額$1 × 先生
ワークスペース
public:無制限
private:1個
private:無制限
ssh:無制限
Hot:3個
team:無制限
Hot:10個
public:無制限
private:1個 × 生徒
生徒:無制限
サポート コミュニティ メール メール コミュニティ

料金プランは全部で4つあります。

無料で使いたい場合は「Free」を選びましょう。基本機能は全部使えますので、問題なくプログラミングをすることができます。

ワークスペースの性能をもっと良くしたい場合は、有料プランの「Individual」を選ぶと良いです。「Free」よりもワークスペースの性能が向上します。また、ワークスペースの「Hot」は、ワークスペースを起動したままにするため、次回ワークスペースの起動を早くすることができます。

他には、チームで使う場合は「Teams(BETA)」、学校など生徒に教える場合は「Education」など、用途別にプランがあります。

Cloud9の使い方

それではCloud9を使ってみましょう。まずはアカウント作成をしていきます。

アカウントの作成方法

Cloud9の公式サイトから、画面中央の入力欄にメールアドレスを入力し、「Sign Up」ボタンをクリックします。

cloud9-top

アカウント作成画面になりますので、まずは「Your Name」を入力します。

cloud9-create-account-name

次に、「Username」を入力します。プロフィールのURLやワークスペースのURLに使われる名前になります。

cloud9-create-account-username

次に、アンケートを入力します。Cloud9の用途などを選びます。

cloud9-create-account-kind-of-use

今まで入力した内容を確認し、問題なければ「Next」をクリックします。

cloud9-create-account-confirmation

次に、クレジットカード情報を入力します。クレジットカード情報はアカウント作成に必ず必要となりますが、無料プランの「Free」を使う場合は料金が発生することはありません。

cloud9-create-account-card-information

次に、「私はロボットではありません」にチェックを入れ、「Create account」をクリックします。

cloud9-create-account-one-last-thing

最後に、パスワードを登録します。登録したメールアドレスにCloud9からメールが来ていますので、リンクをクリックして登録します。

cloud9-mail

以上で、アカウントの作成は完了です。

ワークスペースの作成方法

それでは、ワークスペースを作成してみます。Cloud9のダッシュボード内の「Create a new workspace」をクリックします。

cloud9-dushboard

続いて、作成するワークスペースの情報を入力し、「Create Workspace」をクリックします。

cloud9-workspace-create

  • Workspace name:ワークスペースの名前
  • Description:ワークスペースの説明
  • Hosted workspace:Private(非公開) or Public(公開)
  • Clone from Git or Mercurial URL:Git or Mercurialからコードをクローン(必要な場合のみ)
  • Choose a template:ワークスペースの環境

「Free」プランの場合、Privateは1個のみ作ることができます。テンプレートは使用するプログラミング言語に合わせて選びましょう。

ワークスペースが作成されましたら、ワークスペースの画面が表示されます。

cloud9-workspace

ワークスペースの使い方

では、さっそくワークスペースを使ってみます。HTMLテンプレートで基本的な操作を紹介しながら、「Hello World!」を作ってみましょう。

まずは、ファイルを作成してみます。左のサイドメニュー上で右クリックをし、「New File」をクリックします。ファイル名は適当に「HelloWorld.html」としておきます。

cloud9-workspace-create-file

次に、ファイルの編集をします。「HelloWorld.html」上で右クリックし、「Open」をクリックします。

cloud9-workspace-open-file

「Hello World!」のコードを入力し、「File」→「Save」でファイルを保存します。

cloud9-workspace-save-file

最後に、実行結果を見てみましょう。「Preview]→「Live Preview File(HelloWorld.html)をクリックします。

cloud9-workspace-run-application

画面の右側に実行結果が表示されます。画面を切り替えることなく、実行結果を確認できます。ちなみに「Run」を実行した場合は、WebサーバのApacheが起動します。Apacheを起動すると、URLを確認できますので、ブラウザでも実行結果を確認できます。

cloud9-workspace-result

ワークスペースの共有方法

ワークスペースが「Public」であり、Cloud9に登録している人であれば、簡単にワークスペースの共有ができます。

まず、ワークスペース画面の「Share」をクリックします。

cloud9-workspace-share

「Invite People」に共有したい人のユーザ名またはメールアドレスを入力し、「Invite」をクリックすると、ワークスペースの共有ができます。また、読み取り専用などアクセス許可の権限をを決めることができます。

cloud9-workspace-invite

まとめ

Cloud9の基礎知識から基本的な使い方までを紹介しました。簡単にワークスペースの共有ができますので、開発効率をあげることができます。無料で使ってみたい方や手軽にプログラミングを初めてみたい方におすすめです。

スポンサーリンク

feedly、RSSをフォローする