Electron項(xiàng)目開(kāi)發(fā)實(shí)戰(zhàn)
定 價(jià):119 元
- 作者:[美]丹尼斯·維卡 著 張弢 譯
- 出版時(shí)間:2022/3/1
- ISBN:9787302598077
- 出 版 社:清華大學(xué)出版社
- 中圖法分類(lèi):TP311.561
- 頁(yè)碼:376
- 紙張:
- 版次:1
- 開(kāi)本:
《Electron項(xiàng)目開(kāi)發(fā)實(shí)戰(zhàn)》詳細(xì)闡述了與Electron項(xiàng)目開(kāi)發(fā)相關(guān)的基本解決方案,主要包括構(gòu)建Markdown編輯器,與Angular、React和Vue集成,構(gòu)建屏幕截圖剪裁工具,制作2D游戲,構(gòu)建音樂(lè)播放器,分析、Bug跟蹤和許可機(jī)制,利用Firebase構(gòu)建群聊應(yīng)用程序,構(gòu)建eBook編輯器和生成器,構(gòu)建桌面數(shù)字錢(qián)包等內(nèi)容。此外,本書(shū)還提供了相應(yīng)的示例、代碼,以幫助讀者進(jìn)一步理解相關(guān)方案的實(shí)現(xiàn)過(guò)程。
本書(shū)適合作為高等院校計(jì)算機(jī)及相關(guān)專(zhuān)業(yè)的教材和教學(xué)參考書(shū),也可作為相關(guān)開(kāi)發(fā)人員的自學(xué)用書(shū)和參考手冊(cè)
前 言
本書(shū)將引領(lǐng)讀者設(shè)置、配置、構(gòu)建和發(fā)布Electron應(yīng)用程序,并提供進(jìn)一步的實(shí)戰(zhàn)經(jīng)驗(yàn)。其間,我們將構(gòu)建多個(gè)項(xiàng)目、處理各種挑戰(zhàn)和問(wèn)題,并將JavaScript框架與底層工具鏈集成。
適用讀者
本書(shū)面向初學(xué)者或有經(jīng)驗(yàn)的Web開(kāi)發(fā)人員。讀者應(yīng)具備HTML、CSS和JavaScript方面的基礎(chǔ)知識(shí),并熟悉React、Angular或Vue.js框架之一。
另外,本書(shū)不要求桌面開(kāi)發(fā)方面的前期知識(shí)。
本書(shū)內(nèi)容
第1章準(zhǔn)備開(kāi)發(fā)環(huán)境并開(kāi)始Electron開(kāi)發(fā)。
第2章引領(lǐng)讀者熟悉典型Electron應(yīng)用程序的主要構(gòu)造模塊。
第3章介紹前端JavaScript框架,如Angular、React.js和Vue.js,以及如何將其集成至Electron應(yīng)用程序中,以構(gòu)建跨平臺(tái)的桌面應(yīng)用程序,進(jìn)而通過(guò)站點(diǎn)共享代碼庫(kù)。
第4章考查如何與Electron中的本地圖像捕捉API協(xié)調(diào)工作、系統(tǒng)托盤(pán)集成和鍵盤(pán)處理機(jī)制。
第 5 章討論一個(gè)有趣的JavaScript游戲引擎,并處理游戲循環(huán)、加載外資源,以及處理Main和Renderer進(jìn)程間的通信。
第6章將構(gòu)建一個(gè)包含播放列表和定制專(zhuān)輯封面的桌面音樂(lè)播放器。
第7章針對(duì)在生產(chǎn)中監(jiān)控Electron應(yīng)用程序、跟蹤錯(cuò)誤和崩潰、分析實(shí)時(shí)用戶群提供了必要的信息。
第 8 章創(chuàng)建一個(gè)具有群聊功能的Electron應(yīng)用程序,針對(duì)移動(dòng)應(yīng)用程序集成Google Firebase服務(wù)、配置Google Authentication,并在云中存儲(chǔ)應(yīng)用程序數(shù)據(jù)。
第9章將創(chuàng)建一個(gè)簡(jiǎn)單的跨平臺(tái)圖書(shū)編輯器,并利用Docker生成PDF和ePub圖書(shū),隨后在獨(dú)立的Electron窗口中預(yù)覽PDF文件。
第 10 章將開(kāi)發(fā)一個(gè)簡(jiǎn)單的數(shù)字錢(qián)包應(yīng)用程序(與外部服務(wù)集成),并連接至運(yùn)行于本地的服務(wù)器。
發(fā)布周期
從2019年5月13日開(kāi)始,Electron項(xiàng)目的發(fā)布周期改為12周。讀者可訪問(wèn)官方文檔查看詳細(xì)內(nèi)容,對(duì)應(yīng)網(wǎng)址為https://electronjs.org/blog/12-week-cadence。
縮短發(fā)布周期意味著我們可更快地獲取新特性、修復(fù)Bug和安全問(wèn)題。當(dāng)然,這也意味著,本書(shū)出版后很可能會(huì)發(fā)布新的Electron版本。
好消息是,Electron團(tuán)隊(duì)支持近的3個(gè)主要版本。對(duì)此,讀者可訪問(wèn)https://electronjs. org/docs/tutorial/support#supported-versions查看時(shí)間表和更多細(xì)節(jié)內(nèi)容。另外,通過(guò)輸入下列命令,我們還可以方便地將應(yīng)用程序項(xiàng)目更新至Electron的版本:
npm install electron@latest
關(guān)于每個(gè)版本的詳細(xì)信息,這里建議關(guān)注Electron團(tuán)隊(duì)的博客,對(duì)應(yīng)網(wǎng)址為https:// www.electronjs.org/blog。
背景知識(shí)
讀者應(yīng)了解Node.js(https://nodejs.org/en/)及其基本命令,如npm install。
偏好Angular的讀者需要了解與Angular CLI相關(guān)的細(xì)節(jié)信息(https://cli.angular.io/)及其命令。
針對(duì)React開(kāi)發(fā),讀者應(yīng)了解Create React App(https://github.com/facebook/create-react- app)工具。
對(duì)于Electron開(kāi)發(fā),當(dāng)使用Vue.js框架時(shí),Vue CLI(https://cli.vuejs.org/)應(yīng)用程序文檔包含了豐富的細(xì)節(jié)信息和示例。
下載示例代碼文件
讀者可訪問(wèn)www.packt.com并通過(guò)個(gè)人賬戶下載本書(shū)的示例代碼文件。無(wú)論讀者在何處購(gòu)買(mǎi)了本書(shū),均可訪問(wèn)www.packt.com/support,經(jīng)注冊(cè)后我們會(huì)直接將相關(guān)文件通過(guò)電子郵件的方式發(fā)送給您。
下載代碼文件的具體操作步驟如下。
(1)訪問(wèn)www.packt.com并注冊(cè)。
(2)選擇Support選項(xiàng)卡。
(3)單擊Code Downloads。
(4)在Search搜索框中輸入書(shū)名。
當(dāng)文件下載完畢后,可利用下列軟件的版本解壓或析取文件夾中的內(nèi)容。
? WinRAR/7-Zip(Windows環(huán)境)。
? Zipeg/iZip/UnRarX(Mac環(huán)境)。
? 7-Zip/PeaZip(Linux環(huán)境)。
另外,本書(shū)的代碼包也托管于GitHub上,對(duì)應(yīng)網(wǎng)址為https://github.com/PacktPublishing/ Electron-Projects。若代碼被更新,現(xiàn)有的GitHub庫(kù)也會(huì)保持同步更新。
讀者還可訪問(wèn)https://github.com/PacktPublishing/并從對(duì)應(yīng)分類(lèi)中查看其他代碼包和視頻內(nèi)容。
圖標(biāo)表示警告或重要的注意事項(xiàng)。
圖標(biāo)表示提示信息和操作技巧。
讀者反饋和客戶支持
歡迎讀者對(duì)本書(shū)提出建議或意見(jiàn)。
對(duì)此,讀者可向customercare@packtpub.com發(fā)送郵件,并以書(shū)名作為郵件標(biāo)題。
勘誤表
盡管我們希望做到盡善盡美,但不足依然在所難免。如果讀者發(fā)現(xiàn)謬誤之處,無(wú)論是文字錯(cuò)誤抑或代碼錯(cuò)誤,還望不吝賜教。對(duì)此,讀者可訪問(wèn)http://www.packtpub.com/submit- errata,選取對(duì)應(yīng)書(shū)籍,輸入并提交相關(guān)問(wèn)題的詳細(xì)內(nèi)容。
版權(quán)須知
一直以來(lái),互聯(lián)網(wǎng)上的版權(quán)問(wèn)題從未間斷,Packt出版社對(duì)此類(lèi)問(wèn)題異常重視。若讀者在互聯(lián)網(wǎng)上發(fā)現(xiàn)本書(shū)任意形式的副本,請(qǐng)告知我們網(wǎng)絡(luò)地址或網(wǎng)站名稱(chēng),我們將對(duì)此予以處理。關(guān)于盜版問(wèn)題,讀者可發(fā)送郵件至copyright@packtpub.com。
若讀者針對(duì)某項(xiàng)技術(shù)具有專(zhuān)家級(jí)的見(jiàn)解,抑或計(jì)劃撰寫(xiě)書(shū)籍或完善某部著作的出版工作,可訪問(wèn)authors.packtpub.com。
問(wèn)題解答
若讀者對(duì)本書(shū)有任何疑問(wèn),均可發(fā)送郵件至questions@packtpub.com,我們將竭誠(chéng)為您服務(wù)。
潘瀟,公司高級(jí)技術(shù)經(jīng)理,主要負(fù)責(zé)前端方向,同時(shí)負(fù)責(zé)跨技術(shù)棧的技術(shù)管理工作。從事前端方向8年,在前端業(yè)務(wù)研發(fā)和管理上有一定的經(jīng)驗(yàn)。同時(shí)對(duì)其他技術(shù)方向如客戶端開(kāi)發(fā)等,也有不少涉獵。其中使用Electron進(jìn)行夸端開(kāi)發(fā)有3年,對(duì)Electron的基礎(chǔ)知識(shí)、特性、優(yōu)化及進(jìn)階使用有一定心得。
目 錄
第1章 構(gòu)建第1個(gè)Electron應(yīng)用程序 1
1.1 技術(shù)需求 1
1.2 Electron是什么 1
1.3 準(zhǔn)備開(kāi)發(fā)環(huán)境 2
1.3.1 安裝Visual Studio Code 2
1.3.2 針對(duì)macOS設(shè)置環(huán)境 3
1.3.3 針對(duì)Ubuntu Linux設(shè)置環(huán)境 5
1.3.4 針對(duì)Windows設(shè)置環(huán)境 6
1.3.5 在Windows上安裝Node.js 7
1.4 創(chuàng)建一個(gè)簡(jiǎn)單的應(yīng)用程序 8
1.5 多平臺(tái)的打包機(jī)制 13
1.5.1 macOS包機(jī)制 13
1.5.2 Ubuntu包機(jī)制 16
1.5.3 Windows的包機(jī)制 18
1.6 本章小結(jié) 20
第2章 構(gòu)建Markdown編輯器 21
2.1 技術(shù)需求 21
2.2 配置新的項(xiàng)目 22
2.3 適配屏幕尺寸 26
2.4 集成應(yīng)用程序菜單 28
2.4.1 創(chuàng)建一個(gè)自定義菜單項(xiàng) 29
2.4.2 定義菜單項(xiàng)角色 32
2.4.3 菜單分隔符 33
2.4.4 鍵盤(pán)加速鍵 35
2.4.5 特定平臺(tái)的菜單 36
2.4.6 配置菜單中的應(yīng)用程序名稱(chēng) 38
2.4.7 隱藏菜單項(xiàng) 39
2.4.8 進(jìn)程間的消息發(fā)送 41
2.4.9 將文件保存至本地系統(tǒng) 46
2.4.10 從本地系統(tǒng)中加載文件 53
2.4.11 創(chuàng)建一個(gè)文件菜單 57
2.5 添加拖曳功能 59
2.6 支持自動(dòng)更新功能 62
2.7 修改應(yīng)用程序的標(biāo)題 71
2.8 本章小結(jié) 72
第3章 與Angular、React和Vue集成 73
3.1 技術(shù)需求 73
3.2 利用Angular構(gòu)建Electron應(yīng)用程序 73
3.2.1 生成Angular項(xiàng)目 74
3.2.2 將Angular項(xiàng)目與Electron集成 76
3.2.3 配置實(shí)時(shí)重載 81
3.2.4 設(shè)置生產(chǎn)版本 83
3.2.5 設(shè)置條件加載 85
3.2.6 使用Angular Material組件 87
3.2.7 Anguar路由機(jī)制 91
3.3 利用React構(gòu)建Electron應(yīng)用程序 98
3.3.1 創(chuàng)建React項(xiàng)目 98
3.3.2 實(shí)時(shí)重載 102
3.3.3 設(shè)置產(chǎn)品發(fā)布版本 105
3.3.4 設(shè)置條件加載 107
3.3.5 使用Blueprint UI工具箱 108
3.4 利用Vue.js構(gòu)建Electron應(yīng)用程序 113
3.4.1 創(chuàng)建一個(gè)Vue配置文件 117
3.4.2 實(shí)時(shí)重載 119
3.4.3 產(chǎn)品發(fā)布版本 121
3.4.4 設(shè)置條件加載 122
3.4.5 添加路由機(jī)制 123
3.4.6 配置Vue Material 125
3.5 本章小結(jié) 129
第4章 構(gòu)建屏幕截圖剪裁工具 131
4.1 技術(shù)需求 131
4.2 準(zhǔn)備項(xiàng)目 132
4.3 配置無(wú)框窗口 133
4.3.1 macOS的附加選項(xiàng) 135
4.3.2 使用隱藏的titleBarStyle 135
4.3.3 titleBarStyle屬性的hiddenInset值 136
4.3.4 titleBarStyle的customButtonsOnHover值 137
4.4 透明窗口 138
4.5 可拖曳的應(yīng)用程序窗口 141
4.6 添加截圖工具欄按鈕 142
4.7 使用desktopCapturer API 144
4.8 計(jì)算主顯示尺寸 145
4.9 生成并保存縮略圖 146
4.10 重置圖像尺寸并剪裁圖像 148
4.11 測(cè)試應(yīng)用程序的行為 151
4.12 集成系統(tǒng)托盤(pán) 152
4.13 啟動(dòng)時(shí)隱藏主應(yīng)用程序菜單 154
4.14 注冊(cè)全局鍵盤(pán)快捷方式 155
4.15 本章小結(jié) 157
第5章 制作2D游戲 159
5.1 技術(shù)需求 159
5.2 配置游戲項(xiàng)目 160
5.3 運(yùn)行Hello World示例 163
5.4 渲染背景圖像 166
5.5 禁止窗口尺寸變化 168
5.6 渲染精靈對(duì)象 168
5.7 縮放精靈對(duì)象 169
5.8 處理鍵盤(pán)輸入 171
5.9 根據(jù)方向翻轉(zhuǎn)飛船對(duì)象 173
5.10 控制精靈對(duì)象的坐標(biāo) 174
5.11 控制精靈對(duì)象的速度 177
5.12 本章小結(jié) 179
第6章 構(gòu)建音樂(lè)播放器 181
6.1 技術(shù)需求 181
6.2 創(chuàng)建項(xiàng)目 182
6.3 音樂(lè)播放器組件 184
6.3.1 下載音樂(lè)文件 185
6.3.2 基本的播放器設(shè)置 188
6.3.3 樣式按鈕 192
6.4 播放控制按鈕 195
6.4.1 Stop按鈕 195
6.4.2 靜音和非靜音按鈕 197
6.4.3 音量按鈕 199
6.5 實(shí)現(xiàn)歌曲的進(jìn)度欄 202
6.6 顯示音樂(lè)元數(shù)據(jù) 203
6.7 改進(jìn)用戶界面 208
6.8 終的結(jié)構(gòu) 210
6.9 本章小結(jié) 213
第7章 分析、Bug跟蹤和許可機(jī)制 215
7.1 技術(shù)需求 215
7.2 連接分析和跟蹤機(jī)制 216
7.3 構(gòu)建自身方案或使用已有服務(wù) 216
7.3.1 創(chuàng)建自己的分析服務(wù) 217
7.3.2 使用第三方分析服務(wù) 217
7.4 針對(duì)Electron應(yīng)用程序使用Nucleus 218
7.5 創(chuàng)建一個(gè)新的Nucleus賬戶 219
7.6 創(chuàng)建基于跟蹤支持的新項(xiàng)目 222
7.7 安裝Nucleus Electron庫(kù) 224
7.8 查看實(shí)時(shí)分析數(shù)據(jù) 226
7.9 禁用每個(gè)用戶請(qǐng)求的跟蹤機(jī)制 230
7.10 驗(yàn)證實(shí)時(shí)用戶統(tǒng)計(jì)結(jié)果 231
7.11 支持離線模式 232
7.12 處理應(yīng)用程序更新 232
7.13 加載全局服務(wù)器設(shè)置 235
7.14 許可檢查機(jī)制和政策 237
7.14.1 創(chuàng)建新策略和許可 237
7.14.2 檢查應(yīng)用程序中的證書(shū) 240
7.15 本章小結(jié) 241
第8章 利用Firebase構(gòu)建群聊應(yīng)用程序 243
8.1 技術(shù)需求 243
8.2 創(chuàng)建一個(gè)Angular項(xiàng)目 245
8.3 創(chuàng)建新的Firebase賬戶 248
8.4 創(chuàng)建一個(gè)Firebase應(yīng)用程序 252
8.5 配置Angular Material組件 254
8.5.1 添加Browser Animations模塊 255
8.5.2 配置默認(rèn)的主題 255
8.5.3 添加Material Icons庫(kù) 255
8.5.4 添加導(dǎo)航欄 256
8.5.5 利用材質(zhì)工具欄測(cè)試應(yīng)用程序 257
8.6 構(gòu)建登錄對(duì)話框 258
8.6.1 實(shí)現(xiàn)Material界面 259
8.6.2 錯(cuò)誤處理機(jī)制 261
8.6.3 準(zhǔn)備聊天組件占位符 262
8.7 將登錄對(duì)話框連接至Firebase Authentication 263
8.7.1 啟用注冊(cè)供應(yīng)商 264
8.7.2 創(chuàng)建示例賬戶 266
8.7.3 集成Login對(duì)話框和Firebase 268
8.8 配置實(shí)時(shí)數(shù)據(jù)庫(kù) 271
8.9 渲染聊天群列表 275
8.10 實(shí)現(xiàn)群消息頁(yè)面 279
8.11 顯示群消息 281
8.12 發(fā)送群消息 285
8.12.1 更新消息列表界面 288
8.12.2 進(jìn)一步改進(jìn) 288
8.13 驗(yàn)證Electron Shell 289
8.14 本章小結(jié) 290
第9章 構(gòu)建eBook編輯器和生成器 291
9.1 技術(shù)需求 291
9.2 創(chuàng)建項(xiàng)目結(jié)構(gòu) 292
9.2.1 生成新的React應(yīng)用程序 292
9.2.2 安裝編輯器組件 293
9.2.3 測(cè)試Web應(yīng)用程序 298
9.2.4 與Electron Shell集成 300
9.3 升級(jí)代碼并使用React Hooks 301
9.4 控制鍵盤(pán)快捷方式 302
9.4.1 加載文件 303
9.4.2 保存文件 306
9.5 集成應(yīng)用程序菜單 308
9.6 設(shè)置電子書(shū)生成器 311
9.6.1 安裝Docker 312
9.6.2 運(yùn)行Pandoc容器 315
9.6.3 將文檔發(fā)送至主進(jìn)程(Node.js) 317
9.7 從Electron中調(diào)用Docker命令 320
9.7.1 將標(biāo)記文本發(fā)送至Node.js進(jìn)程 320
9.7.2 將標(biāo)記文本保存至本地磁盤(pán) 320
9.8 生成PDF電子書(shū) 323
9.9 生成ePub電子書(shū) 325
9.10 本章小結(jié) 328
第10章 構(gòu)建桌面數(shù)字錢(qián)包 329
10.1 技術(shù)需求 329
10.2 利用React生成項(xiàng)目 330
10.3 集成Ant Design庫(kù) 332
10.4 設(shè)置個(gè)人以太坊區(qū)塊鏈 334
10.5 配置Ethereum JavaScript API 338
10.6 顯示以太坊節(jié)點(diǎn)信息 340
10.6.1 獲取節(jié)點(diǎn)信息 340
10.6.2 在Header中渲染節(jié)點(diǎn)信息 341
10.7 集成應(yīng)用程序菜單 342
10.8 渲染賬戶列表 344
10.9 顯示賬戶余額 347
10.10 將以太轉(zhuǎn)至另一個(gè)賬戶中 350
10.11 打包應(yīng)用程序并發(fā)布 355
10.12 本章小結(jié) 358