【クラウドIDE】AWS Cloud9 で Ruby 環境をつくってみた!

はじめに

この記事は 【これからプログラミング&クラウドを始める人向け】AWS Cloud9 を利用して Ruby の開発環境を作ってみる① – AWSアカウント準備編 の続きになります。

以下の項目に該当する方はぜひ最後まで読んでいただきたい内容になっています。

  • クラウドで何か環境構築をやってみたい
  • IDE 環境構築で詰まっていてプログラミング勉強が進まない
  • クラウド上に IDE 環境を作ってみたい

本記事の概要

  • 前提として AWS アカウントの作成が完了していることが必要です。
  • AWS Cloud9 のセットアップと簡単な操作説明を解説しています。
  • 本記事の内容は GUI 上での操作になります。プログラミング・クラウド初学者の方でもお気軽に体験いただけます。

AWS Cloud9 のセットアップ

  • 前回作成した IAM ユーザーを利用してコンソールに入り Cloud9 と検索し選択

https___qiita-image-store.s3.ap-northeast-1.amazonaws.com_0_321336_8754dd52-e64f-7d78-9785-8fd8c5d4e796.png

  • AWS Cloud9 のコンソールから「Create environment」を選択
    https___qiita-image-store.s3.ap-northeast-1.amazonaws.com_0_321336_9ebb8153-5406-1514-93fa-9a4ae08bc283.png
  • 環境名を入力 (説明文は任意入力なので無しでもOK)
    https___qiita-image-store.s3.ap-northeast-1.amazonaws.com_0_321336_baaacbc3-3dbd-c5b7-4ad0-ab3802ee497d.png
  • 以下図のように Configure settings を行い「Next step」を選択

https___qiita-image-store.s3.ap-northeast-1.amazonaws.com_0_321336_b413ab1a-6173-a932-45d8-b23223d7079f.png

  • 確認画面が表示され、「Create enviroment」を選択
    https___qiita-image-store.s3.ap-northeast-1.amazonaws.com_0_321336_f0cd2250-81f5-c4b8-ebe4-945ba72e4b6b.png
  • 選択後以下のような画面が表示される (今回は約2分ほどで構築が完了)

https___qiita-image-store.s3.ap-northeast-1.amazonaws.com_0_321336_8758c62f-6506-9a8c-1127-e1fe335b9416.png

  • 完了後、以下のような画面が表示される。これで環境構築は完了です。

https___qiita-image-store.s3.ap-northeast-1.amazonaws.com_0_321336_ca1b900f-6d1b-6144-d54b-397f8644fa01.png

AWS Cloud9 の画面説明

左側がファイル、右側がテキストエディタ、右下がターミナルとなります

https___qiita-image-store.s3.ap-northeast-1.amazonaws.com_0_321336_10577052-639a-0bb3-fd0c-cbb840f26f84.png

  • エディタ領域はタブ型になっています

https___qiita-image-store.s3.ap-northeast-1.amazonaws.com_0_321336_d6b07a30-87b3-fc41-5ba9-e0ce107ba4e5.png

  • これらの設定については右側の歯車アイコンで操作が可能です

https___qiita-image-store.s3.ap-northeast-1.amazonaws.com_0_321336_ba979cc1-9d68-f697-cd9b-8c692999fa86.png

  • ちなみにブラウザでの表記なので Chrome の翻訳アドオンで日本語化ができます

https___qiita-image-store.s3.ap-northeast-1.amazonaws.com_0_321336_f839d1ab-e9ad-5fb9-eb2c-bd3a9b0c001e.png

その他 Tips

  • 次回以降コンソールからアクセスした場合、「Open IDE」から構築した環境にアクセス可能です

https___qiita-image-store.s3.ap-northeast-1.amazonaws.com_0_321336_5332e812-c2e1-6519-7674-5db1cc3792d5.png

  • EC2 のコンソール画面から自動停止を待たずに環境停止(=課金停止)を行うことも可能です

https___qiita-image-store.s3.ap-northeast-1.amazonaws.com_0_321336_354adb10-8129-41e1-86d1-a1888363939c.png

Tab Size の設定

テキストファイルのタブを開いた状態で右下の「Spaces」をクリックすると「Tab Size」が変更できます
ここで Tab Size を「2」に変更することでタブキーを押したときのスペースの入力回数が設定できます

https___qiita-image-store.s3.ap-northeast-1.amazonaws.com_0_321336_5f0768c4-5429-d5ab-a075-247899758055.png

  • スペース等の不可視文字の可視化 スペースや改行に印をつける設定です。これもテキストファイルのタブを開いた状態で行います 右下の歯車キーをクリックして Show Invisibles にチェックマークをつけます

https___qiita-image-store.s3.ap-northeast-1.amazonaws.com_0_321336_9e73c01e-1c21-6e11-6e33-07281555f95a.png

まとめ

前回の記事で作成した IAM ユーザー を使用してクラウド上に IDE を構築・初期設定を行いました。
環境は数分で終えることができたので、これからプログラミングを勉強していきたい人に是非試していただきたいです。
次回以降はプログラムのバージョン管理について説明していきたいと思います。お楽しみに!