チュートリアル: Visual Studio での Django Web フレームワークの概要

Django は、高速、安全、スケーラブルな Web 開発用に設計されたハイレベルの Python フレームワークです。 このチュートリアルでは、プロジェクト テンプレートのコンテキストでの Django フレームワークについて説明します。 Visual Studio には、Django ベースの Web アプリの作成を効率化するためのプロジェクト テンプレートが用意されています。

このチュートリアルでは、以下の内容を学習します。

• "空の Django Web プロジェクト" テンプレートを使用して Git リポジトリに基本的な Django プロジェクトを作成する (手順 1)。
• テンプレートを使用して、1 つのページがある Django アプリを作成し、そのページをレンダリングする (手順 2)。
• 静的ファイルを提供し、ページを追加し、テンプレート継承を使用する (手順 3)。
• Django Web プロジェクト テンプレートを使用して、複数のページがあり、応答性に優れたデザインのアプリを作成する (手順 4)。
• ユーザーを認証する (手順 5)。

前提条件

• Windows 上の Visual Studio 2022 と以下のオプション:
  • Python 開発ワークロード (インストーラーの [ワークロード] タブ)。 手順の詳細については、Visual Studio での Python サポートのインストールに関するページをご覧ください。
  • [個別のコンポーネント] タブの [コード ツール] 以下にある [Git for Windows]。

Django プロジェクト テンプレートは、Python Tools for Visual Studio の以前のバージョンにも含まれていますが、 その詳細は、このチュートリアルの説明と異なる場合があります (特に、以前のバージョンの Django フレームワークとは異なります)。

現在、Visual Studio for Mac では Python 開発はサポートされていません。 Mac および Linux では、Visual Studio Code で Python 拡張を使用します。

"Visual Studio プロジェクト" と "Django プロジェクト"

Django の用語では、"Django プロジェクト" は、複数のサイト レベル構成ファイルと、1 つ以上の "アプリ" で構成されます。完全な Web アプリケーションを作成するために、これらのアプリを Web ホストにデプロイすることができます。 Django プロジェクトには複数のアプリを含めることができ、同じアプリを複数の Django プロジェクトに含めることができます。

Visual Studio プロジェクトには、Django プロジェクトと複数のアプリを含めることができます。 このチュートリアルで単に "プロジェクト" と言う場合は、Visual Studio プロジェクトを指します。 Web アプリケーションの "Django プロジェクト" 部分を指す場合は、明示的に "Django プロジェクト" と呼びます。

この一連のチュートリアルでは、3 つの独立した Django プロジェクトを含む単一の Visual Studio ソリューションを作成します。 各プロジェクトには、単一の Django アプリが含まれます。 同じソリューション内にプロジェクトを保持することで、異なるファイル間を簡単に切り替えて比較できます。

手順 1-1: Visual Studio プロジェクトとソリューションを作成する

コマンド ラインから Django を使用する場合、通常は django-admin startproject <project_name> コマンドを実行してプロジェクトを開始します。 Visual Studio では、"空の Django Web プロジェクト" テンプレートを使用することにより、Visual Studio プロジェクトおよびソリューション内に同じ構造が提供されます。

1. Visual Studio で、[ファイル]>[新規]>[プロジェクト] を選び、"Django" を検索し、"空の Django Web プロジェクト" テンプレートを選んで、[次へ] を選びます。

   

2. 次の情報を入力し、[作成] を選択します。

   • プロジェクト名: Visual Studio プロジェクトの名前を「BasicProject」に設定します。 この名前は Django プロジェクトにも使用されます。
   • 場所: Visual Studio のソリューションとプロジェクトを作成する場所を指定します。
   • ソリューション: このコントロールは既定の [新しいソリューションの作成] オプションに設定したままにします。
   • ソリューション名: このチュートリアルでは、複数プロジェクトのコンテナーとしてのソリューションに適した LearningDjango に設定します。

手順 1-2: Git コントロールを確認し、リモート リポジトリに発行する

この手順では、Visual Studio の Git コントロールと、[チーム エクスプローラー] について理解します。 [チーム エクスプローラー] ウィンドウでは、ソース管理を操作します。

1. プロジェクトをローカルのソース管理にコミットするには、次の手順を行います。

   1. Visual Studio メイン ウィンドウの下部にある [ソース管理に追加] コマンドを選択します。
   2. 次に、[Git] オプションを選択します。
   3. これにより、[Git リポジトリの作成] ウィンドウが表示されます。ここで新しいリポジトリを作成してプッシュすることができます。

   

