Web應用開發技術（微課版）

本書全面介紹Web應用程序的開發技術及實踐方法。全書共17章,其中第1章簡述Web應用程序的工作原理和基礎知識，概要介紹全書內容和編排結構，此後章節分為客戶端技術篇、服務端技術篇和技術拓展篇。 客戶端技術篇包括第2～8章，著重介紹關於HTML、CSS、JavaScript、瀏覽器對象模型和文檔對象模型的相關知識，同時也涉及Bootstrap和Vue.js框架的使用。 服務端技術篇包括第9～13章，主要介紹基於Node.js環境進行Web應用服務端程序開發的方法，也深入討論了數據庫交互、鑒權機制、服務端推送、應用部署等實踐中常見的問題。 技術拓展篇包括第14～17章，其中,第14章介紹Vue.js單頁面應用開發的方法，第15～17章進一步探索Web應用開發技術的更多應用領域，內容涉及移動端應用、微信小程序、桌面端應用的開發。 本書適合作為高等院校電腦類專業相關課程的教材,也可以作為讀者自學Web相關開發技術的參考書。

目錄

 

 

 

第1章概述1

1.1Web 應用程序工作原理2

1.2客戶端技術3

1.3服務端技術4

1.4開發工具4

1.4.1Chrome4

1.4.2Visual Studio Code5

客戶端技術篇

第2章HTML基礎9

2.1HTML文檔的基本結構9

2.2HTML元數據11

2.3HTML常用元素11

2.4字符實體13

2.5相對路徑13

2.6綜合示例——HTML常用元素14

2.7HTML表單元素16

2.8綜合示例——表單元素18

2.9小結20

第3章CSS基礎21

3.1CSS基本語法21

3.2引入外部樣式表22

3.3CSS選擇器22

3.3.1CSS基本選擇器23

3.3.2CSS基本選擇器的組合27

3.4樣式聲明優先級28

3.5常用CSS屬性29

3.5.1顏色、方位與長度單位29

3.5.2盒模型31

3.5.3元素背景35

3.5.4文字樣式36

3.5.5元素的顯示模式38

3.5.6彈性框佈局40

3.5.7網格佈局45

3.5.8元素定位48

3.5.9元素浮動51

3.5.10元素的疊放層次53

3.5.11其他屬性53

3.6綜合示例55

3.6.1頁面版塊劃分56

3.6.2編寫代碼56

3.7小結58

第4章CSS進階59

4.1圓角效果59

4.2陰影效果60

4.3溢出61

4.4CSS自定義屬性63

4.5calc()函數64

4.6偽元素64

4.7矢量圖標65

4.8過渡與動畫67

4.8.1過渡67

4.8.2動畫68

4.9變換70

4.9.1旋轉70

4.9.2縮放72

4.9.3傾斜73

4.9.4平移73

4.10綜合示例——彈出式下拉菜單74

4.11響應式網頁設計77

4.11.1一般編碼建議79

4.11.2響應式圖像80

4.11.3媒體查詢83

4.12前端UI框架85

4.12.1Bootstrap 入門85

4.12.2Bootstrap 佈局類樣式88

4.12.3Bootstrap  基本元素樣式89

4.12.4Bootstrap工具類樣式90

4.12.5Bootstrap 組件92

4.12.6Bootstrap 圖標庫94

4.13CSS預處理器95

目錄〖3〗第5章JavaScript基礎98

5.1數據類型與數據聲明100

5.1.1基本數據類型100

5.1.2數據聲明101

5.1.3常用引用類型103

5.2基本類型與引用類型105

5.3基本運算與操作108

5.3.1運算符108

5.3.2基本操作113

5.4控制語句123

5.4.1語句塊124

5.4.2分支語句125

5.4.3循環語句131

5.4.4異常的拋出與捕獲136

5.5函數137

5.5.1函數的基本概念137

5.5.2關於函數的更多細節139

5.5.3閉包函數142

5.5.4lambda表達式143

5.5.5函數的遞歸調用144

5.5.6全局函數147

5.6對象和類148

5.6.1對象148

5.6.2類153

第6章JavaScript 進階159

6.1正則表達式159

6.1.1模式符號160

6.1.2匹配標志163

6.1.3應用場景163

6.2程序的異步執行164

6.2.1JavaScript中的異步回調167

6.2.2Promise168

6.2.3async/await172

6.3模塊化實踐174

6.3.1export/import175

6.3.2命名導出與默認導出176

6.3.3模塊的合並與動態加載177

6.4Reflect177

6.5Proxy179

6.6JSON180

第7章瀏覽器對象模型與文檔對象模型182

