iT邦幫忙

鐵人檔案

2021 iThome 鐵人賽
回列表
Modern Web

Angular 深入淺出三十天:表單與測試 系列

Angular 身為前端三大框架之一,除了有統一的規範、完整的生態圈之外,個人覺得它在製作表單的方式上也有其獨到之處,再加上 Angular 生態圈自帶的測試框架,讓你學成之後再也不會寫出有 bug 的表單!就讓李歐用三十天的時間來分享如何用 Angular 來製作表單,並且學習如果使用 Angular 來寫測試,讓你的程式碼品質更上一層樓!

鐵人鍊成 | 共 30 篇文章 | 49 人訂閱 訂閱系列文 RSS系列文 團隊請支援 Coding
DAY 1

Angular 深入淺出三十天:表單與測試 Day01 - 前言

何謂表單? 維基百科是這樣說的: 表單是一種帶有空格可用於書寫以及能選擇和勾選相似內容的文件。 表單可用於填寫聲明、請求、命令、支票、稅單。 網頁...

2021-09-16 ‧ 由 Leo 分享
DAY 2

Angular 深入淺出三十天:表單與測試 Day02 - Template Driven Forms 實作 - 以登入為例

今天要來用 Template Driven Forms 的方式實作一個簡單的登入系統,撇開 UI 不談,具體的功能需求規格如下: 帳號 格式為 Email...

2021-09-17 ‧ 由 Leo 分享
DAY 3

Angular 深入淺出三十天:表單與測試 Day03 - Reactive Forms 實作 - 以登入為例

今天要來用 Reactive Forms 的方式實作一個簡單的登入系統,撇開 UI 不談,具體的功能需求規格跟昨天差不多,如下所示: 帳號 格式為 Ema...

2021-09-18 ‧ 由 Leo 分享
DAY 4

Angular 深入淺出三十天:表單與測試 Day04 - 開始撰寫測試之前必須要知道的二三事

在開始撰寫測試之前,先帶大家來了解一下 Angular 預設使用的測試框架 ─ Karma 。 Karma 的原名是 Testacular , Google...

2021-09-19 ‧ 由 Leo 分享
DAY 5

Angular 深入淺出三十天:表單與測試 Day05 - 如何寫出優秀的測試?

昨天介紹了開始撰寫測試之前必須要知道的二三事之後,想必大家已經對如何開始撰寫測試有了一些概念,但測試不是「有拜有保佑」,有寫就好。所以我們除了要知道如何開始撰...

2021-09-20 ‧ 由 Leo 分享
DAY 6

Angular 深入淺出三十天:表單與測試 Day06 - 單元測試實作 - 登入系統 by Template Driven Forms

今天我們要來為我們用 Template Driven Forms 所撰寫的登入系統寫單元測試,如果還沒有相關程式碼的朋友,趕快前往閱讀第二天的文章: Temp...

2021-09-21 ‧ 由 Leo 分享
DAY 7

Angular 深入淺出三十天:表單與測試 Day07 - 整合測試實作 - 登入系統 by Template Driven Forms

昨天幫我們用 Template Driven Forms 所撰寫的登入系統寫完單元測試之後,今天則是要來為它寫整合測試。 大家還記得整合測試的目標是要測什麼嗎...

2021-09-22 ‧ 由 Leo 分享
DAY 8

Angular 深入淺出三十天:表單與測試 Day08 - 單元測試實作 - 登入系統 by Reactive Forms

今天我們要來為我們用 Reactive Forms 所撰寫的登入系統寫單元測試,如果還沒有相關程式碼的朋友,趕快前往閱讀第三天的文章: Reactive Fo...

2021-09-23 ‧ 由 Leo 分享
DAY 9

Angular 深入淺出三十天:表單與測試 Day09 - 整合測試實作 - 登入系統 by Reactive Forms

昨天幫我們用 Reactive Forms 所撰寫的登入系統寫完單元測試之後,今天則是要來為它寫整合測試。 再次幫大家複習一下整合測試的測試目標: 整合測試...

2021-09-24 ‧ 由 Leo 分享
DAY 10

Angular 深入淺出三十天:表單與測試 Day10 - Template Driven Forms 實作 - 動態表單初體驗

今天要來用 Template Driven Forms 的方式實作一個很簡易的動態表單,使用上有點像是保險業者的系統,可以新增多名被保人,也可以編輯與刪除被保...

2021-09-25 ‧ 由 Leo 分享