Web前端開(kāi)發(fā)項(xiàng)目化教程（微課版）

遵循企業(yè)項(xiàng)目開(kāi)發(fā)流程，展現(xiàn)Web前端項(xiàng)目設(shè)計(jì)與開(kāi)發(fā)環(huán)節(jié)。

融合多種教學(xué)方法，面向零基礎(chǔ)的讀者提供工作手冊(cè)式教材。

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

前　　言

在“互聯(lián)網(wǎng)+”時(shí)代，Web前端開(kāi)發(fā)技術(shù)是一個(gè)不可或缺的技術(shù)領(lǐng)域，它主要是通過(guò)HTML+CSS+JavaScript技術(shù)創(chuàng)建Web頁(yè)面，進(jìn)而實(shí)現(xiàn)互聯(lián)網(wǎng)產(chǎn)品的用戶界面交互功能。隨著互聯(lián)網(wǎng)業(yè)務(wù)不斷拓展，業(yè)內(nèi)競(jìng)爭(zhēng)不斷加劇，企業(yè)對(duì)Web前端開(kāi)發(fā)技術(shù)人員的需求量越來(lái)越大，Web開(kāi)發(fā)人員在業(yè)內(nèi)的地位迅速提高。

本書(shū)講述了兩個(gè)Web前端項(xiàng)目—“黨史學(xué)習(xí)教育網(wǎng)”開(kāi)發(fā)和“官堰村振興網(wǎng)”開(kāi)發(fā)，采用情景教學(xué)法+項(xiàng)目教學(xué)法+任務(wù)教學(xué)法來(lái)組織教學(xué)內(nèi)容并實(shí)現(xiàn)教學(xué)目標(biāo)。本書(shū)遵循由淺入深的認(rèn)知規(guī)律，每個(gè)項(xiàng)目各安排8個(gè)任務(wù)，讀者可身臨其境般地在學(xué)中做、在做中學(xué)，既掌握Web前端項(xiàng)目的完整開(kāi)發(fā)流程，又掌握Web前端開(kāi)發(fā)人員所需具備的必要知識(shí)和技能，為今后的技術(shù)深造打下堅(jiān)實(shí)的基礎(chǔ)。

本書(shū)特點(diǎn)

（1）遵循企業(yè)項(xiàng)目開(kāi)發(fā)流程，展現(xiàn)Web前端項(xiàng)目的設(shè)計(jì)與開(kāi)發(fā)環(huán)節(jié)。

本書(shū)以企業(yè)真實(shí)的開(kāi)發(fā)流程—需求分析→原型設(shè)計(jì)→編程階段→數(shù)據(jù)交互→軟件測(cè)試為基礎(chǔ)，為讀者展示一個(gè)項(xiàng)目從“0”到“1”的開(kāi)發(fā)過(guò)程。

（2）融合多種教學(xué)方法，面向零基礎(chǔ)的讀者提供工作手冊(cè)式教材。

本書(shū)區(qū)別于傳統(tǒng)編程書(shū)籍，是一本工作手冊(cè)式新型教材，由學(xué)校教師與企業(yè)工程師合作編寫(xiě)。全書(shū)側(cè)重于“學(xué)中做，做中學(xué)”，采用情景教學(xué)法+項(xiàng)目教學(xué)法+任務(wù)教學(xué)法，注重調(diào)動(dòng)讀者的興趣，使其在實(shí)踐過(guò)程中掌握相關(guān)的知識(shí)和技能，逐步增強(qiáng)自信，最終形成自主學(xué)習(xí)的意識(shí)和途徑，獲得項(xiàng)目開(kāi)發(fā)的經(jīng)驗(yàn)和成就感。

（3）內(nèi)容豐富—Web全棧式內(nèi)容。

本書(shū)不僅講解了如何展開(kāi)Web前端項(xiàng)目的開(kāi)發(fā)工作，而且講解了如何搭建Web服務(wù)器環(huán)境，如何通過(guò)PHP語(yǔ)言實(shí)現(xiàn)后端數(shù)據(jù)處理，將數(shù)據(jù)存儲(chǔ)在MySQL數(shù)據(jù)庫(kù)中，同時(shí)還介紹了Web后端開(kāi)發(fā)的相關(guān)知識(shí)。

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