7.1瀏覽器對象模型182

7.1.1window183

7.1.2frames184

7.1.3history185

7.1.4location185

7.1.5navigator186

7.1.6screen188

7.1.7localStorage188

7.1.8sessionStorage189

7.1.9cookie189

7.2文檔對象模型189

7.2.1獲得元素的引用191

7.2.2設置元素樣式192

7.2.3創建與移除元素194

7.3事件處理機制197

7.3.1事件分發197

7.3.2事件監聽與處理199

7.3.3事件對象200

7.4深入文檔對象模型201

7.4.1Node202

7.4.2Document203

7.4.3Element203

7.4.4HTMLElement204

7.4.5NodeList和HTMLCollection205

7.4.6表單元素205

第8章Vue.js 基礎207

8.1MVC與MVVM207

8.2Vue.js入門209

8.3模板語法210

8.3.1文本綁定210

8.3.2表單綁定211

8.3.3屬性綁定211

8.3.4事件綁定212

8.3.5樣式綁定213

8.3.6條件渲染214

8.3.7列表渲染214

8.4計算屬性與偵聽器215

8.5生命周期鉤子217

8.6綜合示例218

服務端技術篇

第9章構建服務端程序223

9.1Node.js 基礎223

9.1.1搭建開發環境223

9.1.2創建 Node.js項目224

9.1.3調試服務端程序224

9.1.4Node.js 模塊226

9.2構建Web服務端程序227

9.3HTTP 報文228

9.3.1HTTP 請求方法229

9.3.2HTTP 回應狀態碼229

9.3.3ContentType 字段230

9.4Express231

9.4.1創建服務端程序232

9.4.2中間件233

9.4.3托管靜態資源236

9.4.4Request 對象236

9.4.5Response 對象239

9.4.6Router 對象241

9.5服務端渲染243

9.6異步通信技術245

9.7文件上傳248

9.8綜合示例250

9.8.1服務端程序250

9.8.2客戶端程序252

9.8.3小結256

第10章數據庫交互技術257

10.1創建示例數據庫257

10.2數據庫交互258

10.3參數化語句259

10.4數據庫連接池261

10.5封裝數據庫操作262

第11章鑒權機制266

11.1HTTP 基本身份認證266

11.2sessioncookie268

11.3Token270

11.4OAuth276

第12章服務端推送技術281

12.1輪詢281

12.2長輪詢282

12.3SSE283

12.4WebSocket285

12.4.1瀏覽器端 WebSocket285

12.4.2μWebSockets.js286

12.4.3Expressws288

12.4.4Socket.IO288

第13章Web服務端進階話題293

13.1跨站腳本攻擊293

13.2跨域資源共享294

13.3反向代理296

13.3.1Nginx 基礎296

13.3.2Web服務配置297

13.3.3托管靜態資源299

13.3.4負載均衡300

13.3.5HTTPS 配置301

13.4Node.js 進程管理302

技術拓展篇

第14章使用Vue.js開發單頁面應用307

14.1創建腳手架項目307

14.2Vue.js 單文件組件308

14.3項目構建與部署311

14.4第三方工具312

14.4.1Yarn312

14.4.2Babel312

14.4.3ESLint313

14.4.4Webpack313

14.5組合式 API315

14.6響應性 API318

14.7Vue Router321

14.7.1路由基礎321

14.7.2嵌套路由324

14.7.3路由組件傳參326

14.7.4從服務端獲取數據328

14.7.5編程式導航329

14.8狀態管理330

14.8.1引例330

14.8.2Pinia 核心概念333

第15章移動端應用開發336

15.1開發環境搭建337

15.1.1Android App開發環境337

15.1.2iOS App開發環境338

15.2創建與配置Capacitor項目339

15.3使用插件與原生 API 交互341

15.4構建與簽名App343

15.4.1使用Android Studio構建與簽名Android App344

15.4.2使用Xcode構建與簽名 iOS App345

第16章微信小程序開發347

16.1創建微信小程序項目348

16.2微信小程序項目結構349

16.3綜合示例 ——個人相冊353

16.3.1數據存儲模塊354

16.3.2相冊首頁355

16.3.3添加新圖片356

16.4發布微信小程序358

第17章桌面端應用開發359

17.1創建Electron項目359

17.1.1創建程序首頁360

17.1.2啟動主進程360

17.2主進程與渲染進程間通信361

17.2.1ContextBridge361

17.2.2使用IPC通道363

17.3調試Electron項目366

17.4構建Electron項目368

17.5綜合示例——計時器368

17.5.1Web程序部分369

17.5.2主進程程序部分371