【保存版】Cloud9の使い方を徹底解説【登録から注意点まで】

cloud9のサムネイル

https://remublog.net/wp-content/uploads/2019/02/kurohamu04.jpg
ぼく

プログラミングの開発環境を作るの難しすぎるよ!

実は、プログラミングの開発環境はCloud9というサービスを使うことで、手軽に構築できます。

なぜなら、Cloud9とはプログラミングに必要なツールがすべて揃っているキットだからです。

本記事では、Cloud9の使い方を中心に、導入方法から注意点までを解説します。

記事を読み終える頃には、プログラミングを書くための環境が整っていますよ。

AWS Cloud9とはなんなのか?

AWS Cloud9を正確に表すと、amazonが提供するクラウドコンピューティングサービスで、ブラウザ上で開発環境を用意してくれるサービスです。

といわれても、いまいちパッとわからないですよね。

それぞれの言葉の意味を確認してみましょう。

クラウドコンピューティングとは

クラウドコンピューティングを一言であらわすと、ネット上で利用できるサービスです。

略してクラウドとも言います。

クラウドを活用することで、インターネット上に動画や画像、データを保存できます。

したがって、複数のPCやスマホからアクセスすることが容易になります。

さらにネット上にデータを保存するので、デバイスのストレージを埋めてしまう心配もありません。

AWSとはなんなのか

AWSとはAmazon Web Servisesの略で、米Amazonが提供している クラウドコンピューティングサービス の総称です。

クラウドコンピューティングサービスは、 AWS(Amazon)、Azure(Microsoft)、CloudPlatform(Google)、Bluemix(IBM)の4社が世界の5割超のシェアを占めています。

その中でもAWSはダントツでトップを走っており、世界クラウド市場の3割のシェアを占めていると言われています。

https://remublog.net/wp-content/uploads/2019/02/kurohamu04.jpg
ぼく

要するに、ブラウザ上でプログラミングができるわけね

Cloud9を利用する手順

それでは実際に、Cloud9を利用する手順を説明していきます。

手順は多いですが、紹介する通りにおこなえば簡単です。

1.Google Chromeをダウンロードする

今回の作業はGoogle Chromeを想定しているので、お使いのパソコンにGoogle Chromeが入っていない場合は下記の順番でインストールをしてください。

Google Chromeの公式サイトから「Chromeをダウンロード」をクリックし、ダウンロードしてください。

ダウンロードしたファイルを開けば自動的にインストールされるます。

Windowsの場合はデスクトップにショートカットを、Macの場合はDockに登録をしておきましょう。

Chromeは、他のブラウザよりもプログラミングをしやすい機能が装備されています。

ぜひ、デフォルトのブラウザとして設定してみてください。

2.AWSの会員登録をする

まずは、AWS会員登録ページに移動し、会員登録をしましょう。

ですが、会員登録をする前に注意点についてお話しします。

AWS Cloud9の料金について

AWSには無料枠というものがあり、会員登録から1年間は Cloud9を無料で利用することができます。

しかし、会員登録から1年間が経過すると、AWSの無料枠の対象外となり料金が発生します。

したがって、会員登録から1年後はCloud9を利用しない、もしくは会員をやめることをお勧めします。

AWSの無料枠について詳しく知りたい方は、AWSのガイドをご覧ください。
https://docs.aws.amazon.com/ja_jp/awsaccountbilling/latest/aboutv2/billing-free-tier.html

それでは、AWS会員登録をしていきましょう。

AWSの会員登録画面

メールアドレスに関しては、後ほど会員登録に必要なメールが届くので、有効なものを入力してください。

また、アカウント名は後ほど使うので、忘れないようにして下さい。

3.連絡先情報を登録する

AWSに連絡先情報を登録しているパソコンの画面

続いて連絡先情報を入力して下さい。全て入力したら、画面最下部までスクロールして、アカウント作成をクリックして下さい。

4.クレジットカード情報を入力

AWSを利用するためには、クレジットカード/デビットカードの登録が必ず必要です。

先ほどの説明した通り、無料で利用できるので安心してください。

AWSにクレジットカード情報を登録しているパソコンの画面

5. 電話による確認

AWSで本人確認をするパソコンの画面

電話番号で認証コードを受け取る必要があるので、すぐに使える電話番号を登録しておきましょう。

お問い合わせくださいをクリックすると電話が掛かって来ます。

AWSアカウント作成の認証コードのパソコン画面

指示にしたがって、後ほど画面に表示される4つの数字を入力して下さい。

6. サポートプランの選択