2. リポジトリを作成すると、下部に新しい Git コントロールのセットが表示されます。 これらのコントロールは、左から右の順に、プッシュされていないコミット数、コミットされていない変更の数、現在のブランチ、リポジトリの名前を示します。

   

3. [Git 変更] ボタンを選択します。 Visual Studio で、[チーム エクスプローラー] の [Git 変更] ページが開きます。 新しく作成されたプロジェクトは既にソース管理に自動的にコミットされているので、保留中の変更は表示されません。

   

4. Visual Studio のステータス バーで、確定されていないコミット ボタン (2 と表示された上向きの矢印) をクリックして、[チーム エクスプローラー] で [同期] ページを開きます。 [同期] ページには、ローカル リポジトリを別のリモート リポジトリに簡単に発行できるオプションが用意されています。

   

   自身のプロジェクトに必要な任意のサービスを選択できます。 このチュートリアルでは、GitHub の使用方法を示します。GitHub では、チュートリアルの完全なサンプル コードが Microsoft/python-sample-vs-learning-django リポジトリに保持されます。

5. いずれかの [発行] コントロールを選択すると、[チーム エクスプローラー] から詳細情報を要求されます。 たとえば、このチュートリアルのサンプルを発行する場合は、最初にリポジトリ自体を作成する必要があります。その場合、[リモート リポジトリにプッシュ] オプションがリポジトリの URL と共に使用されました。

   

   既存のリポジトリがない場合は、[Publish to GitHub]\(GitHub に発行\) オプションと [Azure DevOps へプッシュ] オプションを使用して、Visual Studio から直接作成できます。

6. このチュートリアルを進めるときに、Visual Studio のコントロールを定期的に使用して変更をコミットおよびプッシュする習慣を付けてください。 このチュートリアルでは、適切な時点で通知します。

ヒント

[チーム エクスプローラー] 内をすばやく移動するには、ヘッダー (上の図では "変更" または "プッシュ" と表示されています) を選択して、使用可能なページのポップアップ メニューを表示します。

質問: プロジェクトの最初からソース管理を使用する利点は何ですか?

回答: ソース管理を最初から使用すると、リモート リポジトリも使用する場合は特に、プロジェクトの定期的なオフサイト バックアップが提供されます。 ローカル ファイル システムでプロジェクトを保持する場合とは異なり、ソース管理では完全な変更履歴が提供されるので、1 つのファイルまたはプロジェクト全体を以前の状態に簡単に戻すことができます。 変更履歴は、回帰 (テストの失敗) の原因を特定するのに役立ちます。 複数の人がプロジェクトで作業している場合、ソース管理によって、上書きを管理し、競合を解決することができます。

最後に、ソース管理は、基本的にオートメーションの 1 つの形式であり、ビルド、テスト、リリース管理の自動化も可能にします。 これは、プロジェクトに DevOps を使うための最初の手順です。 使用を開始するための障壁が非常に低いため、実際、最初からソース管理を使用しない理由はありません。

オートメーションとしてのソース管理の詳細については、MSDN マガジンの記事「The Source of Truth: The Role of Repositories in DevOps」 (信頼できる情報源: DevOps でのリポジトリの役割) をご覧ください。この記事はモバイル アプリ用に書かれたものですが、Web アプリにも応用できます。

質問: Visual Studio が新しいプロジェクトを自動コミットしないようにすることはできますか?

回答: はい。 自動コミットを無効にするには、[チーム エクスプローラー] の [設定] ページに移動し、 [Git]>[グローバル設定] の順に選択し、[既定でマージ後に変更内容をコミット]というラベルの付いたオプションをオフにして、[更新] を選択します。

手順 1-3: 仮想環境を作成し、ソース管理から除外する

プロジェクトのソース管理を構成したら、プロジェクトに必要な Django パッケージを含む仮想環境を作成できることに注意してください。 その後、[チーム エクスプローラー] を使用して、環境のフォルダーをソース管理から除外できます。

1. ソリューション エクスプローラーで [Python 環境] ノードを右クリックし、[仮想環境を追加] を選択します。

   

2. [仮想環境の追加] ダイアログで [作成] を選んで既定値を受け入れます。 (必要に応じて仮想環境の名前を変更できます (サブフォルダーの名前を変更するだけです) が、env が標準規則です)。

   

