重點步驟

1. 為專案建立虛擬環境 virtualenv
2. 啟用虛擬環境、安裝專案所需套件
3. 在VS code安裝Django延伸套件
4. 建立新Django專案
5. 啟動伺服器，讓網站在本地電腦運作

1. 為專案建立虛擬環境 virtualenv

一台電腦裡，可能存在多個Web專案，它們需要不同的套件來運作，套件本身有多個版本，為了不讓它們彼此干擾，所以我們要為每個專案來建立虛擬環境，讓每個專案都可以獨立運作。

• $ cd /webapps/virtualenv
• $ virtualenv blogVenv

2. 啟用虛擬環境、安裝專案所需套件

Windows:

• $ blogVenv\Scripts\activate.bat
• (blogVenv)$ pip install django psycopg2
• (blogVenv)$ pip freeze

Mac OS:

• 輸入$ source blogVenv/bin/activate，啟動虛擬環境blogVenV
• (blogVenv)$ pip install django psycopg2
• 安裝完成後，可以再輸入指令$ pip freeze，確認這個虛擬環境的django是否正確被安裝

3. 在VS code安裝Django延伸套件

• 開啟VS Code

• 選擇左方延伸套件選單，輸入Django，點選安裝

  我當前安裝的版本是Django v0.20.0

4. 建立新Django專案

• 打開終端機，輸入以下指令

  • 切換路徑到~webapps/workspace
  • 輸入指令 django-admin startproject blog

• 可以看到Django專案 blog建立，我們進一步來看自動生成的檔案結構

blog/                  # 專案名稱
    blog/              # App名稱
        __init__.py    # 設定此目錄是一個Python Package
        asgi.py        # Python程式跟伺服器溝通的介面程式 (非同步)
        setting.py     # 專案的設定檔
        urls.py        # 專案的URK request格式設定檔
        wsgi.py        # Python程式跟伺服器溝通的介面程式
    manage.py          # 管理Django專案的程式

• 打開Visual Studio Code，選擇File - Add Folder to workspace
• 找到~/webapps/blog，按下Add，我們的編輯器工作環境就設定好了

5. 啟動伺服器，讓網站在本地電腦運作

• 打開終端機，輸入以下指令
  • 切換系統路徑至：~webapps/workspace/blog
• 開啟Chrome，在網址輸入localhost:8000，看到Django歡迎畫面表示成功啟動網站