寫在前面：此文為筆者學習筆記，僅供個人複習所用。

簡介：隨著 web 開發越來越成熟，各種框架開始越發輕量好用，後端開發可以通過一些簡單的包生成前端頁面，前端開發也可以通過 node.js 這類新生代來參與後端開發。前後端開發註定會有一個交集，即最近幾年風靡各類創業公司的全棧開發。本課以 python 為例，告訴大家如何通過 python + flask + html/css/js 來進行全棧開發，還有一個簡單的實戰案例。

一、課程目標

• 瞭解前端開發基礎知識
• Python後端開發技術棧
• 掌握Python Web全棧開發技能（前端+後端）

二、web前端開發介紹

1、HTML

超文字標記語言，不是程式語言，是一套標記標籤，HTML使用標記標籤來描述網頁。

2、CSS

層疊樣式表，定義如何顯示HTML元素，可以內建於HTML檔案中，專業的做法是獨立存放。

3、JS

JavaScript，一種輕量級的高階程式語言，可插入HTML頁面，服務於網頁互動的前端程式語言。

4、HTML+CSS+JS 關係

HTML：定義了網頁有哪些元素

CSS：定義了網頁元素如何呈現

JS：定義了網頁元素如何與使用者產生互動

三、web後端開發介紹

後端開發技術棧構成

開發工具：sublime, vim, pycharm, ipython[notebook]

web框架：flask, django, web.py, web2py

資料庫：mysql, redis, mongo

資料處理：pandas, numpy, scipy, sklearn

業務框架：spark, hadoop, AWS, docker

四、web開發標準流程

1、產品分析

• 使用者需求
• 競品分析
• 市場調查

2、技術選型

• 前端技術選型
• 後端技術選型
• 資料庫
• 業務框架（大資料？流媒體？）

3、開發實現

• 前後端開發，測試
• 前後端部署
• 前後端升級
• 業務框架

4、生產上線

• 部署升級
• 峰值處理
• 成本優化
• 警報處理
  

五、Python基礎

1、概念及特點

解釋型、物件導向、動態資料型別的高階程式設計語言

語言輕量化，依賴Python包做開發，生態庫完善

2、Python的基礎資料結構

字串：str, unicode

列表：list（可變）, tuple（不可變）, set（集合，元素唯一性）

字典：dict（key-value對映，元素唯一性）

3、Python中的高階特性

迭代器

生成器

切片

4、Python中的函式式

def：自定義函式

lambda：匿名函式

functools.partial：函式封裝

functools.wraps：裝飾器

六、Python web應用程式結構

1、Python web開發框架

三者都非常好，沒有最好，只有最適合

flask：簡單，輕量，靈活性大

django：簡單，比flask重，靈活性沒有flask好，但時間長

web.py：簡單，輕量，但不會再積極維護了

2、熟悉Python flask web開發標準

目錄結構：配置，釋出，資源，日誌，測試

前端後端協作：整體釋出，分離釋出

3、Python中的技巧

彙總：http://litaotao.github.io/python-materials

常見技巧：

匿名函式

列表/字典推導式

列表/字典解析式

函式為第一公民的應用

七、總結

1、常見的前端開發框架

jQuery：一個成熟的客戶端JavaScript庫

bootstrap：優秀的CSS框架

Grunt：前端自動化工具，提高工作效率

Node.js：JavaScript也可以做後臺，前端工程師地位更上一層樓

2、前端開發技巧

Chrome開發者工具：每一位前端開發必須熟練的工具

前端工程師花在除錯上的時間遠遠大於後端工程師

八、案例

下載地址：https://github.com/litaotao/IPython-Dashboard

參考：——慕課網學習視訊之

Python全站案例初體驗