AWSアカウント作成時のサポートプランを選択するパソコン画面

サポートプランはベーシックプランを選択して下さい。無料です。

7. AWSにサインインする

AWSアカウントにサインインするパソコン画面

「アマゾンウェブサービスへようこそ」とひょうじされたら、AWSの登録は終了です。

コンソールにサインインしてみましょう。

メールの確認はしなくても先に進むことができます。

8. AWSにサインインする

AWSのサインインのパソコン画面

登録時に使用したメールアドレスを入力してください。

9. パスワードを入力してAWSにサインイン

AWSのサインインのパソコン画面

パスワードを入力すると、AWSサービスの一覧画面へ移行します。

AWSサービスのインデックスページのパソコン画面

サインイン後、下記のような画面になれば登録は完了です。

10. リージョンの変更

リージョン(所属地域)をシンガポールに変更します。

Cloud9を利用できるリージョンは限られているので、そのための操作となります。

Cloud9を利用するためのリージョン設定パソコン画面

その後、AWSサービスの箇所にcloud9と入力して下記の動画のようになればAWS Cloud9を利用可能です。

Cloud9を利用するために、AWSを検束しているパソコン画面

ですが、下記のような画面に移動した場合は指示に従い確認をおこなって下さい。

Cluod9が利用できなかった場合のパソコン画面

11. この画面になればcloud9が使用できる状態になっています。

cloud9の利用完了している画面

Cloud9の利用準備は完了です。

Cloud9の使い方

それでは、Cloud9を使って、プログラミング環境を構築する方法を解説していきます。

environmentを作成する方法

environment、つまり、プログラミングをするための環境を構築する手順を解説します。

Cloud9でenvironmentを作成するパソコンの画面

オレンジ色のボタン、「Create environment」をクリックします。

environmentを作成していきます。全部で4ページほどまたぎます。

まず1ページ目は、environmentの名前と説明を決めます。

入力が終了したら、Next Stepを選択しましょう。

続いてのページです。

AWS Cloud9を利用する際は、AWSからサーバと呼ばれる情報をおける倉庫を借りているような状態になります。

ここでは、そのサーバー関連の設定をおこないます。

チェックは全て下の画像のように選択をしてください。

また、バージョンによってはこのあともう一枚ページ、何もせずnextstepで大丈夫です。

つぎが最後のページです。確認ページです。

下の画面のようになれば、environmentがしっかりとできています。

ダッシュボードを表示する方法

作成したenvironmentの一覧を確認する場合は下の動画のとおりです

左上のAWS Cloud9をクリックし、Go to dashbordへ

するとダッシュボードが表示されます。
※1つもenvironmentが作成されていないとenvironment作成画面に遷移します

https://tech-master.s3.amazonaws.com/uploads/curriculums//b569235070f800e3463b35d08eda0bb3.jpeg

ダッシュボードは新しくenvironmentを作ったり、environmentを切り替えたい時に表示するページです。

environmentとは、実際にコードを入力したり実行したりする場所です。

Cloud9を使う上での注意点

最後に、Cloud9を使う上での注意点を解説していきます。

いまから、Cloud9で課金が発生しないための注意点をご紹介します。

environoment数について

結論として、environmentを4つ以上作成してしまうと課金が発生します。

これは、AWSの無料枠を超える利用となってしまうためです。

したがって、利用する場合はenvironmentを3つ以下に設定しましょう。

もし、過剰に作成してしまったら、environmentを削除してみましょう。

environmentの削除法

動画をご覧ください

  1. ダッシュボードの画面で消したいenvironmentを選択
  2. Deleteをクリック
  3. Deleteを入力
  4. Deleteをクリック

これでenvironmentが削除されました。

間違って名前をつけてしまった時、environmentを作りすぎたときなどはこの方法で削除しましょう。

メニューバーをコンパクト表示する方法

意図せずに三角のアイコンをクリックしてしまうと、メニューが隠れてしまいます。

Cloud9でメニューバーを非表示にする方法

すると、マウスでのメニュー操作ができなくなってしまいます。

非表示を使う予定のない方も、戻し方を覚えておきましょう

Cloud9でメニューバーを表示させる方法

まとめ:Coud9の使い方は簡単

Cloud9を利用することで、だれでも手軽にプログラミング環境を構築することができます。

Cloud9の登録と使い方は簡単ですし、基本的な設定さえすれば、すぐにプログラムを記述することができます。

Cloud9は基本的に無料で使えますが、1年以上利用したり、環境を4つ以上利用すると課金が発生してしまいます。