こんにちは。
今後のハンズオンのために、Azure App Service の Web App (旧 Azure WebSite) における git 利用のいくつかのパターンをメモしておきます。(既に Azure を使いこなしている方は読み飛ばしてください。)
ハンズオンの中でさまざまな形で利用しますので、具体的手順を (あとから) 確認する際などに ご参照ください。
Local 編集と Azure Web App への発行
ローカル (Sublime Text 等) でコード作成をおこない、Azure Web App (Azure WebSite) に Publish するオーソドックスな方法です。
1 人で開発をおこなっている場合や、小さなコードなどを試しに Azure Web App (Azure WebSite) に配置して動かしてみたい場合などに使えます。
Azure Portal で Azure Web App を作成したら [Set up continuous deployment] というブレード (下図) が表示されるので、これをクリックします。
表示される画面で [Choose source] を選択すると、下図のリポジトリーの選択画面が表示されるので [Local Git Repository] を選択します。
設定を完了して、[Settings] – [Properties] を選択すると、Azure Web App に Git の URL が設定されているのが確認できます。
この URL をコピーします。
この URL を使って、ローカル環境 (Sublime Text, Git Bash など) から git clone や git push をおこなえます。(Local Repository と組み合わせた開発が可能です。)
// clone from Azure Web Appgit clone https://tsmatsuz_en@tsmatsuz-test02.scm.azurewebsites.net:443/tsmatsuz-test01.git// edit using sublime, etc...//// push changes to Azure Web Appcd tsmatsuz-test01git commit -a -m "bug fix"git push -u origin master
npm や composer などを使った追加パッケージの登録など、配置で必要な作業は deploy.sh に記述しておくと良いでしょう。
既存の Repository (Github など) のソースコードの配置
Github など外部 Repository に配置済の自身のプロジェクトのソースや、オープンソースなどのソースコードをダウンロードして、Azure Web App (Azure WebSite) で使用できます。
ソースコードが大きくなってきた場合には、Github など (外部 Repository) で管理し、必要に応じ、この方法で配置すると良いでしょう。
この場合は、[Set up continuous deployment] で [External Repository] (下図) を選択し、必要な情報 (Repository の URL, Branch など) を設定すれば OK です。
なお、後述する Azure の App Service Editor を使用する場合には、App Service Editor から [Clone from a git url] (下図) をクリックして clone しても構いません。
既存のRepository (Github など) との動的連携
チームのソース管理の Repository として Github などを使用しながら、最新のソースを Azure Web App (Azure WebSite) に反映 (同期) できます。
これにより、開発に関与する他のメンバーは、Repository に commit された最新の状態 (動作) を常に Azure Web App (Azure WebSite) で確認できます。
この設定をおこなうには、上記の [Set up continuous deployment] で [Github] を選択して必要な設定をおこないます。(後述の通り Github の project に必要な設定を書き込むため、Github の認可情報の設定なども必要です。)
選択した project のソースコードが Azure Web App に反映されます。
試しに、ソースコードの変更をおこなって Github に push しなおすと、変更された内容が Azure Web App に反映されるのが確認できます。
内部では Github の Webhook という仕組みが使われています。(この設定は、project の [setting] から確認できます。)
Azure Web App におけるコード編集と Repository 連携
Azure の App Service Editor を使用すると Azure Web App (Azure WebSite) 自体をコード作成 (編集) をおこなう開発環境として利用し、Git を使って Remote Repository と連携できます。
Azure Web App でコード編集をするには「App Service Editor で PHP アプリ開発」で解説した手順で App Service Editor の Extension を有効にします。(下図参照)
App Service Editor のエディターを表示し、Navigation (左) の [Git] アイコン をクリックすると、下図の Git ツールが表示されます。[Initialize git repository] をクリックすると App Service Editor (Azure Web App) 上の Git 環境が初期化 (git init) できます。
git が有効になるとソースの変更箇所も App Service Editor でビジュアルに確認できます。
ソースの変更が完了したら commit をおこなってください。(上図の Git ツールで commit できます。)
commit が完了したら、App Service Editor の Console を表示し (Shift-Ctrl-c)、他の Repository (Github など) に push できます。
// set github repository to origingit remote add origin https://github.com/tsmatsuz/testphp.git// push source to githubgit push -u origin master
※ 変更履歴
2015/03/26 Azure WebSite から Azure Web App に名称変更
2016/07/19 Visual Studio Online (Monaco) から App Service Editor に名称変更
Categories: Uncategorized
2 replies»