次の方法で共有


FastAPI と Postgres を使用して GitHub Codespaces 開発環境を作成する

この記事では、 GitHub Codespaces 環境で FastAPI と Postgres を一緒に実行する方法について説明します。 Codespaces はクラウドでホストされる開発環境であり、構成可能で反復可能な開発環境を作成できます。

サンプル リポジトリは 、ブラウザー または Visual Studio Code などの統合開発環境 (IDE) と GitHub Codespaces 拡張機能で開くことができます。

または、サンプル リポジトリをローカルに複製することもできます。 Visual Studio Code でプロジェクトを開くと、Dev Containers を使用して Dev Containers を使用して実行できます。 Dev Containers では、 Docker Desktop をローカルにインストールする必要があります。 Docker がインストールされていない場合は、開発環境として GitHub Codespaces を使用してプロジェクトを実行できます。

GitHub Codespaces を使用する場合は、1 か月あたりのコア時間の空き時間が固定されていることに注意してください。 このチュートリアルを完了するのに必要なコア時間は 1 時間未満です。 詳細については、「 GitHub Codespaces の課金について」を参照してください。

このセットアップを開始点として使用し、Django や Flask などの他の Python Web フレームワークを実行するようにサンプルを変更することもできます。

Codespaces で開発環境を起動する

このチュートリアルでは、GitHub Codespaces を作成して操作するさまざまな方法の 1 つについて説明します。

  1. サンプル アプリ リポジトリの https://github.com/Azure-Samples/msdocs-fastapi-postgres-codespaceに移動します。

    サンプル リポジトリには、Postgres データベースを使用して FastAPI アプリを使用して環境を作成するために必要なすべての構成があります。 GitHub Codespaces 用の Python プロジェクトの設定の手順に従って、同様のプロジェクトを作成できます。

  2. [ コード]、[ コードスペース] タブの順に選択し、 + して新しいコードスペースを作成します。

    GitHub リポジトリからコードスペースを作成する方法を示すスクリーンショット。

  3. コンテナーのビルドが完了したら、ブラウザーの左下隅に Codespaces が表示されていることを確認し、サンプル リポジトリを確認します。

    codespace キー構成ファイルは 、devcontainer.jsonDockerfileおよびdocker-compose.ymlです。 詳細については、 GitHub Codespaces の概要を参照してください。

    ヒント

    Visual Studio Code でコードスペースを実行することもできます。 ブラウザーの左下隅にある [Codespaces] を選択するか(Ctrl + Shift + P / Ctrl + Command + P)、「Codespaces」と入力します。 次に、VS Code で開く を選択します。 また、コードスペースを停止してリポジトリに戻って GitHub Codespaces でもう一度開く場合は、VS Code またはブラウザーで開くオプションがあります。

  4. .env.devcontainer ファイルを選択し、同じ内容の .env という名前のコピーを作成します。

    .env には、データベースに接続するためにコードで使用される環境変数が含まれています。

  5. ターミナル ウィンドウがまだ開いていない場合は、コマンド パレット (Ctrl + Shift + P / Ctrl + Command + P) を開き、「ターミナル: 新しいターミナルの作成」と入力してターミナルを選択して新しいターミナルを作成します。

  6. ターミナル ウィンドウで [ポート ] タブを選択して、PostgreSQL がポート 5432 で実行されていることを確認します。

  7. ターミナル ウィンドウで、FastAPI アプリを実行します。

    uvicorn main:app --reload
    
  8. 通知を選択 ブラウザーで開きます

    通知が表示されない場合、または不在着信した場合は、PORTS に移動し、 ポート 8000 の ローカル アドレス を見つけます。 ここに記載されている URL を使用します。

  9. プレビュー URL の末尾に /docs を追加して Swagger UI を表示します。これにより、API メソッドをテストできます。

    API メソッドは、FastAPI がコードから作成する OpenAPI インターフェイスから生成されます。

    FastAPI Swagger UI を示すスクリーンショット。

  10. Swagger ページで、POST メソッドを実行してレストランを追加します。

    1. POST メソッドを展開します。

    2. [試してみる] を選択します。

    3. 要求本文を入力します。

      {
        "name": "Restaurant 1",
        "address": "Restaurant 1 address"
      }
      
    4. [ 実行] を選択して変更をコミットする

データベースに接続してデータを表示する

  1. プロジェクトの GitHub Codespace に戻り、SQLTools 拡張機能を選択し、[ ローカル データベース ] を選択して接続します。

    コンテナーの作成時に SQLTools 拡張機能をインストールする必要があります。 SQLTools 拡張機能がアクティビティ バーに表示されない場合は、コードスペースを閉じてから再度開きます。

  2. レストラン テーブルが見つかるまで [ローカル データベース] ノードを展開し、[テーブル レコードの表示] を右クリックします。

    追加したレストランが表示されます。

    Visual Studio Code で SQLTools 拡張機能を使用して Postgres ローカル データベースに接続し、テーブル レコードを表示する方法を示すスクリーンショット。

クリーンアップ

codespace の使用を停止するには、ブラウザーを閉じます。 (または、そのように開いた場合は VS Code を閉じます)。

コードスペースをもう一度使用する予定がある場合は、そのままにしておくことができます。 CPU 料金は、実行中の codespace に対してのみ発生します。 停止した codespace には、ストレージ コストのみが発生します。

コードスペースを削除する場合は、 https://github.com/codespaces に移動してコードスペースを管理します。

次のステップ