今天回顧了之前學習 EasyUI 的筆記, 覺得過去花了好多時間學習現在都沒在用好可惜, 上網查了一下 EasyUI 官網, 發現它依然健在且與時俱進, 除了原本支援的 jQuery 外, 還支援了目前主流的三大前端框架 Vue, Angular, 與 React, 參考 :
我計畫在 Mapleboard 上使用 Django + EasyUI 重新建構我的量化投資網站 (因為多年來都只用 Python, 我的 PHP 功力已嚴重退化矣), 仍然使用我熟悉的 jQuery 作為前端框架 (實話是 : 三大主流前端框架我一個也不會).
目前最新的 EasyUI for jQuery v1.11.3 版下載網址如下 :
解壓縮 zip 檔後根目錄下有網站必要的兩個 js 檔 : jquery.min.js 與 jquery.easyui.min.js, 主題資料夾 themes, 多語系資料夾 locale, 外掛資料夾 plug-in, 以及展示資料夾 demo 等 :
新版 EasyUI 引進了許多新元件與新功能, 教學文件與展示網站參考 :
我在 2014~2017 年間曾使用 EasyUI 來打造網站前端 (搭配 PHP 作為後端), 那時寫下一些筆記, 雖然有些用法可能過時了, 但基本用法還是相同的, 參考 :
之前有在 Django 上使用 EasyUI, 參考 :
另外也曾在 Google App Engine 上開發與佈署以 EasyUI 為基礎的小型 CMS 系統, 參考 :
當時能跑 Python 的網站平台不多, 我知道的大概只有 GAE 與 Heroku, 而且只能用 Python 2.7 (GAE 其實就是谷歌雲端客製化的 Django 1.x).
前陣子完成 Mapleboard 的 serverless 建置後, 正徬徨下一步是要做甚麼. 今天複習了 EasyUI 後舊確定了, 那就是結合 EayUI 建置 Django 網站平台, 建構新版的 EasyUICMS 系統. 以前花了很多時間看教學文件後透過反覆測試學到 Know-how 後再來寫專案, 現在有 AI 幫忙, 不論是學習還是 debug 與找解決方案都能很快搞定 (難怪印度經濟的強項 IT 外包現在沒搞頭了).
以下測試都在 LG Gram 筆電上進行, 完成後再佈署至 Mapleboard.
1. 建立 Django 專案 :
先檢查 Django 版本 :
D:\django>python -m django --version
4.2.4
建立一個名為 easyuicms 的專案 :
D:\django>django-admin startproject easyuicms
用 tree 檢視專案的目錄結構 :
D:\django>tree easyuicms /f
列出磁碟區 新增磁碟區 的資料夾 PATH
磁碟區序號為 1258-16B8
D:\DJANGO\EASYUICMS
│ manage.py
│
└─easyuicms
asgi.py
settings.py
urls.py
wsgi.py
__init__.py
其中 manage.py 是 Django 的管理程式, 用來管理網站組態與接收處理命令列指令.
2. 添加模版目錄 (templates) 與靜態檔案目錄 (static) :
在上層專案目錄 easyuicms 下用 mkdir 指令建立模版目錄 (templates) 與靜態檔案目錄 (static) 來存放網頁模板與圖檔等靜態檔案 :
D:\django>cd easyuicms
D:\django\easyuicms>mkdir templates
D:\django\easyuicms>mkdir static
切換至 static 目錄, 在其下建立 images, css, 與 js 放置全站之圖檔, CSS 樣式檔, 與 Javascript 檔 :
D:\django\easyuicms>cd static
D:\django\easyuicms\static>mkdir images (放圖檔)
D:\django\easyuicms\static>mkdir themes (放布景主題之 CSS 樣式檔)
D:\django\easyuicms\static>mkdir js (放 Javascript 檔)
跳回 django 目錄下用 tree 檢視目錄結構 :
D:\django\easyuicms\static>cd ..
D:\django\easyuicms>cd ..
D:\django>tree easyuicms /f
列出磁碟區 新增磁碟區 的資料夾 PATH
磁碟區序號為 1258-16B8
D:\DJANGO\EASYUICMS
│ manage.py
│
├─easyuicms
│ asgi.py
│ settings.py
│ urls.py
│ wsgi.py
│ __init__.py
│
├─static
│ ├─themes
│ ├─images
│ └─js
└─templates
3. 啟動開發伺服器 :
切換到上層專案目錄 easyuicms 下, 執行下列指令啟動開發伺服器 :
D:\django\easyuicms>python manage.py runserver
Watching for file changes with StatReloader
Performing system checks...
System check identified no issues (0 silenced).
You have 18 unapplied migration(s). Your project may not work properly until you apply the migrations for app(s): admin, auth, contenttypes, sessions.
Run 'python manage.py migrate' to apply them.
September 04, 2025 - 11:52:34
Django version 4.2.4, using settings 'easyuicms.settings'
Starting development server at http://127.0.0.1:8000/
Quit the server with CTRL-BREAK.
[04/Sep/2025 11:53:08] "GET / HTTP/1.1" 200 10664
Not Found: /favicon.ico
[04/Sep/2025 11:53:08] "GET /favicon.ico HTTP/1.1" 404 2113
上面出現 "You have 18 unapplied migration(s)" 訊息是因為尚未進行資料庫同步的緣故, 由於目前並未用到資料庫, 因此不同步也不會影響網站功能. 用瀏覽器訪問 127.0.0.1:8000 顯示 Django 預設網頁表示網站已順利運行 :
這樣便完成初步測試了.
這時再用 tree 檢視目錄結構 :
D:\django>tree easyuicms /f
列出磁碟區 新增磁碟區 的資料夾 PATH
磁碟區序號為 1258-16B8
D:\DJANGO\EASYUICMS
│ db.sqlite3
│ manage.py
│
├─easyuicms
│ │ asgi.py
│ │ settings.py
│ │ urls.py
│ │ wsgi.py
│ │ __init__.py
│ │
│ └─__pycache__
│ settings.cpython-310.pyc
│ urls.cpython-310.pyc
│ wsgi.cpython-310.pyc
│ __init__.cpython-310.pyc
│
├─static
│ ├─css
│ ├─images
│ └─js
└─templates
可見第一次啟動開發伺服器時就會自動在上層專案目錄下產生一個資料庫檔 db.sqlite3 了.
沒有留言 :
張貼留言