本書(shū)中的兩個(gè)項(xiàng)目案例—“黨史學(xué)習(xí)教育網(wǎng)”開(kāi)發(fā)和“官堰村振興網(wǎng)”開(kāi)發(fā)融合了課程思政元素，有助于教師通過(guò)課堂教學(xué)加強(qiáng)大學(xué)生思想政治教育工作。讀者掃描書(shū)中的二維碼即可觀看相應(yīng)的微課視頻。

本書(shū)推薦教師采用64～96學(xué)時(shí)實(shí)施授課，學(xué)生采用“學(xué)中做，做中學(xué)”模式進(jìn)行學(xué)習(xí)。

陜西國(guó)防工業(yè)職業(yè)技術(shù)學(xué)院的郭立文、劉向鋒老師與北京華晟經(jīng)世信息技術(shù)有限公司的運(yùn)營(yíng)總監(jiān)王洪波、Web開(kāi)發(fā)工程師茍彥昉共同合作完成了全書(shū)的設(shè)計(jì)與撰寫(xiě)工作，郭立文與王洪波任主編，茍彥昉與劉向鋒任副主編。其中，項(xiàng)目一的任務(wù)1至任務(wù)8由郭立文負(fù)責(zé)編寫(xiě)，項(xiàng)目二的任務(wù)1和任務(wù)2由王洪波負(fù)責(zé)編寫(xiě)，項(xiàng)目二的任務(wù)3、任務(wù)4和任務(wù)8由茍彥昉負(fù)責(zé)編寫(xiě)，項(xiàng)目二的任務(wù)5至任務(wù)7由劉向鋒負(fù)責(zé)編寫(xiě)。全書(shū)由郭立文與茍彥昉統(tǒng)稿，由陜西國(guó)防工業(yè)職業(yè)技術(shù)學(xué)院的何杰惠老師主審。

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

由于時(shí)間倉(cāng)促且編者水平有限，書(shū)中難免有錯(cuò)漏之處，懇請(qǐng)讀者批評(píng)指正。

編　者

2021年9月

前言
項(xiàng)目一　“黨史學(xué)習(xí)教育網(wǎng)”開(kāi)發(fā)
單元一　項(xiàng)目準(zhǔn)備階段 2
任務(wù)1　“黨史學(xué)習(xí)教育網(wǎng)”需求分析 2
任務(wù)2　“黨史學(xué)習(xí)教育網(wǎng)”原型設(shè)計(jì) 8
單元二　模塊開(kāi)發(fā)階段 17
任務(wù)3　“黨史學(xué)習(xí)教育網(wǎng)”首頁(yè)制作 17
任務(wù)4　構(gòu)建注冊(cè)登錄模塊 44
任務(wù)5　“黨史學(xué)習(xí)教育網(wǎng)”功能完善 60
單元三　數(shù)據(jù)交互階段 84
任務(wù)6　搭建Web服務(wù)器環(huán)境 84
任務(wù)7　“黨史學(xué)習(xí)教育網(wǎng)”數(shù)據(jù)靈動(dòng) 99
單元四　測(cè)試階段 108
任務(wù)8　“黨史學(xué)習(xí)教育網(wǎng)”運(yùn)行測(cè)試 108
項(xiàng)目二　“官堰村振興網(wǎng)”開(kāi)發(fā)
單元一　項(xiàng)目準(zhǔn)備階段 115
任務(wù)1　“官堰村振興網(wǎng)”需求分析 115
任務(wù)2　“官堰村振興網(wǎng)”原型設(shè)計(jì) 121
單元二　模塊開(kāi)發(fā)階段 128
任務(wù)3　“官堰村振興網(wǎng)”首頁(yè)制作 128
任務(wù)4　“官堰村振興網(wǎng)”文化振興頁(yè)面制作 151
任務(wù)5　“官堰村振興網(wǎng)”產(chǎn)業(yè)振興頁(yè)面制作 173
任務(wù)6　“官堰村振興網(wǎng)”生態(tài)振興頁(yè)面制作 193
單元三　數(shù)據(jù)交互階段 210
任務(wù)7　“官堰村振興網(wǎng)”交互功能 210
單元四　測(cè)試階段 231
任務(wù)8　“官堰村振興網(wǎng)”運(yùn)行測(cè)試 231
參考文獻(xiàn) 235

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