鐵人檔案
我們來嘗試維護一套自己的 UI Library 吧！
也許你不一定認同我的看法，但我認為，身為一個優秀的前端工程師，即使沒有自己手刻一套 UI Library 的打算，也應該要了解每個元件應該怎麼實現，應該涵蓋哪些功能，有哪些細節是我們需要特別留意的。花點時間深入理解每個元件的運作原理，對於如何善用 UI Library 也會有更深刻的體悟。
在一個專案當中，標單數入元件通常會有統一的外觀風格，讓整個系統看起來更一致、整齊。<AtomicFormField> 是用來渲染表單欄位的元件。它...
<input> 作為表單控制元素，是網頁開發中最常見的元素之一。<input> 的不同 type 設定會影響顯示的 UI，以及它所代表...
<textarea> 與 <input type="text"> 有需多相似之處，甚至大多數的特性都是共通的，例如...
下拉選單（Select）在表單操作中非常常見。使用下拉選單可以在有限的空間內顯示大量選項，透過點擊來展開選單，使用者可以輕鬆瀏覽並選擇其中一個或多個選項。無論...
Checkbox 是一個常見的網頁元件，單個使用時可以表示在兩種狀態之間切換，多個一起使用時則允許使用者在這些選項中選擇一個或多個。它適合用於問卷調查、偏好設...
開關（Switch）是用來表示 on 或 off 狀態的元件。它與 Checkbox 相似，但不同於 Checkbox 允許實現第三種中間狀態的選項，Swit...
Radio 是一種表單控制元件，通常用於使用者在一組選項中選取一個。在 UI 呈現上，通常顯示為圓形按鈕，當用戶選中時，按鈕會顯示填滿狀態，表示該選項已被選中...
Rating 元件讓使用者可以對某項目進行評分，通常以星星或其他符號來表示評分等級。Rating 元件的核心功能是提供一種直觀的方式，讓使用者針對產品、服務或...
在這個系列中，我們一共實作了約 27 種不同的 Atomic Components。但在實際開發上，我們不總是只需要顧好 Client Side Render...
這段時間真的是一段漫長的旅程。這是一個用盡全力想要塞入所有資訊的系列，回頭看某些元件，儘管我一開始就預期這些元件需要處理的功能非常多，最終的篇幅還是讓我有點驚...
