次の方法で共有


クイック スタート: GitHub Copilot for Azure Preview を使用してアプリケーションをビルドしてデプロイする

このクイックスタートでは、GitHub Copilot for Azure Preview を使用して、Azure に新しい Web サイトを作成してデプロイする方法について説明します。 これは、GitHub Copilot for Azure を開発とデプロイのワークフローに統合する 1 つの方法を示しています。

前提条件

完全なセットアップ手順については、 Get の開始 に関する記事を参照してください。 次の項目があることを確認します。

  • GitHub Copilot アカウント。
  • Visual Studio Code 用の GitHub Copilot Chat 拡張機能。
  • Visual Studio Code 用の GitHub Copilot for Azure Preview 拡張機能。
  • Azure サブスクリプション。 お持ちでない場合は、GitHub Copilot for Azure が役立ちます。

GitHub Copilot for Azure Preview を使用して Web サイトを作成してデプロイする

  1. GitHub リポジトリのローカル クローンを作成できる新しいフォルダーをローカル コンピューターに作成します。

  2. Visual Studio Code で、[表示]>[ターミナル] の順に選択します。 ターミナル ウィンドウで、新しいフォルダーに移動します。

  3. タイトル バーで、 Open Chat アイコン (GitHub Copilot ロゴ) を選択して、セカンダリ サイド バーのチャット ウィンドウを開きます。

    GitHub Copilot チャット ウィンドウを示すスクリーンショット。

    新しいチャット セッションを開始するには、ウィンドウのタイトル バーのプラス アイコン (+) を選択します。

    重要

    予期しない結果が得られる場合は、新しいチャット セッションの使用を再開します。

  4. ウィンドウの下部にあるチャット テキスト ボックスに、 @azure後に次のプロンプトを入力します。 次に、 Send (紙飛行機アイコン) を選択するか、キーボードの Enter キーを押します。

    Could you help me create and deploy a simple Flask website by using an azd template?
    

    しばらくすると、GitHub Copilot for Azure では、使用する azd テンプレートが提案される可能性があります。

    重要

    GitHub Copilot に従って Azure の手順を実行する前に、Azure アカウントに対する認証が必要になる場合があります。 認証の手順に従って続行します。

    次の例のような応答が表示される場合があります。

    GitHub Copilot for Azure からの応答と、テンプレートを使用して Azure で Web サイトを作成する手順を示すスクリーンショット。

    重要

    応答の正確な表現は、大規模な言語モデルで応答が生成されるため、Azure の回答に対する GitHub Copilot のたびに異なります。

  5. 答えがコードフェンスの azd init で始まるコマンドを提供する場合は、コードフェンスをポイントして小さなポップアップアクションメニューを表示します。

    Visual Studio Code ターミナルにコード フェンスコマンドを挿入するオプションを含むポップアップ メニューを示すスクリーンショット。

    [ターミナルに挿入 を選択して コマンドをターミナルに挿入します。

    コード フェンスコマンドを挿入した後の Visual Studio Code ターミナルを示すスクリーンショット。

  6. azd init コマンドを実行する前に、ローカル コンピューターと Azure サブスクリプションに対する影響について質問がある場合があります。

    次のプロンプトを使用します。

    @azure Before I execute azd init, what does it do?
    

    次のスクリーンショットのような応答が表示される場合があります。

    初期化コマンドの動作の説明を含む GitHub Copilot for Azure からの応答を示すスクリーンショット。

  7. azd テンプレートの詳細については、次のプロンプトを使用します。

    @azure What resources are created with this template?
    

    次のスクリーンショットのような応答が表示される場合があります。

    提案されたテンプレートによって作成されたリソースの説明と共に、GitHub Copilot for Azure からの応答を示すスクリーンショット。

  8. テンプレートで使用されるサービスについて、次のようなプロンプトで質問します。

    @azure What is the purpose of a virtual network?
    

    次のスクリーンショットのような応答が表示される場合があります。

    GitHub Copilot for Azure からの応答と、仮想ネットワークの説明を示すスクリーンショット。

  9. 問題がなければ、ターミナルで azd init コマンドを実行します。 プロンプトに応答します。 プロンプトの回答が不明な場合は、GitHub Copilot に Azure に問い合わせてください。

  10. 新しいプロジェクトが初期化されたら、 azd up を使用してアプリケーションをサブスクリプションにデプロイします。 ターミナルで、元のプロンプトの応答の指示に従ってコマンドを実行します。

    azd up
    
  11. azd up コマンドは、サブスクリプション、リソースをデプロイする場所などの情報を求めます。

    回答方法がわからない場合は、GitHub Copilot に Azure のヘルプを依頼してください。 たとえば、次の質問をします。

    @azure azd up is asking me what location I want to deploy the website into. How should I respond?
    

    次のスクリーンショットのような応答が表示される場合があります。

    GitHub Copilot for Azure からの応答と、Azure の場所とその選択方法を説明する回答を示すスクリーンショット。

  12. 引き続き、 azd upからのプロンプトに応答します。 必要に応じて、GitHub Copilot に Azure の質問をします。

    デプロイする azd テンプレートと選択した場所によっては、テンプレートのデプロイに 20 分から 40 分以上かかる場合があります。

  13. azd upエラーが発生した場合は、GitHub Copilot for Azure にエラーとその解決方法を尋ねます。

ヒント

最後のターミナル コマンドの結果を簡単に添付するには、チャット ウィンドウの左下にあるクリップ アイコンを使用します。 GitHub Copilot for Azure は、クリップを介してコピーパスまたはアタッチされていない限り、ターミナル コマンドの結果を認識しません。

  1. デプロイが成功すると、Web ブラウザーで新しい Web サイトに移動できるようになります。 Azure portal を使用して、作成したリソースを表示します。

リソースをクリーンアップする

GitHub Copilot に対して、前の手順で作成したすべてのリソースを削除する方法を確認できます。

@azure How do I undeploy this website?

次のスクリーンショットのような応答が表示される場合があります。

GitHub Copilot for Azure からの応答と、Web サイトのデプロイを解除する手順を示すスクリーンショット。

azd downを使用して、Web サイトと、Azure サブスクリプションにデプロイしたすべてのリソースを削除します。