筆者以稍具 Python 程式開發、網頁程式設計經驗者為對象,撰寫此入門教學,若有錯誤疏漏之處還請多多指教。 框架(Framework)的作用是將程式的架構建好,等開發者填入需要的邏輯進去。 框架會負責在合適的時機呼叫開發者寫的程式,而不是每個人自行設計程式架構與函數,不說明很難理解。 使用相同框架的開發的程式,可以比喻為遵從相同的SOP設計。
Django (發音:jang-goh) 可以說是 Python 最著名的網頁框架(Web Framework),目標是讓複雜、以資料庫驅動的網站開發起來簡單。它注重元件的可重用性和 DRY 法則(Don't Repeat Yourself)。軟體架構採用了MVT(Model–View–Template)框架,Django 的 View 和 Template 都對應到 MVC 架構的 View,都是關於資料顯示的部分。
在 windows 10 作業系統下以系統管理員身分開啟命令提示字元cmd
之後,請依照下列指令,建立專案目錄 D:\pyTest 並設定 env 虛擬環境,然後安裝 Django 套件。
django-admin --version
使用 django-admin 來建立第一個 Django 專案 : myweb
執行 django-admin 建立 myweb 專案之後,會產生一個 myweb 專案目錄,內有 manage.py 檔案與一個同名的 myweb 套件目錄。
django-admin 的實際路徑在 env\Scripts\django-admin.exe,相同目錄下還有個 django-admin.py 檔案可將之刪除,因為自從 Django 3.1 之後就以 .exe 取代 .py 了,因此若您參考網路上某些教學用到的指令是 django-admin.py 請拿掉 .py。
此步驟旨在介紹網頁伺服器啟動後的訊息說明,了解之後可省略
以下指令可啟動內建的簡易網頁伺服器,以測試Django功能是否正常。
執行上述指令後會產生以下回應
以瀏覽器開啟 http://127.0.0.1:8000/ 將出現以下畫面,可按 Ctrl + C 終止執行。
manage.py 是 Django 提供管理專案用的命令列工具,利用它可以執行很多工作,例如同步資料庫、建立 app 等等,下達 -h 參數可得知更多的使用方式,例如:
py manage.py -h
py manage.py runserver -h
py manage.py runserver
這種啟動 Web 服務的方式,僅用於開發專案,千萬不要在正式上線的場合中使用。py manage.py runserver 8080
:question: __pycache__目錄是作什麼的呢? Ans:Python 在首次執行程式碼時,會先將原始碼在記憶體中轉成 PyCodeObject ,執行完畢後會寫回 __pycache__目錄,未來只要程式碼沒有變動,Python 直接可讀取該目錄的 *.pyc 檔案,可減少重新編譯的時間。
application 可視作為本專案建立的套件,通常會有多個 app 進行搭配,負責不同的功能。
startapp 會按照你的命名在專案目錄下建立應用程式所屬的套件目錄
本步驟旨在介紹使用 vscode 開發 django 程式的專案設定,設定完成之後可省略。
因為使用了 Python 虛擬環境,因此必須建立 vscode 的專案設定檔,告知python.exe 的路徑變更到虛擬環境下了,其步驟如下。
D:\pyTest\env\Scripts\python.exe
)另建議加入以下設定:
為了減少頻繁在命令提示字元與vscode的切換,我們可以善用 vscode 的終端機功能(terminal)。 vscode 預設的終端機是 powershell,在預設的指令執行安全性政策為 Restricted,我們必須將之修改為 RemoteSigned,才能使用本機所撰寫的腳本檔案,且不需要簽署就可以執行,但是從遠端下載的腳本就必須經由可信任的發行者簽署後才可執行,設定步驟參考如下:
專案環境設定位於管理專案的套件目錄下的 settings.py,請以 vscode 開啟本專案目錄,再透過檔案總管開啟它。
:question: vscode提示要安裝的 pylance 是什麼呢?
Django 已預設將常用的 app 設定為 INSTALLED_APPS 例如:auth(認證授權管理)、admin (管理者後台)… 等等,可依需求自行增減設定專案會用到的應用程式。 請參考第 40 行,將應用程式 myapp 設定進去。
請參考第 58 行,設定 DIRS 這個樣板目錄路徑
請參考下列行數,設定語系和時間
請設定 STATICFILES_DIRS 這個 list 以指定靜態檔案的路徑。
此步驟旨在介紹專案設定後,網頁伺服器啟動後的訊息有何不同,了解之後可省略。
更新完上述設定之後,請再啟動一次 web server。
以瀏覽器開啟 http://127.0.0.1:8000/ 會發現頁面變成中文了。
開發環境與正式環境對於靜態檔案的設定不同,請參考:https://chenuin.blogspot.com/2018/10/django-static-filescss-javascript-images.html
管理專案的套件目錄下的 urls.py,內有 urlpatterns 這個 list 負責網址與view(應用程式中函數)的對應,請呼叫 vscode 來編輯它。
新增如下圖的第 18 行以下之程式碼
更多的網址路由用法可參考:
以 vscode 編輯 myapp\views.py,定義 4 個會被 urls.py import 的函數,新增如下圖的第 1 行以下之程式碼
更多定義 view 的用法可參考:Writing views
下載靜態圖片到static\images 目錄下 https://train.csie.ntu.edu.tw/images/courses/py-django.png
在 static\css 目錄下,建立 style.css 樣式檔,內容如下:
html:5
,快速完成下列網頁內容Template 內的 {{變數}}
會透過 views.py 將變數傳送過來,{% 指令 %}
是 Template 專用語言,專為呈現顯示結果所進行的判斷/迴圈/邏輯等處理。
Template 雖然有自己的語法,可以顯示變數、有 if/for/filter 等指令,但主要是用來顯示由 View 中取得的資料,如果取得資料後還要進行複雜的處理,應設法在 View 先處理完再傳送給 Template,而不要在 Template 中進行複雜的程式邏輯。
更多定義 Template 的用法可參考:
請於命令提示字元中輸入以下指令
以瀏覽器開啟 http://127.0.0.1:8000 將出現以下畫面。
瀏覽器URL改為 http://127.0.0.1:8000/hi/peter 將出現以下畫面。
瀏覽器URL改為 http://127.0.0.1:8000/age/22 將出現以下畫面。
瀏覽器URL改為 http://127.0.0.1:8000/hello 將出現以下畫面。
瀏覽器URL改為 http://127.0.0.1:8000/admin 將出現以下畫面。
Django 框架透過 ORM(Object Relational Mapping) 技術,將資料庫、資料表及欄位等,抽象化為程式設計中的類別(Class)和屬性(Attribute),實現利用物件的概念,操作資料庫,因此必須對會使用到資料庫的應用程式進行建立資料模型的動作。
位於 myweb/settings.py 的內建 APP(admin / auth / contenttypes / sessions) ,運作時所需之資料表(預設資料庫:sqlite3),可透過以下指令產生:
使用 DB Browser for SQLite 檢視專案根目錄的 db.sqlite3,可發現多了11個資料表與15個索引。
資料模型預設是以應用程式作為對應的單位,因此請透過檔案總管以 vscode 開啟 myapp\models.py。
資料表名稱:student
欄位名稱 | 資料形態 | 資料長度 | 預設值 | 可否空值 |
---|---|---|---|---|
cName | 字串 | 20 | 不可 | |
cSex | 字串 | 2 | 'M' | 不可 |
cBirthday | 日期 | 不可 | ||
cEmail | 100 | '' | 可 | |
cPhone | 字串 | 50 | '' | 可 |
cAddr | 字串 | 255 | '' | 可 |
last_modified | 日期時間 | now | 不可 | |
created | 日期時間 | now | 不可 |
根據上表定義,在 models.py 輸入以下程式碼,類別代表資料表,變數代表欄位定義
延伸參考資料:
透過 makemigrations 命令,Django 會檢測到我們對資料模型的修改,並把這些修改的部分,儲存成一次遷移(migration)。
執行上述指令後,會在應用程式 myapp 下增加 migrations 目錄如下圖。
首次的遷移會被儲存在 myapp/migrations/0001_initial.py
裡
此步驟旨在理解 Django 的 ORM 機制,了解之後可省略
我們可以透過以下指令看到此遷移之後會產生的 SQL 敘述為何?
將上述 SQL 敘述整理為較好閱讀的格式如下:
這個 sqlmigrate 命令並沒有真正被執行,只是讓你看看 Django 會產生什麼樣的 SQL 敘述。
migrate 命令會將還沒執行過的遷移(migrations),執行實際的資料庫異動。
若使用 DB Browser for SQLite 檢視專案根目錄的 db.sqlite3,可發現多了1個 myapp_student 的資料表,且自動多了一個記錄流水編號的 id 主鍵欄位。
完成上述 ORM 設定後,Django 會自動產生可用於資料表 CRUD 的 API。
語法 | 說明 |
---|---|
資料表.objects.all() | 取得所有資料 |
資料表.objects.order_by('欄位名稱') | - 取得所有資料並依指定欄位遞增排序 |
資料表.objects.order_by('-欄位名稱') | - 取得所有資料並依指定欄位遞減排序 |
資料表.objects.get(查詢條件) | 取得一筆資料 |
請以下述指令進入 Python 的互動模式進行測試
進入後,可輸入以下>>>之後的指令,測試資料庫 API
新增 myweb\urls.py 以下第 26 與 27 行程式碼
新增 myapp\views.py 以下第 4-6 行程式碼
還有以下第 31 行開始之程式碼
render()的第3個參數 locals(),可將所有區域變數轉為字典
3.1 新增 templates\listone.html
3.2 再新增 templates\listall.html
請輸入以下指令啟動開發伺服器
打開瀏覽器,輸入網址:http://127.0.0.1:8000/getName/Janet/
,出現畫面如下:
打開瀏覽器,輸入網址:http://127.0.0.1:8000/getAll/
,出現畫面如下:
ORM 所能應用的範圍其實相當狹窄,很多問題其實都要以普通 SQL 解決,想正確理解 ORM 的使用時機,請參考:SQL 三部曲:你不需要 ORM
Django 會自動建立管理的後台,具體來說就是透過 admin 應用程式管理 db.sqlite3 內的使用者、群組與對應模型的資料表。
請輸入以下指令進行管理員帳號的建立,並依序輸入
請輸入以下指令啟動開發伺服器
打開瀏覽器,輸入網址:http://127.0.0.1:8000/admin/
,再輸入上一步驟建立的管理員帳密
登入後看到的管理頁面
再次重申,使用python manage.py runserver
來運行網頁伺服器的方式,僅適用於開發與測試之用,正式上線的服務請改用可穩定且持續的伺服器,例如 apache, Nginx,… 等。
以 vscode 開啟 myapp\admin.py,填入以下第 3 行之後的程式碼。
然後回到剛剛開啟的 admin 頁面,按下 F5 重新載入頁面,會看到增加了的應用程式模型。
按下 Students 的 +新增
儲存後,會跳到可異動資料的畫面,請試試修改與刪除一筆資料試試。
若要在 admin 的後台,一次看到多個欄位並設定欄位的過濾、搜尋與排序,則必須在 mapp\admin.py 中定義 ModelAdmin 類別,再以 list_display 變數定義想要顯示的欄位,然後透過 register 方法註冊。
以 vscode 開啟 myapp\admin.py,填入以下第 3 行之後的程式碼。
然後回到剛剛開啟的 admin 頁面,按下 F5 重新載入頁面,會看到 admin 頁面顯示了多個欄位、搜尋框以及過濾器。
通常一個網站都會規劃相同的顏色、主頁標題、主頁結尾作為母版(或稱骨架),然後讓所有的頁面繼承這個母版,就會有同樣的風格,未來只要修改母版就能快速更換網站風格。
首先設計一個簡單的網頁與樣式表作為模板繼承的參考
請留意以上7-9與17行,除了載入樣式表外,我們挖了 2 個區塊:title、main作為子網頁繼承之用。
日後子網頁只要描述以下三大區塊即可
將第 22 行 的 views.home 更改為 views.main
增加第 53 行的 main 函數
render()的第3個參數 locals(),可將所有區域變數轉為字典
更新完上述設定之後,請再啟動一次 web server。
以瀏覽器開啟 http://127.0.0.1:8000/ 會發現頁面已變成我們要的版型
新增一個內含表單的子網頁 login.html ,留意表單的傳送處為/login/
增加第 28 行的 views.login
的敘述
增加第 63 行開始的敘述,多了 login() 方法