遵循企業項目開發流程，展現Web前端項目設計與開發環節。

融合多種教學方法，面向零基礎的讀者提供工作手冊式教材。

融入課程思政元素，配套教學資源豐富。

前　　言

在“互聯網+”時代，Web前端開發技術是一個不可或缺的技術領域，它主要是通過HTML+CSS+JavaScript技術創建Web頁面，進而實現互聯網產品的用戶界面交互功能。隨著互聯網業務不斷拓展，業內競爭不斷加劇，企業對Web前端開發技術人員的需求量越來越大，Web開發人員在業內的地位迅速提高。

本書講述了兩個Web前端項目—“黨史學習教育網”開發和“官堰村振興網”開發，采用情景教學法+項目教學法+任務教學法來組織教學內容并實現教學目標。本書遵循由淺入深的認知規律，每個項目各安排8個任務，讀者可身臨其境般地在學中做、在做中學，既掌握Web前端項目的完整開發流程，又掌握Web前端開發人員所需具備的必要知識和技能，為今后的技術深造打下堅實的基礎。

本書特點

（1）遵循企業項目開發流程，展現Web前端項目的設計與開發環節。

本書以企業真實的開發流程—需求分析→原型設計→編程階段→數據交互→軟件測試為基礎，為讀者展示一個項目從“0”到“1”的開發過程。

（2）融合多種教學方法，面向零基礎的讀者提供工作手冊式教材。

本書區別于傳統編程書籍，是一本工作手冊式新型教材，由學校教師與企業工程師合作編寫。全書側重于“學中做，做中學”，采用情景教學法+項目教學法+任務教學法，注重調動讀者的興趣，使其在實踐過程中掌握相關的知識和技能，逐步增強自信，最終形成自主學習的意識和途徑，獲得項目開發的經驗和成就感。

（3）內容豐富—Web全棧式內容。

本書不僅講解了如何展開Web前端項目的開發工作，而且講解了如何搭建Web服務器環境，如何通過PHP語言實現后端數據處理，將數據存儲在MySQL數據庫中，同時還介紹了Web后端開發的相關知識。

（4）融入課程思政元素，配套教學資源豐富。

本書中的兩個項目案例—“黨史學習教育網”開發和“官堰村振興網”開發融合了課程思政元素，有助于教師通過課堂教學加強大學生思想政治教育工作。讀者掃描書中的二維碼即可觀看相應的微課視頻。

本書推薦教師采用64～96學時實施授課，學生采用“學中做，做中學”模式進行學習。

陜西國防工業職業技術學院的郭立文、劉向鋒老師與北京華晟經世信息技術有限公司的運營總監王洪波、Web開發工程師茍彥昉共同合作完成了全書的設計與撰寫工作，郭立文與王洪波任主編，茍彥昉與劉向鋒任副主編。其中，項目一的任務1至任務8由郭立文負責編寫，項目二的任務1和任務2由王洪波負責編寫，項目二的任務3、任務4和任務8由茍彥昉負責編寫，項目二的任務5至任務7由劉向鋒負責編寫。全書由郭立文與茍彥昉統稿，由陜西國防工業職業技術學院的何杰惠老師主審。

特別感謝茍彥昉工程師，他承擔了項目案例設計、代碼編寫及調試、編輯與排版、線上配套資源建設等大量工作。另外還要感謝陜西國防工業職業技術學院的劉帆凱、劉茹、郭柏良、趙金泉、高家輝、康旭洋、于天亮、陳一凡、肖宇輝等同學，他們協助老師完成了素材收集和處理等工作。

由于時間倉促且編者水平有限，書中難免有錯漏之處，懇請讀者批評指正。

編　者

2021年9月

前言
項目一　“黨史學習教育網”開發
單元一　項目準備階段 2
任務1　“黨史學習教育網”需求分析 2
任務2　“黨史學習教育網”原型設計 8
單元二　模塊開發階段 17
任務3　“黨史學習教育網”首頁制作 17
任務4　構建注冊登錄模塊 44
任務5　“黨史學習教育網”功能完善 60
單元三　數據交互階段 84
任務6　搭建Web服務器環境 84
任務7　“黨史學習教育網”數據靈動 99
單元四　測試階段 108
任務8　“黨史學習教育網”運行測試 108
項目二　“官堰村振興網”開發
單元一　項目準備階段 115
任務1　“官堰村振興網”需求分析 115
任務2　“官堰村振興網”原型設計 121
單元二　模塊開發階段 128
任務3　“官堰村振興網”首頁制作 128
任務4　“官堰村振興網”文化振興頁面制作 151
任務5　“官堰村振興網”產業振興頁面制作 173
任務6　“官堰村振興網”生態振興頁面制作 193
單元三　數據交互階段 210
任務7　“官堰村振興網”交互功能 210
單元四　測試階段 231
任務8　“官堰村振興網”運行測試 231
參考文獻 235

1. 英語大爆炸：跟趣味情景劇學口語（微課版） [秦然　編著]
2. 機械工程制圖任務跟蹤訓練 [主編 王瑞清 趙金考 周彥云 ]
3. 機械工程制圖 [主編 覃國萍 劉百順 禹晨]
4. 平面設計與制作項目化教程 [主編　李晨]
5. 后期影像剪輯技術 [主編　郭建偉]
6. 人工智能概論（第二版） [主編　任云暉　丁紅　徐迎春 ]
7. 信息時代美育之道 [主編　劉宏宇　黎婭]
8. 數字媒體交互設計項目式教程（微課版） [主編　蘇陸]
9. 動畫運動規律項目實例解析（微課版） [孫珊珊　袁維坤]
10. 自然語言處理 [主編　馮建周]
11. 新媒體內容創作實務（微課版） [主編　覃思源]
12. 人工智能基礎 [主編 余平 張春陽]
13. 人工智能導論 [主編 王飛 潘立武]
14. Amazing！兒童英語自然拼讀分級教材（全8冊） [王玲　編著]
15. Spark大數據處理技術 [主編　劉仁山　周洪翠　莊新妍]
16. 毫無PS痕跡—你的第一本Photoshop書（第二版） [趙鵬 著]
17. 電視新聞制作（活頁式） [主編 王曉翠 劉傳琳]
18. C語言同步案例習題精解 [主編 肖朝暉]
19. Python程序設計 [李國燕 王新強 劉佳 等編著]
20. 高等數學（下冊） [秦紅兵]
21. 智慧畜牧業技術 [主編 連衛民 張志明 王輝]
22. Python程序設計項目化教程（活頁式） [主編　盧鳳偉]
23. 人工智能算法與實踐 [主編　梁琨　張翼英]
24. 網頁設計與制作 [主編 王瀟 章明珠]
25. Python辦公自動化—玩轉Excel [郝春吉 劉智楊 周永福 黃 詮]
26. 人工智能概論（第二版） [張廣淵　周風余　朱振方　著]
27. Web安全基礎及項目實踐 [主編 鄭麗 安厚霖 崔俊鵬]
28. 電路與電子技術Ⅲ——模擬電子技術 [主編 劉峰]
29. 線性代數 [主編 惠小健 王震 盧鴻艷]
30. 信息安全技術基礎（第二版） [主編 張浩軍 陳莉 王峰]