維基百科是這樣說的：
表單是一種帶有空格可用於書寫以及能選擇和勾選相似內容的文件。
表單可用於填寫聲明、請求、命令、支票、稅單。
網頁表單可以將使用者輸入的資料，傳送到伺服器進行處理。因為網際網路的使用者會操作核取方塊、無線電鈕或文字欄位來填寫網頁上的表格，所以網頁表單的形式類似檔案或資料庫。
網頁表單可應用線上上的電子商務：以信用卡訂購產品、要求貨運，或可用於檢索資料（例如，搜尋引擎上搜尋）。
自古以來，表單一直都是各大商業系統裡舉足輕重的一部分，舉凡會員註冊、商品寄送、稅務申請、市場調查等，各式各樣大大小小的表單連結你我的生活，其中更甚者，光以表單這個服務就是足以讓一間公司賴以為生。
在 Angular 裡，製作表單的方法主要分成以下兩種方式：
Template Driven Forms 的方式很接近前端原始寫法，資料的驗證與限制都是使用 HTML 原生的表單機制，只是再額外加上 Angular 的資料綁定機制與範本語法來處理，只要知道有 HTML 與 Angular 的基礎即可使用，淺顯易懂、學習成本低，對前端新手來說較為簡單且熟悉。
但隨著表單的複雜度增加，後續維護難度也會越來越高，且不易於測試與重用性較差，所以一般用於較為簡單的情境。
Reactive Forms 的方式是直接用資料來創建與操作表單，較為抽象且需要對 RxJS 有基本的認知，有很多相對程式新手來說較困難、較不習慣的觀念要熟悉，學習成本較高。
但因其擴充性、重用性與可測試性都很好，且就算表單的複雜度增加，後續維護的難易度也不會多高，如果表單功能是你的應用程式裡很關鍵、重要的一塊，抑或是需要處理較為複雜、動態處理的表單，那麼我相當推薦使用此方式。
測試，是軟體工程裡很重要的一環，簡單地說就是用程式來驗證程式/系統/軟體的實際執行結果是否與預期執行結果相符。
試想，我們平常在開發功能時，如何知道我們所寫出來的程式其運作結果符合我們心中所想、符合功能需求抑或者使用者需求？
我猜想，大部分開發者的流程應該是這樣：
這樣的開發流程當然沒什麼太大的問題，不過俗話說得好：「人非聖賢，孰能無過。」，我們自己在測試時，非常容易就會因為各種無心、有心的關係，漏掉一些測試的案例；又或者跟別人開發時，我們不能保證別人都跟我們一樣在寫完程式之後都會乖乖測試，所以常常會造成改 A 壞 B ，甚至會有不符合需求的情況。
那如果我們將測試的步驟交給電腦來幫我們做會怎麼樣？
我的程式啟蒙老師說過一句話：「電腦很聽話，你讓它往東它不會往西，如果程式碼有錯就一定是你的錯，不會是電腦的錯」，所以如果把測試這件事情讓電腦來做，你有幾個案例它就會測幾個案例，你要它測幾遍他就測幾遍，而且執行起來的速度比我們手動還要快太多太多，一旦有錯馬上就會知道，如此一來，就不會發生改 A 壞 B 的情況，使我們的程式碼品質變得更好。
關於前端的測試類型，我個人認為主要有以下三種：
測試單個類別的 function 其執行結果是否符合我們的預期。
測試兩個以上的類別實體之間的互動是否符合我們的預期。
模擬使用者的操作行為來測試一個完整的 story ，驗證其是否符合我們的預期。
想知道更多細節的話，可以參考保哥的文章：一次搞懂單元測試、整合測試、端對端測試之間的差異
我有幸參與過一些系統的製作，因此對於如何在 Angular 製作表單還算小有心得，雖然官網已經有相關的文件，網路上的資源更是多不勝數，但系統性地學習表單製作的文章與課程相對較少，再加上一般程式初學者對於 「測試」 這件事情普遍都只是 「聽說」 ，可能連看都沒看過，更不用提實作了。正好我也在這個部分小有研究，也慣於撰寫測試甚至樂於推廣，所以我會在這個系列文裡把這兩個單元結合，希望可以幫到大家。
需要注意的是，本系列文不適合完全不會 Angular 的朋友，如果是您是初學者、抑或是想學習 Angular 的朋友，可以先看看我的 Angular 深入淺出三十天，直到對於 Angular 的資料綁訂機制與範本語法有相當程度地了解之後，再來閱讀此系列文會比較好。
本系列文將從 Angular 裡最簡單的表單製作方式開始分享，章節安排具體會分成三個階段：
此階段我會個別使用 Template Driven Forms 與 Reactive Forms 來分別實作靜態與動態的兩種表單，並且為這兩種表單撰寫單元測試與整合測試，最後再從幾個面向來比較這兩種開發表單的方式的優缺。
這個階段會有較大量的實作，主要是為希望大家能透過實作來了解並深刻體會這兩種表單開發方式的優缺，同時也能了解並熟悉撰寫測試的方式，篇幅大約是整個鐵人賽的一半左右。
此階段我會介紹一些 E2E 自動化測試工具，並著重在於 Cypress 這個自動化測試工具上，並且使用它來為我們在第一個階段所撰寫的表單來撰寫 E2E 測試。
經過了前面的大量實作，這階段的篇幅不會太長，因為很多測試觀念上的分享在第一個階段就已經分享給大家，這階段主要是讓大家了解並熟悉 Cypress 與 E2E 測試的開發。
最後一個階段主要會分享一些進階的 Reactive Forms 表單開發技巧、進階的測試撰寫技巧等較為進階的分享，希望對大家能夠有更進一步的幫助。
這次我是跟朋友一起組隊參賽的，透過團隊的壓力更能督促我自己一定要順利完賽（壓力山大），如果以下這些文章對你有幫助，也希望大家可以花點時間閱讀：
特別友情貴賓 VVVVVIP 熱情強力推薦：
iThome鐵人賽
看影片追技術