教學課程：在Visual Studio中使用 Django Web 架構

本文是五部分教學課程系列的第一個步驟，示範如何在Visual Studio中使用 Django。 Django 是專為快速、安全且可調整的 Web 開發而設計的高階 Python 架構。 Visual Studio 提供專案範本，可讓您用來簡化 Django 型 Web 應用程式的建立。 本教學課程系列會探索Visual Studio專案範本內容中的Django架構。

在教學課程的步驟 1 中，您會瞭解如何：

  • 使用空白 Django Web 專案範本建立 Django Web 應用程式專案
  • 檢查重複使用的程式碼並執行應用程式
  • 建立 Django Web 應用程式的 Git 存放庫
  • 使用 Git 版本控制系統
  • 建立 Django Web 應用程式的虛擬環境

先決條件

  • Windows 上的 Visual Studio 2022 或更新版本，在 Visual Studio 安裝程式中選取了下列選項：

    • 在 [工作負載] 索引卷標上，選取 [Python 開發] 選項。 如需詳細資訊，請參閱 在Visual Studio中安裝 Python 支援。

    • 在 [個別元件] 索引標籤的 [程式碼工具]下，選取 [Git for Windows ] 選項。

Visual Studio 中的 Django 專案範本隨附於所有舊版的 Python Tools for Visual Studio 中。 範本詳細數據可能與本教學課程系列的描述不同，特別是針對舊版 Django Web 架構。

不支援 Visual Studio for Mac。 在 Windows、Mac 和 Linux 上，Visual Studio Code 透過現有擴充功能與 Python 搭配使用良好。

Visual Studio 專案和 Django 專案

在 Django 術語中，Django 專案 具有數個月臺層級組態檔，以及一或多個「應用程式」。若要建立完整的 Web 應用程式，您可以將這些應用程式部署至 Web 主機。 Django 專案可以包含多個應用程式，而相同的應用程式可以位於多個 Django 專案中。

Visual Studio 專案可以包含 Django 專案以及多個應用程式。 在本教學課程系列中，「專案」一詞是指Visual Studio專案。 當內容參考 Web 應用程式的「Django 專案」部分時，它會特別參考「Django 專案」。

建立 Visual Studio 專案和方案

在本教學課程系列的步驟 1 中，您會建立單一 Visual Studio 解決方案，以包含多個 Django 專案。 每個專案都包含單一 Django 應用程式。 您可以使用 Visual Studio 隨附的不同 Django 專案範本來建立專案。 藉由將專案保留在相同的方案中，您可以輕鬆地在不同的檔案之間來回切換以進行比較。

當您從命令行使用 Django 時，通常會執行 django-admin startproject <project_name> 命令來啟動專案。 在 Visual Studio 中， 空白 Django Web 專案 範本會在 Visual Studio 專案和解決方案中提供相同的結構。

請遵循此程式來建立方案和專案：

  1. 在 Visual Studio 中，選取 [ 檔案>新>專案 ]，然後搜尋 “Django”。然後，選取 [空白 Django Web 專案 ] 範本，然後選取 [ 下一步]。

    顯示如何在 Visual Studio 2022 中選取空白 Django Web 專案範本的螢幕快照。

  2. 設定新的項目與解決方案：

    1. 將 Visual Studio 項目的 名稱 設定為 BasicProject。 此名稱也用於 Django 專案。

    2. 指定 Visual Studio 位置，以儲存方案和專案。

    3. 清除 將方案與專案放在相同目錄 選項中。

    4. 將 [方案名稱 ] 設定為 LearningDjango。 此解決方案可作為本教學課程系列中多個專案的容器。

  3. 選取 ，創建。

  4. 不久之後，Visual Studio 會在專案〈BasicProject〉中偵測到 Python 套件規格檔案〈requirements.txt〉。：

    Visual Studio 中偵測到專案需求檔案之提示的螢幕快照。

    對話框指出選取的範本包含 requirements.txt 檔案，可用來建立專案的虛擬環境。

  5. 選取右側的 X，以關閉提示。 在本教學課程的稍後階段，您會建立虛擬環境，並確保來源控制系統排除這個虛擬環境。 （環境始終可以從 requirements.txt 檔案中建立。）

檢查 Git 控制件

在接下來的程序中，您將讓自己熟悉 Visual Studio 對 Git 原始檔控制的支援。

這很重要

在 Visual Studio 2019 和更新版本中，Git 版本控制體驗預設為開啟。 如果您想要深入瞭解它與 Team Explorer 的比較方式，請參閱 Git 和 Team Explorer 頁面的並存比較 。

