2 天
網頁前端技術類 Angular 進階開發實戰:精通 RxJS 應用本課程將由淺入深帶領學員融會貫通 RxJS 的基礎知識, 讓抽象的觀念不再抽象; 並以 Angular 為主搭配大量的實例練習,學習使用 RxJS 解決各種實務難題的技巧寫出更加洗練、穩固的程式碼!

此課程適合給...

  • 了解基礎 HTML / CSS / JavaScript 語法
  • 需了解 Angular 資料繫結語法、使用元件方式
  • 本課程不適合完全沒有 Angular 2+ 開發經驗的人

上完此課程你將會...

  • 學會基礎觀念,打穩使用 RxJS 的地基
  • 透過 RxJS 撰寫更穩固、好維護的程式碼
  • 使用 Angular 為範例實作常見功能,實務開發也能得心應手

RxJS 在前端世界的能見度已經越來越高,無論是 Angular、React 還是 Vue 專案內都能看到使用它的影子。 然而 Angular 框架內預設採用了 RxJS 作為各種非同步資料流的處理方法, 使得 Angular 開發人員勢必得花些時間去學習,增加了一點學習門檻。 由於 RxJS 是多個抽象概念所組合成的函式庫,許多新手在嘗試理解 RxJS 的過程中, 因為不理解這些抽象概念而放棄掌握這門優秀的函式庫。

其實只要能將基礎的觀念奠定好,便能輕易透過 RxJS 寫出更好閱讀、更好維護的程式碼, 將許多複雜的邏輯大幅簡化成容易理解的資料流程。本課程將由淺入深帶大家認識學習 RxJS 必備的基礎知識, 幫助學員融會貫通這些抽象概念,並懂得使用正確的思維方式使用 RxJS 函式庫。 最後,我們會以 Angular 為主軸,搭配大量練習實作,學習到開發 Angular 專案時常用的 RxJS 技巧, 靈活運用 RxJS 解決各種前端常見難題!

本課程將由淺入深帶領學員融會貫通 RxJS 的基礎知識, 讓抽象的觀念不再抽象; 並以 Angular 為主搭配大量的實例練習,學習使用 RxJS 解決各種實務難題的技巧寫出更加洗練、穩固的程式碼!

課程內容

  • 三步驟上手 RxJS

    三步驟上手 RxJS

  • RxJS 完整觀念釐清(共 6 章)
    6

    RxJS 完整觀念釐清

    • 認識 ReactiveX
    • 認識 非同步程式設計
    • 認識 Stream 串流思維
    • 認識 Observable Pattern
    • 認識 Iterator Pattern
    • 認識 Functional Programming
  • 深入使用 RxJS(共 8 章)
    8

    深入使用 RxJS

    • 理解 RxJS 中各種重要角色
    • 認識彈珠圖 Marble Diagram
    • 基本操作符 (operators) 介紹
    • 認識 Subject
    • 釐清 Hot Observable v.s. Cold Observable
    • 進階操作符介紹
    • 認識 Scheduler
    • 如何自訂操作符
  • Angular + RxJS 實戰(共 6 章)
    6

    Angular + RxJS 實戰

    • 好用的 Async Pipe、打造高效能 Angular 元件
    • 實作自動完成功能
    • 實作表格分頁、排序功能
    • 實作簡易 Redux Pattern 狀態管理機制
    • 正確的錯誤處理方式
    • 撰寫 RxJS 測試程式
  • NgRx 實戰(共 5 章)
    5

    NgRx 實戰

    • 使用 schematics 快速建立相關檔案
    • 使用 @ngrx/store 管理狀態
    • 使用 @ngrx/effects 控制 side effect 處理
    • 使用 @ngrx/store-devtools 快速進行程式除錯
    • 其他 NgRx 常用技巧
3

三步驟上手 RxJS

6

RxJS 完整觀念釐清

  • 認識 ReactiveX
  • 認識 非同步程式設計
  • 認識 Stream 串流思維
  • 認識 Observable Pattern
  • 認識 Iterator Pattern
  • 認識 Functional Programming
8

深入使用 RxJS

  • 理解 RxJS 中各種重要角色
  • 認識彈珠圖 Marble Diagram
  • 基本操作符 (operators) 介紹
  • 認識 Subject
  • 釐清 Hot Observable v.s. Cold Observable
  • 進階操作符介紹
  • 認識 Scheduler
  • 如何自訂操作符
6

Angular + RxJS 實戰

  • 好用的 Async Pipe、打造高效能 Angular 元件
  • 實作自動完成功能
  • 實作表格分頁、排序功能
  • 實作簡易 Redux Pattern 狀態管理機制
  • 正確的錯誤處理方式
  • 撰寫 RxJS 測試程式
5

NgRx 實戰

  • 使用 schematics 快速建立相關檔案
  • 使用 @ngrx/store 管理狀態
  • 使用 @ngrx/effects 控制 side effect 處理
  • 使用 @ngrx/store-devtools 快速進行程式除錯
  • 其他 NgRx 常用技巧

講師介紹

Mike

2020 年榮獲 Angular/Web GDE (Google Developer Expert) 開發專家。

2020 榮獲 Microsoft MVP 微軟最有價值專家 (Developer Technologies)。

2017 年以「Angular Material 完全攻略」榮獲【第 9 屆 iT 邦幫忙鐵賽】Modern Web 組冠軍。

2018 年以「Angular 大師之路」榮獲【第 10 屆 iT 邦幫忙鐵人賽】Modern Web 組優選。

2020 年以「打通 RxJS 任督二脈」榮獲【第 12 屆 iT 邦幫忙鐵人賽】Modern Web 組冠軍。

熟悉 Angular 與 .NET 相關開發技術。

出版著作有『打通 RxJS 任督二脈:從菜雞前進老鳥必學的關鍵知識』。

部落格 https://wellwind.idv.tw/blog

FB 粉絲頁 https://www.facebook.com/fullstackledder

學員回饋
Contact Us聯絡多奇
聯絡多奇為您提供最專業的協助!
background image background image