JavaScript+Vue.js Web開發(fā)項(xiàng)目教程
定 價(jià)：59.8 元
叢書名：工業(yè)和信息化精品系列教材
- 作者：夏道春 姜華 李愛菊
- 出版時(shí)間：2025/8/1
- ISBN：9787115672094
- 出 版 社：人民郵電出版社
- 中圖法分類：TP393.092.2
- 頁碼：
- 紙張：膠版紙
- 版次：
- 開本：16開
隨著Web前端技術(shù)的發(fā)展，JavaScript應(yīng)用越來越廣泛，各種框架技術(shù)（如Vue.js）更新速度快，應(yīng)用廣泛。本書從JavaScript、Node.js的基礎(chǔ)知識(shí)逐步展開，進(jìn)而深入探討Vue.js，包括Vue基礎(chǔ)、組件開發(fā)、過渡與動(dòng)畫、Vite、Vue Router、Pinia以及Element Plus的應(yīng)用。全書共分為5個(gè)項(xiàng)目，每個(gè)項(xiàng)目均遵循項(xiàng)目驅(qū)動(dòng)的教學(xué)模式，通過實(shí)際項(xiàng)目中的案例來深入解析所涉及的知識(shí)點(diǎn)，確保理論與實(shí)踐緊密結(jié)合。
本書適合作為普通高校、職業(yè)高等學(xué)校相關(guān)專業(yè)網(wǎng)頁設(shè)計(jì)與制作課程的教材，也可作為網(wǎng)頁設(shè)計(jì)行業(yè)從業(yè)人員的參考讀物。
1.產(chǎn)教融合新形態(tài)教材，校企合作開發(fā)
2.項(xiàng)目-任務(wù)式為主線，大項(xiàng)目貫穿
3.從WEB前端開發(fā)崗位的技能要求出發(fā)，以企業(yè)真實(shí)項(xiàng)目案例為主導(dǎo)，融合WEB前后端技術(shù)，使讀者能夠快速進(jìn)入到WEB開發(fā)領(lǐng)域，全面熟悉WEB項(xiàng)目開發(fā)流程，打通技術(shù)壁壘
4.知識(shí)點(diǎn)講解根據(jù)項(xiàng)目完成的進(jìn)度，拆分到每個(gè)任務(wù)里面去
5.結(jié)合黨的二十大精神，將思政元素融于教材中
6.將企業(yè)的新技術(shù)、新標(biāo)準(zhǔn)、新工藝融入教材中
夏道春，副教授，信息系統(tǒng)項(xiàng)目管理師,山東科技職業(yè)學(xué)院信息工程系教師，山東省軟件技術(shù)專業(yè)省級(jí)教學(xué)團(tuán)隊(duì)骨干教師。一直從事高職軟件技術(shù)類專業(yè)課教學(xué)，講授課程包括JavaScript程序設(shè)計(jì)、Vue.js程序設(shè)計(jì)、Java程序設(shè)計(jì)等。
主編簡介：姜華，女，碩士學(xué)位，副教授，Web前端開發(fā)國家級(jí)教師教學(xué)創(chuàng)新團(tuán)隊(duì)核心骨干成員。職業(yè)教育省級(jí)在線精品課程主持人，2門省級(jí)精品課程主講教師，省級(jí)軟件技術(shù)專業(yè)資源庫子項(xiàng)目負(fù)責(zé)人，主持參與完成市廳級(jí)以上課題20余項(xiàng)，其中國家教學(xué)成果二等獎(jiǎng)1項(xiàng)、省級(jí)教學(xué)成果特等獎(jiǎng)1項(xiàng)、省級(jí)教學(xué)成果二等獎(jiǎng)1項(xiàng)。一直從事高職軟件類專業(yè)課教學(xué)，講授課程包括：HTML5+CSS3響應(yīng)式Web開發(fā)、JavaScript程序設(shè)計(jì)、動(dòng)態(tài)網(wǎng)站開發(fā)、MySQL數(shù)據(jù)庫應(yīng)用等。
目 錄
項(xiàng)目1
搭建智慧公寓網(wǎng)站首頁1
項(xiàng)目目標(biāo)1
效果展示2
任務(wù)1.1 搭建JavaScript開發(fā)環(huán)境與渲染
首頁信息2
【任務(wù)概述】2
【知識(shí)儲(chǔ)備】3
1.1.1 初識(shí)JavaScript3
1.1.2 JavaScript開發(fā)工具4
1.1.3 JavaScript代碼的3種引入方式7
1.1.4 JavaScript常用的輸入與輸出語句9
【任務(wù)實(shí)施】11
任務(wù)1.2 使用JavaScript基礎(chǔ)語法實(shí)現(xiàn)
動(dòng)態(tài)顯示時(shí)間13
【任務(wù)概述】13
【知識(shí)儲(chǔ)備】13
1.2.1 變量和常量13
1.2.2 數(shù)據(jù)類型15
1.2.3 表達(dá)式與運(yùn)算符17
1.2.4 函數(shù)21
1.2.5 BOM25
【任務(wù)實(shí)施】27
任務(wù)1.3 使用流程控制與數(shù)組實(shí)現(xiàn)自動(dòng)
輪播Banner圖28
【任務(wù)概述】28
【知識(shí)儲(chǔ)備】28
1.3.1 流程控制28
1.3.2 數(shù)組34
【任務(wù)實(shí)施】36
任務(wù)1.4 使用DOM與事件實(shí)現(xiàn)二級(jí)菜單的
顯示與隱藏37
【任務(wù)概述】37
【知識(shí)儲(chǔ)備】38
1.4.1 DOM38
1.4.2 事件基礎(chǔ)44
【任務(wù)實(shí)施】48
項(xiàng)目實(shí)現(xiàn)51
項(xiàng)目小結(jié)54
課后習(xí)題54
項(xiàng)目2
智慧公寓管理系統(tǒng)的服務(wù)器端數(shù)據(jù)
處理56
項(xiàng)目目標(biāo)56
效果展示57
任務(wù)2.1 搭建Node.js開發(fā)環(huán)境并實(shí)現(xiàn)
模塊化開發(fā)57
【任務(wù)概述】57
【知識(shí)儲(chǔ)備】58
2.1.1 初識(shí)Node.js58
2.1.2 Node.js環(huán)境搭建60
2.1.3 模塊化開發(fā)64
【任務(wù)實(shí)施】71
任務(wù)2.2 構(gòu)建與測(cè)試Node.js的網(wǎng)絡(luò)
開發(fā)73
【任務(wù)概述】73
【知識(shí)儲(chǔ)備】73
2.2.1 Postman工具73
2.2.2 AJAX與Axios75
2.2.3 Express框架80
【任務(wù)實(shí)施】87
項(xiàng)目實(shí)現(xiàn)90
項(xiàng)目小結(jié)94
課后習(xí)題94
項(xiàng)目3
智慧公寓管理系統(tǒng)的登錄與注冊(cè)
頁面96
項(xiàng)目目標(biāo)96
效果展示97
任務(wù)3.1 構(gòu)建Vue開發(fā)環(huán)境97
【任務(wù)概述】97
【知識(shí)儲(chǔ)備】98
3.1.1 初識(shí)Vue98
3.1.2 Vue環(huán)境搭建100
【任務(wù)實(shí)施】101
任務(wù)3.2 基于Vue基礎(chǔ)語法實(shí)現(xiàn)表單提交
頁面102
【任務(wù)概述】102
【知識(shí)儲(chǔ)備】103
3.2.1 模板語法103
3.2.2 指令105
3.2.3 Vue實(shí)例核心選項(xiàng)113
3.2.4 模板引用122
3.2.5 Class與Style綁定123
3.2.6 事件處理與表單綁定125
【任務(wù)實(shí)施】130
任務(wù)3.3 基于組件實(shí)現(xiàn)列表渲染頁面132
【任務(wù)概述】132
【知識(shí)儲(chǔ)備】133
3.3.1 組件基礎(chǔ)133
3.3.2 過渡與動(dòng)畫139
【任務(wù)實(shí)施】145
項(xiàng)目實(shí)現(xiàn)147
項(xiàng)目小結(jié)149
課后習(xí)題149
項(xiàng)目4
智慧公寓管理系統(tǒng)的前端技術(shù)棧151
項(xiàng)目目標(biāo)151
效果展示152
任務(wù)4.1 構(gòu)建現(xiàn)代化構(gòu)建工具Vite開發(fā)
環(huán)境152
【任務(wù)概述】152
【知識(shí)儲(chǔ)備】153
4.1.1 單文件組件與構(gòu)建工具153
4.1.2 Vite簡介154
4.1.3 Vite的安裝與使用155
4.1.4 Vite的插件機(jī)制157
【任務(wù)實(shí)施】158
任務(wù)4.2 啟用Element Plus組件庫增強(qiáng)
項(xiàng)目效果160
【任務(wù)概述】160
【知識(shí)儲(chǔ)備】161
4.2.1 初識(shí)Element Plus組件庫161
4.2.2 Element Plus常用組件163
【任務(wù)實(shí)施】188
任務(wù)4.3 集成Vue Router與Pinia，構(gòu)建
動(dòng)態(tài)應(yīng)用190
【任務(wù)概述】190
【知識(shí)儲(chǔ)備】190
4.3.1 Vue Router190
4.3.2 Pinia狀態(tài)管理199
【任務(wù)實(shí)施】205
項(xiàng)目實(shí)現(xiàn)208
項(xiàng)目小結(jié)211
課后習(xí)題211
項(xiàng)目5
智慧公寓管理系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)213
項(xiàng)目組織架構(gòu)213
項(xiàng)目環(huán)境214
任務(wù)5.1 實(shí)現(xiàn)服務(wù)器模塊215
【任務(wù)概述】215
【任務(wù)實(shí)施】215
任務(wù)5.2 實(shí)現(xiàn)前臺(tái)頁面模塊216
【任務(wù)概述】216
【任務(wù)實(shí)施】218
任務(wù)5.3 實(shí)現(xiàn)后臺(tái)頁面模塊225
【任務(wù)概述】225
【任務(wù)實(shí)施】228
項(xiàng)目總結(jié)238
書單推薦