如果您想要繼續使用舊版 Visual Studio 中的 Team Explorer ，請移至 [工具>選項>環境>預覽功能 ]，並切換 [ 新增 Git 使用者體驗] 複選框。

  1. 若要將項目認可至本機原始檔控制，請選取 [Visual Studio 主視窗中右下方的 [新增至原始檔控制]，然後選取 [Git：

    顯示如何在Visual Studio 2022中建立 Git 存放庫的螢幕快照。

    [建立 Git 存放庫] 視窗隨即開啟，您可以在其中建立並推送新的存放庫。

  2. 建立存放庫之後，Git 控件列會出現在 Visual Studio 主視窗中的右下角：

    顯示 Visual Studio 主視窗中右下角 Git 控制件的螢幕快照。

    從左到右，Git 控制列會顯示傳出/傳入提交的數目（箭號 #/#）、未提交的變更數目（鉛筆 #）、目前分支名稱，以及目前的倉庫名稱。 Git 控制項也可以在主要工具列的 [Git] 選單上取得。

  3. 在 Git 控制項列上，選取變更（鉛筆 #）以開啟 [Git Changes] 視窗。 您也可以選擇 檢視>Git 變更 （Ctrl+O，Ctrl+G）：

    Visual Studio 中 [Git 變更] 視窗的螢幕快照，其中顯示目前的認可、變更和儲藏。

    此視窗會顯示任何未認可的變更詳細數據，包括隱藏的變更。 由於您新建立的專案已自動提交到版本控制中，因此您不會看到任何擱置的變更。

  4. 在 Git 控制項列上，選取提交（箭號 #/#），然後選取「檢視所有提交」：

    這是使用 [查看所有提交] 指令，從 Git 控制欄開啟 Git 存放庫視窗的截圖。

    Git 存放庫 視窗隨即開啟。 您也可以選取 [檢視]>Git 存放庫 （Ctrl+O，Ctrl+R）：

    Visual Studio 中顯示 Git 存放庫視窗的螢幕快照。

    此視窗左窗格中顯示當前存放庫的詳細資訊，右窗格中顯示具有傳出/傳入提交的當前分支。

    若要查看檔案差異檢視，請在中央窗格中選取提交。 舊版會顯示在左側，修訂的版本會顯示在右側。 詳細數據也包含變更作者、變更認可者和認可訊息。

在您學習本教學課程系列的過程中，養成習慣定期使用 Visual Studio 中的 Git 控制項來提交和推送變更。 教學課程步驟會在適當的時間點提醒您。

從一開始就使用版本控制

從項目開頭使用原始檔控制有幾個優點。 當您從項目開頭使用原始檔控制時，特別是當您也使用遠端存放庫時，您就會定期取得專案的異地備份。 與維護本機文件系統上的專案不同，原始檔控制也提供完整的變更歷程記錄，以及將單一檔案或整個專案還原成先前狀態的簡單功能。 變更歷程記錄有助於判斷回歸的原因（測試失敗）。

如果多個人員正在處理專案，則原始檔控制很重要，因為它會管理覆寫並提供衝突解決。 原始檔控制基本上是一種自動化形式，可讓您妥善進行組建、測試和發行管理。 這是針對專案使用 Azure DevOps 的第一個步驟，而且因為進入障礙太低，所以從一開始就沒有理由不使用原始檔控制。

如需更多關於將原始碼控制作為自動化的一部分的資訊，請參閱 真相來源：DevOps 中的存放庫角色，這篇發表於 MSDN Magazine 的文章主要撰寫於行動應用程式，但同樣適用於 Web 應用程式。

防止 Visual Studio 自動認可專案

請遵循下列步驟來防止 Visual Studio 自動認可新專案：

  1. 打開 工具>選項 窗格，展開 「所有設定>」來源控制>Git 設定 」區塊。

  2. 清除勾選預設合併後提交變更 選項。

  1. 打開工具>選項對話框，展開 Source Control> 的Git 全域設定區塊。

  2. 根據預設，清除 [合併后認可變更] 選項，然後選取 [確定] [確定]。

建立虛擬環境並排除原始檔控制

設定專案的原始檔控制之後，您可以使用專案所需的必要 Django 套件來建立虛擬環境。 然後，您可以使用 [Git 變更] 視窗，將環境的資料夾排除在版本控制之外。

  1. 在 [方案總管]中，以滑鼠右鍵按兩下 [Python 環境] 節點，然後選取 [[新增環境]。

    顯示如何在 [方案總管] 中選取 [新增環境] 命令的螢幕快照。

  2. 在 [[新增環境] 對話框中，選取 [建立]，以接受預設值。 （如果您想要，您可以變更虛擬環境的名稱，這會變更其子資料夾的名稱，但 env 為標準慣例。

    顯示 [新增環境] 對話框的螢幕快照，其中包含 Learning Django 專案新環境的預設值。

  3. 如果 Visual Studio 提示您提供系統管理員許可權，請提供您的同意。 在 Visual Studio 下載並安裝套件時等候幾分鐘。 針對 Django 及其相依性，此程式可能需要在超過 100 個子資料夾中展開接近 1,000 個檔案。 您可以在 Visual Studio [輸出] 視窗中檢視進度。

  4. 在 Git 控制列上，選取未提交的變更（現在顯示 99+），以開啟 [Git 變更] 視窗：

    闡述如何在 [Git 變更] 視窗中檢視虛擬環境建立時未認可變更的螢幕截圖。

    建立虛擬環境會產生數千個變更，但您不需要將它們包含在原始檔控制中。 您或複製專案的任何其他人都可以使用 requirements.txt 檔案來重新建立環境。

  5. 若要從原始檔控制中排除虛擬環境，請在 [Git 變更] 視窗中，以滑鼠右鍵按一下 [env] 資料夾，然後選取 [忽略這些本機專案：

    顯示如何在原始檔控制變更中忽略虛擬環境的螢幕快照。

    排除虛擬環境之後，剩下的唯一變更是專案文件 （.py） 和 .gitignore 檔案，其中包含一個有關虛擬環境資料夾的新增條目。

    若要查看 .gitignore 檔案的差異檢視，請在 [Git 變更] 視窗中按兩下檔案。

  6. 在 [Git 變更] 視窗中，輸入提交訊息，例如「初始專案變更」：

    顯示如何在 [Git 變更] 視窗中編輯認可訊息和認可並推送分段認可的螢幕快照。

  7. 在 [提交] 下拉選單中，選取 [提交已暫存的變更並推送]。

您可以開啟 [Git 存放庫] 視窗，並確認目前分支中 [本機歷程記錄] 顯示的已暫存的提交。

瞭解虛擬環境的目的

虛擬環境是隔離應用程式確切相依性的絕佳方式。 這種隔離方法可避免全域 Python 環境中的衝突，並協助測試和共同作業。 隨著時間推移，當您開發應用程式時，您總是引進許多實用的 Python 套件。 藉由將套件保留在專案特定的虛擬環境中，您可以輕鬆地更新描述該環境的專案 requirements.txt 檔案，而此檔案包含在原始檔控制中。 當您將專案複製到其他計算機，包括組建伺服器、部署伺服器和其他開發計算機時，很容易重新建立環境。 您只能使用 requirements.txt 檔案來重新建立環境，這就是為什麼環境不需要在原始檔控制中的原因。 如需詳細資訊，請參閱 使用虛擬環境。

拿掉原始檔控制下的虛擬環境

您可以在將虛擬環境納入版本控制之後移除它。 請遵循下列步驟：

  1. 編輯 .gitignore 檔案以排除資料夾：

    1. 選取 [檔案]>[開啟>檔案]來開啟檔案。

      您也可以從 Team Explorer開啟檔案。 在 [設定] 頁面上，選取 [存放庫設定]。 移至 [忽略 & 屬性檔] 區段，然後選取 .gitignore旁 編輯 連結。

    2. 找出結尾處具有批注 # Python Tools for Visual Studio (PTVS)的區段。

    3. 在該區段之後，新增虛擬環境資料夾的新行，例如 /BasicProject/env。

  2. 開啟指令視窗並移至具有虛擬環境資料夾的資料夾（例如 BasicProject），例如 env。

  3. 執行 git rm -r env 命令，以移除目前在原始檔控制下的虛擬環境。

  4. 使用 git commit -m 'Remove venv' 命令提交您的變更，或從 Team Explorer的 變更 頁面提交變更。

檢查重複使用的程序代碼

在本節中，您將檢視 Visual Studio 根據您選擇的範本在 Project 檔案（.py）中建立的樣板程式碼。

備註

無論是從 Django 範本在 Visual Studio 中建立專案，還是使用 CLI 命令 django-admin startproject <project_name>產生專案，都相同。

  1. 開啟 [方案總管] ，以檢視您的方案和項目檔。 初始專案只包含兩個檔案， manage.py 和 requirements.txt：

    requirements.txt 檔案會指定 Django 套件相依性。 這個檔案的存在會在您第一次建立專案時提示您建立虛擬環境。

    manage.py 檔案是 Visual Studio 自動設定為專案啟動檔的 Django 命令行系統管理公用程式。 您可以使用 命令，在命令行 python manage.py <command> [options] 上執行公用程式。

    針對常見的 Django 工作，Visual Studio 提供方便的功能表命令。 滑鼠右鍵點擊方案總管中的項目，然後選擇Python以查看命令清單。 在本教學課程系列中，您會使用其中數個命令。

  2. 除了這兩個檔案之外，專案也有與專案同名的子資料夾。 此資料夾包含基本的 Django 項目檔：

    • __init__.py：一個空白檔案，告知 Python 此資料夾是 Python 套件。
    • settings.py：當您開發 Web 應用程式時修改的 Django 項目的設定。
    • urls.py: Django 專案的目錄文件，您可以在開發 Web 應用程式時加以修改。
    • wsgi.py：供 WSGI 相容的 Web 伺服器用來服務你的專案的進入點。 您通常會保留此檔案 as-is，因為它為生產環境的網頁伺服器提供掛鉤。

在套件安裝之後產生需求

安裝其他套件之後，Visual Studio 可以從虛擬環境產生 requirements.txt 檔案。

  • 在 [方案總管]中，展開 [Python 環境] 節點，右鍵點擊你的虛擬環境，然後選擇 [產生 requirements.txt]。

當您修改環境時，定期使用此命令是很好的作法。 將 requirements.txt 檔案的變更提交至版本控制系統，以及相依於該環境的任何其他程式碼變更。 如果您在建置伺服器上設定持續整合，您應該在修改環境時產生檔案並提交變更。

執行專案

現在您已準備好依照下列程式在 Visual Studio 中執行專案：

  1. 在 Visual Studio 中，選取 [偵錯]>[開始偵錯] （F5），或在主要工具列上選取 [網頁伺服器]（您看到的瀏覽器可能會有所不同）：

    顯示 Visual Studio 主要工具列上 Web Server 命令的螢幕快照。

  2. 任一個命令都會使用 命令 manage.py runserver <port>執行伺服器，此命令會在 Django 中啟動內建網頁伺服器。

    程式代碼會使用 Django 開發伺服器內的指定埠來啟動應用程式。

    如果 Visual Studio 顯示「啟動調試器失敗」並指出找不到啟動檔案，請在「方案總管」中以滑鼠右鍵按一下 manage.py 檔案，然後選取「設定為啟動檔案」。

  3. 當伺服器啟動時，主控台視窗隨即開啟以顯示伺服器記錄檔。 Visual Studio 會自動開啟瀏覽器至 http://localhost:<port>。 因為 Django 項目沒有應用程式，Django 只會顯示預設頁面，以確認目前的程式代碼如預期般運作。

    顯示瀏覽器視窗中 Django 專案預設檢視的螢幕快照。

  4. 完成時，請關閉主控台視窗，這會停止 Django 開發伺服器。 您也可以選擇 [偵錯]>[停止偵錯]。

使用 Django Web 伺服器和架構

Django 有內建的網頁伺服器，可用於開發目的。 當您在本機執行 Django Web 應用程式時，您會使用內建 Django Web 開發伺服器。 此案例的範例是當您在 Visual Studio 中偵錯 Django Web 應用程式時。

當您將 Django Web 應用程式部署至 Web 主機時，您會在主機上使用網頁伺服器，而不是內建 Django Web 伺服器。 Django 專案中 的 wsgi.py 模組會負責連結至生產伺服器。

比較偵錯命令與專案 Python 命令，

使用 Debug 選單命令與專案的 Python 子選單中列出的伺服器命令之間存在差異。

除了 偵錯 選單命令和工具列按鈕之外，您也可以使用 Python>[開始] 伺服器 或 Python>[啟動偵錯伺服器] 專案操作功能表上的命令來啟動伺服器。

顯示 Visual Studio [方案總管] 中所選專案的 Python 命令螢幕快照。

這兩個命令都會開啟主控台視窗，您可以在其中看到執行中伺服器的本機 URL（localhost:port）。 不過，您必須以該 URL 手動開啟瀏覽器，而且執行偵錯伺服器不會自動啟動 Visual Studio 調試程式。 如果您想要稍後再將偵錯程式附加到執行中的進程，您可以使用 偵錯>附加至進程 命令。

後續步驟

步驟 2：使用檢視和頁面範本建立 Django 應用程式

  • Last updated on