| Electron 實戰(zhàn)必備：electron 依賴安裝 |
? electron 版本選擇（目前最新 18.2.0 ）
? electron-builder 版本選擇 |
| 客戶端實戰(zhàn)開發(fā)必備知識 |
? 進程和線程
? 主進程和渲染進程
? 進程間通信
? 跨進程訪問
? 以及 electron 升級中遇到的常見問題 |
| 主進程 |
? 如何創(chuàng)建窗口的案例 - BrowserWindow
? 如何加載網(wǎng)頁的案例 - loadURL
? 窗口關閉事件監(jiān)聽回收 的案例
? app 事件監(jiān)聽的案例 * ready
* window-all-closed
* activate
? 其他高階模塊的案例
* ipcMain 發(fā)送和監(jiān)聽消息案例
* autoUpdater 自動升級案例
* 部分原生 UI 模塊案例： menu 案例 & dialog 案例 |
| 調試 |
? 主進程調試：
* Node 進程基于 --inspect
* 常見問題：端口沖突，增加命令參數(shù)指定端口
? 渲染進程調試：
* Chromium 的一個窗口，和網(wǎng)頁調試類似，基于 devtools
* 代碼啟動窗口的時候設置 mainWindow.webContents.openDevTools()
? 在 VSCode 調試（高級篇）：
* 安裝 Debugger for Chrome
* 配置 .vscode/launch.json
? 生產(chǎn)環(huán)境調試：
* 基于 Debugtron
* 常見問題解決 |
| 基于腳手架搭建 angular 13 應用 |
@angular/cli 13.* （比如 13.3.2 ） 創(chuàng)建 angular 13 版本的項目
angular 腳手架的版本迭代歷史 |
| 熟悉腳手架生成的目錄和命令 |
? src/app
? src/environments
? ng serve 本地啟動服務和參數(shù)
? ng build 構建和打包之后的文件介紹 |
| v13 版本的核心變化 |
? rxjs 升級到 7
? 構建工具默認使用持久構建緩存
? 移除 IE11 鋪平道路
? 新 API 移除了將 ComponentFactoryResolver 注入到構造函數(shù)的需要
? Angular Package Format (APF) 的更改
? View Engine 在 Angular 中將不再可用 |
| Typescript 實戰(zhàn)必備語法 |
? class
? private
? public
? Partial
? tsconfig 的配置
? tslint 的項目配置和代碼規(guī)范 |
| 預編譯樣式 |
選擇 less 作為主要預編譯的原因以及對比 Sass 等
?
|
| angular 實戰(zhàn)核心模塊 |
? 圍繞核心模塊進行組件化開發(fā)
1.@angular/core
2.@angular/router
3. @angular/forms
4.@angular/common
5.@angular/compiler
6.rxjs
7.zone.js
? angular 基礎文件：
angular.json
main.ts
app.component.ts
index.html
? 案例所需指令詳解：
ngIf
(ngSubmit)
[ngClass]
[disabled]
[innerHTML]
? 案例涉及路由 @angular/router 詳解 ：
routerLink
navigate
? 案例涉及與后端服務通信 @angular/common/http ：
HttpClient 等
services 目錄的拆分
post 與 get 的區(qū)分
結合 localStorage 進行用戶登錄信息的本地緩存
? 案例涉及到 @angular/forms 詳解
ReactiveFormsModule
FormBuilder
FormGroup
Validators
? 基于 karma 對案例項目進行自動化測試：
karma.conf.js 的配置詳解
karma 的依賴配置： karma-coverage-istanbul-reporter 、 karma-jasmine-html-reporter 等
? rxjs 的案例深度應用
rxjs/operators
Subscription
Observable
of
throwError |
| 開源組件庫使用 |
? ng-zorro-antd 部分表單組件使用案例
? element 部分表單組件使用案例
? 組件必備知識詳解 |
| 調試 & 自動化測試 & 性能工具 |
? 基于 protractor 自動化測試實戰(zhàn)：
? 性能檢測：基于 lighthouse 評分進行優(yōu)化
? angular 工具使用： chrome 擴展 DevTools 實戰(zhàn)必備使用案例解析 |
| 錯誤日志監(jiān)聽 |
整體基于 sentry 搭建錯誤日志上報的實時平臺 |
| 案例實戰(zhàn) |
? 完成一個登陸、注冊的表單
? electron + angular 13 |
