【初心者向け】Cloud9とgithubを連携する方法

　今回はCloud9で作ったwebアプリをgithubに登録する方法を解説したいと思います。

　ここまで連載で作ってきた電話帳アプリphone-bookを例に解説します。

　もしgithubって何なのかよく分からない人はgitとかgithubって何なのか初心者向けに説明してみたを先に読んでみて下さい。

Cloud9でリポジトリを作成してコミットする

　まずはphone-book（webアプリのルートディレクトリ）をgitのリポジトリとして登録します。

　Cloud9のコンソールで、phone-book（webアプリのルートディレクトリ）に移動しましょう。

　カレントディレクトリをリポジトリに登録するには、git initコマンドを打つだけです。

　正しくリポジトリを作成できれば、コンソールのディレクトリ表記の後ろに(master)と表示されるはずです。

　これはブランチと言って、現在このリポジトリを操作しているユーザー名みたいなものだと思っていたらいいと思います（ホントはちょっと違うのでまた勉強してください）。

　とりあえず現在のphone-bookの状態を全てコミットしてしまいましょう。

　まずはgit add -Aコマンドで全てのファイルを選択しておきます。

　続いてコミットします。

　すると、コミットされたファイルがズラ～っと出力されるはずです。

　このリポジトリをgithub上のリモートリポジトリへとpushします。その前にリモートリポジトリ（github）を準備しましょう。

github上にリモートリポジトリを作る

　githubアカウントを持っていない人はまず作っておきましょう。https://github.com/にアクセスして下さい。

　アカウントを新規登録するには画面右上のSign upをクリックします。

　希望するユーザーネーム、メールアドレス、パスワードを入力して、Create an accountボタンをクリックします。

　無料で使う場合は、Unlimited public repositories for free.の方にチェックが入っているのを確認してContinueをクリックします。

　アンケート的な画面になると思いますが、任意なので飛ばしたい人はskip this stepをクリックします。

　英語が読める人はRead the Guideを読んだらいいと思いますが、読めない人は仕方ないのでStart a projectをクリックしましょう。

　すると、githubから認証メールが送られてくると思うので、メール本文中の認証URLをクリックして下さい。

　メール本文の認証URLをクリックすると、githubサイトへとリンクして、またこの画面が出ると思います。↓

　再度、Start a projectをクリックしましょう。

　するとリモートリポジトリの新規作成画面が開きます。

　リポジトリ名（phone-book）を入力して、Create repositoryをクリックしましょう。
※Private（非公開）を選択するには有料会員になる必要があります。

　これでphone-bookのリモートリポジトリが出来上がりました。

SSH認証を行う

　github上のリモートリポジトリ（phone-book）へ、先ほどCloud9で作ってコミットしたローカルリポジトリ（phone-book）の内容をpushします。

　pushというのはローカルリポジトリの内容を、リモートリポジトリへと移すことを言います。

　データを移す際、安全に通信できるようにSSHという通信方法を使います。SSHによるアクセスを行うには送信元を認証する必要があります。

　認証方法にはパスワード認証方式と、公開鍵認証方式とがありますが、ここでは公開鍵認証方式でやります。

　公開鍵認証方式だと、送信元が発行した公開鍵をgithubに設定するだけでOKです。しかも最初に認証作業をしてしまえば後は何もしなくていいので楽ちんです。

　まず、Cloud9で用意されている公開鍵を取得します。Cloud9のコンソールで以下のコマンドを打ちましょう。

　すると、長い長い公開鍵が表示されるので、コピーしておいてください。

※ssh-rsaというのも含めた全部が公開鍵です。

　この公開鍵をgithubに設定します。githubのSettingsを開いて下さい。

　左側のメニューの中のSSH and GPG keysをクリックします。

　New SSH keyをクリックします。

　ここで送信元の公開鍵を登録します。

　Titleは任意ですが、分かりやすいようにCloud9とかにしておきましょう。
　Keyのところに公開鍵をペーストします。
　Add SSH keyをクリックしたら完了です。

　正しく登録できたら、以下のように表示されると思います。

　これで認証作業は完了です。pushの準備は整いました。

githubにpushする

　pushするには、その送り先を指定する必要があります。

　送り先は、もちろん先程作ったphone-bookリポジトリなのですが、どうやって指定するかというと、これです。↓

　HTTPSとSSHを選択で切り替えられるようになっているのですが、そのSSHの方を選択した方（git@github.com:から始まるURL）です。
※ちなみにHTTPSの方はパスワード認証でアクセスする用です。

　このgit@github.com@〜というURLをコピーしておきましょう。ちなみにこのURLのことをSSHProtcolURLと呼びます。

　では、Cloud9のコンソールでこの送り先にpushします。git pushコマンドです。

　送り先URLと、送り先のブランチ（master）を指定しています。

　正しくpushが完了すれば、コンソールに以下のように完了した旨が表示されると思います。

　githubにデータが送られているか確かめてみましょう。githubの先程のphone-bookのページを更新してみてください。

　バッチリです！

　とりあえずこれでCloud9とgithubを連携することができました。今後、何かソースファイルを編集してそれをgithubに送ろうと思ったら、Cloud9のコンソールにて以下のコマンド操作を行うことで送ることができます。

1. git add -A
2. git commit -m “簡単な説明”
3. git push リモートリポジトリのSSHProtcolURL master

　簡単にできそうではありますが、SSHProtcolURLだけはいちいちコピーしに行ったりするのは面倒です。

　実はこれをCloud9上で登録しておくことが出来ます。コンソールで、

とやるだけです。

　登録名は何でもいいですが普通はoriginにするようです。

　これでOKです。ちなみに登録したSSHProtcolURLを確認したい場合、

で見ることができるので、確認してみて下さい。

　登録しておけば、今後pushする際は、

でOKです。