目錄
生鮮超市（十） 生鮮超市（十一） 生鮮超市（十二） 生鮮超市（十三）
代碼下載
教程
學習自慕課網-前端vue結合后端DjangoFramework的在線生鮮超市
一、項目介紹
1.1.掌握的技術
- Vue + Django Rest Framework 前后端分離技術
- 徹底玩轉restful api 開發流程
- Django Rest Framework 的功能實現和核心源碼分析
- Sentry 完成線上系統的錯誤日志的監控和告警
- 第三方登錄和支付寶支付的集成
- 本地調試遠程服務器代碼的技巧
1.2.系統構成
- vue前端項目
- django rest framework 系統實現前台功能
- xadmin后台管理系統
vue部分:
- API 接口
- Vue 組件 與api的交互
- vue的項目組織結構分析
Django Rest Framework 技能
-
通用view實現 rest api接口
- apiview方式實現api
- genericView方式實現api接口
- Viewset和router方式實現api接口和url配置
- Django_filter searchFilter OrderFilter 分頁
- 通用mixin
-
權限和認證；
- Authentication用戶認證設置
- 動態設置permission、authentication
- Validators實現字段驗證
-
序列化和表單驗證
- Serializer
- ModelSerializer
- 動態設置Serializer
-
支付登錄注冊
- json web token 實現登錄
- 手機注冊
- 支付寶支付
- 第三方登錄
-
進階開發
- Django rest framework 部分核心源碼解讀
- 文檔自動化管理
- django rest framework的緩存
- throttling 對用戶和ip進行限速
1.3.開發中常見的問題
- 本地系統不能重現的bug
- api接口出錯不能及時的發現或難以找到錯誤棧
- api文檔管理問題，html markdown
- 大量的url配置造成url配置越來越多難以維護
- 接口不及時去更新文檔，對方不知道如何去測試接口，但寫文檔會花費大量的時間去維護.
- 為了防止爬蟲，我們需要針對api的訪問頻率進行限制，比如一分鍾，一小時，或者一天用戶的訪問頻率限制問題。
- 某些頁面將數據放入緩存，加速某些api的訪問速度
1.4.開發中常見問題解決方案
- 通過介紹pycharm 的遠程服務器代碼調試技巧讓大家不僅可以調試支付，第三方登錄，還可以遠程服務器代碼來重現服務器上的bug
- 通過docker 搭建 sentry 來體驗錯誤日志監控系統，讓我們不僅可以得到線上的錯誤棧還能及時在發生系統錯誤時收到郵件通知。
- 通過drf的文檔自動化管理以及url的注冊管理功能會讓我們省去寫文檔的時間
- django rest framework 的文檔管理功能不僅可以讓我們省去寫文檔的時間，還能直接在文檔里面測試接口，自動生成js接口代碼，shell測試代碼和python測試代碼
- django rest framework 提供的throttle 對於api進行訪問頻率的限制
- 引入第三方框架來設置某些api的緩存
1.5.django進階知識點
- django mirgrations原理
- django 信號量
- django從請求到響應的完整過程
- 獨立使用django的model
1.6.vue知識點
- vue技術選型分析
- API后端數據填充到Vue組件模板
- Vue代碼結構分析
1.7.章節安排
- 項目介紹以及開發環境的搭建
- 設計數據庫以及導入原始數據
- restful api基礎以及vue項目結構介紹
- 商品列表頁功能
- 商品類別功能
- 手機注冊和用戶登錄
- 商品詳情頁和收藏功能
- 個人中心功能
- 購物車、訂單和支付寶支付功能
- 首頁，商品相關數量，緩存，訪問限速功能
- 第三方登錄(微博 qq 微信)
- sentry系統錯誤日志監控
1.8.技術儲備要求
- django基礎知識
- 熟練掌握python語法
- 了解vue & mysql基礎
1.9.系統功能
- 分類 - 子分類 搜索 熱搜詞 購物車簡要展示
- 新品 分類展示， 大類的推薦商品。
- 賬戶密碼登錄(json web token)。微博登錄，輸入賬戶跳轉回首頁。
- 注冊，手機號碼注冊，錯誤提示。倒計時功能，服務器端手機號碼發送頻次限制。
- 商品大類，導航欄。篩選，排序。富文本。
- 商品 收藏 加入購物車 結算，移出購物車
- 留言 支付寶支付，掃碼支付。跳回商戶頁面。
- 訂單詳情，收貨地址
- 個人信息，收藏商品，我的收藏。
- 留言，上傳文件。提交，刪除留言
- 快速瀏覽。頁面的緩存
- 訪問速度限制 & 接口文檔 測試交互
- 出錯處理: sentry基於drf。打印錯誤棧，當前請求用戶。郵件通知
二、環境搭建
2.1.虛擬環境搭建
（1）環境變量設置
- 桌面新建文件夾Envs
- 新建環境變量：以后創建虛擬環境會自動保存到這個路徑
（2）安裝
pip install virtualenv pip install virtualenvwrapper-win mkvirtualenv DjangoProject #創建虛擬環境 workon #查看有哪些虛擬環境 workon DjangoProject #進入創建的虛擬環境 deactivate.bat #退出虛擬環境
activate.bat #激活虛擬環境
2.2.Vue環境搭建
（1）node.js
https://nodejs.org/en/
（2）cnpm
npm install -g cnpm --registry=https://registry.npm.taobao.org
（3）安裝依賴
cnpm install
（4）運行
cnpm run dev