MonacaクラウドとGitHub連携方法
MonacaクラウドとGitHubがついに連携しました。多数のご要望を頂いていた機能だけに、従来の開発にGitHubをご利用いただいている方には簡単に使いこなせると思いますが、GitHubアカウントでのMonacaへのシングルサインオンや、クローン、コミットやプッシュなど、MonacaクラウドIDE上のプロジェクトをGit管理ができるようになりましたので、画面を見ながら説明します 。
1.MonacaとGitHubの連携設定
Monacaダッシュボード画面からアカウント情報を選択すると「GitHub連携」メニューが追加されています。こちらを押下し、GitHub連携設定に進んでください。
このような、GitHubアカウント連携の設定画面に遷移しますので、「連携する」ボタンを押下してください。
ログインしたGitHubアカウントにMonacaとの連携を許可しましょう。
「Authorize applicatioin(Monacaアプリケーションを承認する)」ボタンを押下して、MonacaとGitHub連携初期設定が完了します。
※なお、先に個別アカウントにのみ承認をしてしまって、あとからOrganizationに対して承認を行いたい場合は、一度MonacaとのGitHub連携を解除し、再度連携設定を最初から行い、本画面にてOrganizationからMonacaを承認する必要がありますのでご注意ください。
2.Monacaプロジェクトとリポジトリの紐づけ
次に、Monacaプロジェクトソースを連携しているGitHubアカウントへアップロードしましょう。もし連携したGitHubアカウント上に空のリポジトリが存在しない場合は、新規リポジトリを作成するようメッセージが表示されます。
「空のリポジトリを作成する」ボタンを押下してください。
すると、下記のような新規リポジトリを作成画面を遷移します。
なおプライベートリポジトリをご利用いただく場合は、有料となります。
さて、MonacaのプロジェクトIDEに戻ってください。
再度バージョン管理メニューから管理項目を選択すると、空のリポジトリが存在する場合はリポジトリ名称選択・通知などに使うメールアドレス選択が求められます。Organization(組織やチーム用リポジトリの場合は、コミット名の入力が追加されます。
入力が終わったら「設定する」ボタンを押下してください。
全てのコードがGitHubへアップロードされるまで、少し間があります。すべてのコードがアップロードされ、Monacaとの紐づけが完了すると、下記の画面が表示されます。
このように、GitHub上にもソースコードが管理されていることが確認できるでしょう。
3.コミット&プッシュ
それではコードを修正してリポジトリへのコミットを試してみましょう。バージョン管理メニューからコミットを選択してください。修正されたファイルの一覧が表示されますので、コミットしたいファイルを選択し、「コミット」ボタンを押下してください。
ソースコードの修正差分をご覧いただきたい場合は、バージョン管理メニューからコードのコミット履歴を選択してください。リモート上のコミット履歴も閲覧できます。
開発を進めコミットされたコードを、リモートのGitHubにあるリポジトリにプッシュするには、上部メニューからプッシュを選択してください。
このようにしてGitHub連携をおこない、MonacaIDE上にて開発しているコードを管理することが出来るようになりました。
4.GitHubアカウントを使ったログイン
ひとたびMonacaとGitHubの連携設定ができましたら、MonacaのIDとパスワードを入力することなくログインすることができるようになります。
なお、ご利用のブラウザでGitHubへログインしていない状態だと、GitHubのログイン画面へ遷移します。
5.GitHubからのソースコードインポート
プロジェクト新規作成時に、GitHubリポジトリからMonacaプロジェクトのソースコードをインポートすることが出来るようになりました。チームで開発する場合は、OrganizationとしてGitHubにて設定したアカウントと紐づけを行っておくと、インポートをしたいリポジトリ選択欄にOrganizationのリポジトリも掲載されます。
なお、Organizationのリポジトリをご利用いただく場合、Monacaパーソナルプランからご利用いただくことができます。