3. プロンプトが表示されたら、管理者特権に同意し、パッケージが Visual Studio によってダウンロードされ、インストールされるまで数分間待ちます。 この間、数千個のファイルが多数のサブフォルダーに転送されます。 Visual Studio の [出力] ウィンドウで進行状況を確認できます。 待っている間、次の質問のセクションについて熟考してください。

4. (ステータス バーの) Visual Studio Git コントロールで、変更インジケーター (99* と表示されます) を選択します。これにより、[チーム エクスプローラー] に [変更] ページが開きます。

   仮想環境の作成によって何千もの変更が生じましたが、ユーザー (またはプロジェクトを複製している他のすべてのユーザー) は requirements.txt からいつでも環境を再作成できるので、これらのいずれもソース管理に含める必要はありません。

5. 仮想環境を除外するには、env フォルダーを右クリックし、[これらのローカル項目を無視] を選択します。

   

6. 仮想環境を除外した後、残るの変更は、プロジェクト ファイルと .gitignore に対するものだけになります。 .gitignore ファイルには、仮想環境フォルダーの追加エントリが含まれています。 ファイルをダブルクリックして差分を確認できます。

7. コミット メッセージを入力し、[すべてコミット] を選択してから、コミットをリモート リポジトリにプッシュします。

質問: 仮想環境を作成する理由は何ですか?

回答: 仮想環境は、アプリの正確な依存関係を特定する優れた方法です。 このような特定により、グローバル Python 環境内での競合が回避され、テストとコラボレーションの両方が支援されます。 長い時間をかけて、アプリを開発するときに、多くの役立つ Python パッケージを必ず取り込むことになります。 プロジェクトに固有の仮想環境にパッケージを保持することで、プロジェクトの requirements.txt ファイルを簡単に更新できます。 requirements.txt ファイルでは、ソース管理に含まれる環境が説明されています。 プロジェクトがビルド サーバー、展開サーバー、その他の開発用コンピューターなどの他のコンピューターにコピーされると、requirements.txt だけを使用して環境を簡単に作成し直すことができます (そのため、環境をソース管理する必要はありません)。 詳しくは、「仮想環境を使用する」をご覧ください。

質問: ソース管理に既にコミットされている仮想環境を削除するにはどうすればよいですか?

回答: 最初に、.gitignore ファイルを編集してフォルダーを除外します。 末尾にコメント # Python Tools for Visual Studio (PTVS) があるセクションを見つけて、/BasicProject/env などの仮想環境のフォルダーを示す新しい行を追加します (Visual Studio では、ソリューション エクスプローラーにファイルが表示されません。ファイルを直接開くには、[ファイル]>[開く]>[ファイル] の順に移動します。[チーム エクスプローラー] からファイルを開くこともできます。[設定] ページに移動し、[リポジトリ設定] を選択します。次に、[無視および属性ファイル] セクションに移動し、[.gitignore] の横にある [編集] リンクを選択します)。

次に、コマンド ウィンドウを開き、BasicProject などのフォルダーに移動します。 BasicProject フォルダーには、envなどの仮想環境フォルダーが含まれています。git rm -r env を実行します。 さらに、コマンドラインからこれらの変更をコミットするか (git commit -m 'Remove venv')、[チーム エクスプローラー] の [変更] ページからコミットします。

手順 1-4: 定型コードを確認する

プロジェクトの作成が完了したら、定型 Django プロジェクト コードを確認します (これは CLI コマンド django-admin startproject <project_name> によって生成されるコードと同じです)。

1. プロジェクトのルートには manage.py があります。これは Django コマンドライン管理ユーティリティで、Visual Studio により、プロジェクトのスタートアップ ファイルとして自動的に設定されます。 コマンドラインで python manage.py <command> [options] を使用してユーティリティを実行します。 Django の一般的なタスクの場合、Visual Studio は便利なメニュー コマンドを提供します。 ソリューション エクスプローラーでプロジェクトを右クリックし、[Python] を選択して一覧を表示します。 これらのコマンドの一部は、このチュートリアルの中で確認できます。

   

