Setting up your Python project for Codespaces

はじめに

このガイドでは、Python プロジェクトを Codespaces で設定する方法を説明します。 codespace でプロジェクトを開き、テンプレートから開発コンテナ設定を追加および変更する例を紹介します。

必要な環境

GitHub.com のリポジトリに既存の Python プロジェクトがあります。プロジェクトがない場合は、https://github.com/2percentsilk/python-quickstart の例でこのチュートリアルを試すことができます。
Organization で Codespaces を有効にする必要があります。

ステップ 1: codespace でプロジェクトを開く

Under the repository name, use the Code drop-down menu, and in the Codespaces tab, click Create codespace on main.

If you don’t see this option, Codespaces isn't available for your project. See Access to Codespaces for more information.

codespace を作成すると、プロジェクトは専用のリモート VM 上に作成されます。デフォルト設定では、codespace のコンテナには、Node.js、JavaScript、Typescript、nvm、npm、yarn を含む多くの言語とランタイムがあります。また、git、wget、rsync、openssh、nano などの一般的なツールセットも含まれています。

vCPU と RAM の量を調整したり、ドットファイルを追加して環境をパーソナライズしたり、インストールされているツールやスクリプトを変更したりして、codespace をカスタマイズできます。

Codespacesはdevcontainer.jsonというファイルを使って、codespaceで作業する際に使用する開発コンテナを設定します。それぞれのリポジトリには1つ以上のdevcontainer.jsonファイルを含めて、codespaceでコードの作業をするのに必要なとおりの開発環境を提供できます。

起動時にCodespacesはdevcontainer.jsonファイルと開発コンテナの設定を構成する依存ファイルを使い、ツールやランタイムをンストールし、プロジェクトが必要とするその他のセットアップタスクを行います。詳しい情報については「開発コンテナの紹介」を参照してください。

Step 2: Add a dev container configuration to your repository from a template

The default development container, or "dev container," for GitHub Codespaces comes with the latest Python version, package managers (pip, Miniconda), and other common tools preinstalled. However, we recommend that you configure your own dev container to include all of the tools and scripts that your project needs. これにより、リポジトリ内のすべての GitHub Codespaces ユーザに対して完全に再現可能な環境を確保できます。

カスタムの開発コンテナを使うようにリポジトリをセットアップするには、1つ以上のdevcontainer.jsonファイルを作成しなければなりません。これらはVisual Studio Code内でテンプレートから追加することも、独自に書くこともできます。開発コンテナの設定に関する詳しい情報については「開発コンテナの紹介」を参照してください。

Visual Studio Codeコマンドパレットにアクセスし(Shift+Command+P (Mac) / Ctrl+Shift+P (Windows/Linux))、 "dev container"と入力し始めてください。 Codespaces: Add Development Container Configuration Files...（Codespaces: 開発コンテナ設定ファイルを追加...）を選択してください。
この例では、[Python 3] をクリックします。追加機能が必要な場合は、Python に固有の任意のコンテナ、または Python 3 と PostgreSQL などのツールの組み合わせを選択できます。
Python の推奨バージョンをクリックします。
デフォルトのオプションを使用して、Node.js をカスタマイズに追加します。
Visual Studio Codeコマンドパレットにアクセスし(Shift + Command + P / Ctrl + Shift + P)、"rebuild"と入力し始めてください。 Codespaces: Rebuild Container（Codespaces: コンテナをリビルド）を選択してください。

開発コンテナの構造

Adding the Python dev container template adds a .devcontainer directory to the root of your project's repository with the following files:

devcontainer.json
Dockerfile

新しく追加された devcontainer.json ファイルは、サンプルの後に説明されるいくつかのプロパティを定義します。

devcontainer.json

{
    "name": "Python 3",
    "build": {
        "dockerfile": "Dockerfile",
        "context": "..",
        "args": {
            // Update 'VARIANT' to pick a Python version: 3, 3.6, 3.7, 3.8, 3.9
            "VARIANT": "3",
            // Options
            "INSTALL_NODE": "true",
            "NODE_VERSION": "lts/*"
        }
    },

    // Set *default* container specific settings.json values on container create.
    "settings": {
        "terminal.integrated.shell.linux": "/bin/bash",
        "python.pythonPath": "/usr/local/bin/python",
        "python.linting.enabled": true,
        "python.linting.pylintEnabled": true,
        "python.formatting.autopep8Path": "/usr/local/py-utils/bin/autopep8",
        "python.formatting.blackPath": "/usr/local/py-utils/bin/black",
        "python.formatting.yapfPath": "/usr/local/py-utils/bin/yapf",
        "python.linting.banditPath": "/usr/local/py-utils/bin/bandit",
        "python.linting.flake8Path": "/usr/local/py-utils/bin/flake8",
        "python.linting.mypyPath": "/usr/local/py-utils/bin/mypy",
        "python.linting.pycodestylePath": "/usr/local/py-utils/bin/pycodestyle",
        "python.linting.pydocstylePath": "/usr/local/py-utils/bin/pydocstyle",
        "python.linting.pylintPath": "/usr/local/py-utils/bin/pylint"
    },

    // Add the IDs of extensions you want installed when the container is created.
    "extensions": [
        "ms-python.python"
    ],

    // Use 'forwardPorts' to make a list of ports inside the container available locally.
    // "forwardPorts": [],

    // コンテナの作成後にコマンドを実行するには、「postCreateCommand」を使用します。
    // "postCreateCommand": "pip3 install --user -r requirements.txt",

    // 代わりに、connect を root としてコメントアウトします。 詳細は https://aka.ms/vscode-remote/containers/non-root を参照します。
    "remoteUser": "vscode"
}

名前 - 開発コンテナには任意の名前を付けることができます。これはデフォルトです。
ビルド - ビルドプロパティです。
- dockerfile - In the build object, dockerfile contains the path to the Dockerfile that was also added from the template.
- args
  - variant: This file only contains one build argument, which is the node variant we want to use that is passed into the Dockerfile.
設定 - これらは Visual Studio Code 設定です。
- terminal.integrated.shell.linux - While bash is the default here, you could use other terminal shells by modifying this.
機能拡張 - これらはデフォルト設定で含まれている機能拡張です。
- ms-python.python - Microsoft Python 機能拡張は、IntelliSense、linting、デバッグ、コードナビゲーション、コード形式、リファクタリング、変数エクスプローラ、テストエクスプローラなどの機能を含む、Python 言語（言語のアクティブにサポートされているすべてのバージョン 3.6 または以降）の豊富なサポートを提供します。
forwardPorts - ここにリストされているポートはすべて自動的に転送されます。 For more information, see "Forwarding ports in your codespace."
postCreateCommand - Use this to run commands that aren't defined in the Dockerfile, like pip3 install -r requirements, after your codespace is created.
remoteUser - デフォルト設定では、vscode ユーザとして実行していますが、オプションでこれを root に設定できます。

Dockerfile

# [Choice] Python バージョン: 3, 3.9, 3.8, 3.7, 3.6
ARG VARIANT="3"
FROM mcr.microsoft.com/vscode/devcontainers/python:0-${VARIANT}

# [Option] Node.js をインストールします
ARG INSTALL_NODE="true"
ARG NODE_VERSION="lts/*"
RUN if [ "${INSTALL_NODE}" = "true" ]; then su vscode -c "umask 0002 && . /usr/local/share/nvm/nvm.sh && nvm install ${NODE_VERSION} 2>&1"; fi

# [Optional] pip の要件をめったに変更しない場合は、このセクションのコメントを解除して、画像に追加します。
# COPY requirements.txt /tmp/pip-tmp/
# RUN pip3 --disable-pip-version-check --no-cache-dir install -r /tmp/pip-tmp/requirements.txt \
#    && rm -rf /tmp/pip-tmp

# [Optional] このセクションのコメントを解除して追加の OS パッケージをインストールします。
# RUN apt-get update && export DEBIAN_FRONTEND=noninteractive \
#     && apt-get -y install --no-install-recommends <your-package-list-here>

# [Optional] この行のコメントを解除してグローバルノードパッケージをインストールします。
# RUN su vscode -c "source /usr/local/share/nvm/nvm.sh && npm install -g <your-package-here>" 2>&1

Dockerfile を使用して、コンテナレイヤーを追加し、コンテナに含める OS パッケージ、ノードバージョン、またはグローバルパッケージを指定できます。

ステップ 3: devcontainer.json ファイルを変更する

With your dev container configuration added and a basic understanding of what everything does, you can now make changes to customize your environment further. この例では、コードスペースの起動時に拡張機能とプロジェクトの依存関係をインストールするためのプロパティを追加します。

Explorer で .devcontainer フォルダを展開し、ツリーから devcontainer.json ファイルを選択して開きます。

devcontainer.json ファイルの extensions リストを更新し、プロジェクトでの作業に役立ついくつかの機能拡張を追加します。

JSON

"extensions": [
        "ms-python.python",
        "cstrap.flask-snippets",
        "streetsidesoftware.code-spell-checker"
    ],

postCreateCommand のコメントを解除して、Codespaces の設定プロセスの一部として要件を自動インストールします。

JSON

// コンテナの作成後にコマンドを実行するには、「postCreateCommand」を使用します。
"postCreateCommand": "pip3 install --user -r requirements.txt",

Visual Studio Codeコマンドパレットにアクセスし(Shift + Command + P / Ctrl + Shift + P)、"rebuild"と入力し始めてください。 Codespaces: Rebuild Container（Codespaces: コンテナをリビルド）を選択してください。

リポジトリに変更をコミットする前に、codespace 内でリビルドすることにより期待どおりに変更が動作します。何らかの失敗があった場合、コンテナの調整を継続するためにリビルドできるリカバリコンテナを備えた codespace に配置されます。
Code Spell Checker と Flask Snippet 機能拡張がインストールされていることを確認して、変更が正常に適用されたことを確認します。

Step 4: アプリケーションを実行する

前のセクションでは、postCreateCommand を使用して pip3 を介してパッケージのセットをインストールしました。依存関係がインストールされたら、アプリケーションを実行できます。

F5 キーを押すか、codespace ターミナルで python -m flask run と入力してアプリケーションを実行します。
プロジェクトが開始されると、プロジェクトが使用するポートに接続するためのプロンプトが表示されたトーストが右下隅に表示されます。

ステップ 5: 変更をコミットする

新しいコードであれ、設定の変更であれ、codespaceに変更を加えたら、その変更をコミットしたくなるでしょう。リポジトリに変更をコミットすれば、このリポジトリからcodespaceを作成する他の人が、同じ設定になることを保証できます。これはまた、VS Code機能拡張の追加など、あなたが行うすべてのカスタマイズが、すべてのユーザに対して現れるようになるということでもあります。

詳しい情報については「codespaceでのソースコントロールの利用」を参照してください。

次のステップ

これで、Codespaces で Python プロジェクトの開発を始める準備ができました。より高度なシナリオ向けの追加のリソースは次のとおりです。