2. プロジェクトには、プロジェクトと同じ名前を持つフォルダーがあります。 これには基本的な Django プロジェクト ファイルが含まれています。

   • _init.py: このフォルダーが Python パッケージであることを Python に通知する空のファイルです。
   • settings.py: Django プロジェクトの設定が含まれており、Web アプリの開発の過程でこれらを変更します。
   • urls.py: Django プロジェクトの目次が含まれています。これらも同様に開発の過程で変更します。
   • wsgi.py: プロジェクトを処理する WSGI 互換 Web サーバーのエントリ ポイントです。 通常、このファイルは実稼働 Web サーバーのフックを提供するため、現状のままにします。

   

3. 前に示したように、Visual Studio テンプレートは Django パッケージの依存関係を指定する requirements.txt ファイルもプロジェクトに追加します。 このファイルの存在は、プロジェクトを最初に作成するときに仮想環境の作成を求めるものです。

質問: Visual Studio では、他のパッケージをインストールした後に仮想環境から requirements.txt ファイルを生成できますか?

回答: はい。 [Python 環境] ノードを展開し、仮想環境を右クリックして、[requirements.txt を生成] を選択します。 環境を変更するときにこのコマンドを定期的に使用し、その環境に依存するその他のコード変更と共に requirements.txt に対する変更をソース管理にコミットすることをお勧めします。 ビルド サーバーに継続的インテグレーションを設定する場合は、環境を変更するたびに、ファイルを生成し、変更をコミットする必要があります。

手順 1-5: 空の Django プロジェクトを実行する

1. Visual Studio で、[デバッグ]>[デバッグの開始] (F5 キー) を選択するか、ツール バーの [Web サーバー] を使用します (表示されるブラウザーは異なる可能性があります)。

   

2. サーバーの実行は、Django の組み込み開発サーバーを起動するコマンドmanage.py runserver <port> の実行を意味します。 Visual Studio に、スタートアップ ファイルがないことに関するメッセージと共に "デバッガーを開始できませんでした" と表示される場合は、ソリューション エクスプローラーで manage.py を右クリックし、[スタートアップ ファイルとして設定] を選択します。

3. サーバーを起動すると、コンソール ウィンドウが開き、サーバー ログも表示されます。 Visual Studio では、ブラウザーで自動的に http://localhost:<port> が開きます。 ただし、Django プロジェクトにはアプリがないため、Django には、これまで正常に動作していることを確認する既定のページのみが表示されます。

   

4. 完了したら、コンソール ウィンドウを閉じるか Visual Studio の [デバッグ]>[デバッグの停止] を使用してサーバーを停止します。

質問: Django は Web サーバーおよびフレームワークですか?

回答: はい、そしていいえです。 Django には、開発目的で使用される組み込みの Web サーバーがあります。 この Web サーバーは、Visual Studio でデバッグする場合など、Web アプリをローカルで実行するときに使用されます。 ただし、Web ホストに配置する場合、Django はホストの Web サーバーを代わりに使用します。 Django プロジェクトの wsgi.py モジュールは、実稼働サーバーへのフックに対処します。

質問: [デバッグ] メニュー コマンドとプロジェクトの Python サブメニュー上のサーバー コマンドの使用にはどのような違いがありますか?

回答: [デバッグ] メニュー コマンドとツール バー ボタンに加えて、プロジェクトのコンテキスト メニューの [Python]>[Run server]\(サーバーの実行\) または [Python]>[Run debug server]\(デバッグ サーバーの実行\) を使用してサーバーを起動することもできます。 どちらのコマンドも、実行中のサーバーのローカル URL (localhost:port) を表示するコンソール ウィンドウを開きます。 ただし、その URL を使用してブラウザーを手動で開く必要があり、デバッグ サーバーを実行しても、Visual Studio デバッガーは自動的に起動しません。 必要に応じて、[デバッグ]>[プロセスにアタッチ] コマンドを使用して、実行中のプロセスにデバッガーをアタッチできます。

次のステップ

現時点では、基本的な Django プロジェクトにはアプリが含まれていません。 次の手順では、アプリを作成します。 Django プロジェクトよりも Django アプリを使用することが多いため、現時点では定型ファイルについて詳しく知る必要はありません。

ビューおよびページ テンプレートを使用して Django アプリを作成する

詳しい説明

• Django プロジェクト コード: 最初の Django アプリの作成、パート 1 (docs.djangoproject.com)
• 管理ユーティリティ: django-admin と manage.py (docs.djangoproject.com)
• GitHub 上のチュートリアルのソース コード: Microsoft/python-sample-vs-learning-django