近期為了熟悉元件 Component 的客製化，便參照「哎呀！不小心刻了一套 React UI 元件庫」一書進行練習。這篇筆記下 Progress Bar 的實踐方法。
[ Repo ]：https://github.com/andy922200/practice-storybook-react
內容
概念
1. 進度條的組成可分為 <Trail> 和 <Track> 兩個元素。<Trail> 為底；<Track> 則是實際上顏色變化、動畫…等發生的地方
2. 數值雖可以跳脫 0 ~ 100 % 的範圍，但 <Track> 必須限制下來，以免圖案怪怪的
3. <Track> 留下清晰的 class 名稱，讓自定義的顏色樣式(像是漸層)可以傳入
4. 光暈移動動畫可以用偽元素 :before 製作，超出的話用 overflow:hidden 藏起來
程式碼
相關文章
★全文分享★ [筆記] 哎呀！不小心刻了一套 React UI 元件庫 30 – 佈署發佈
近期為了熟悉元件 Component 的客製化，便
★全文分享★ [筆記] 哎呀！不小心刻了一套 React UI 元件庫 29 – Toast
近期為了熟悉元件 Component 的客製化，便
★全文分享★ [筆記] 哎呀！不小心刻了一套 React UI 元件庫 28 – Modal
近期為了熟悉元件 Component 的客製化，便
★全文分享★ [筆記] 哎呀！不小心刻了一套 React UI 元件庫 27 – Progress Circle
近期為了熟悉元件 Component 的客製化，便
★全文分享★ [筆記] 哎呀！不小心刻了一套 React UI 元件庫 25 – Skeleton
近期為了熟悉元件 Component 的客製化，便
★全文分享★ [筆記] 哎呀！不小心刻了一套 React UI 元件庫 24 – Spin
近期為了熟悉元件 Component 的客製化，便
★全文分享★ [筆記] 哎呀！不小心刻了一套 React UI 元件庫 23 – Pagination
近期為了熟悉元件 Component 的客製化，便
★全文分享★ [筆記] 哎呀！不小心刻了一套 React UI 元件庫 22 – Tabs
近期為了熟悉元件 Component 的客製化，便
★全文分享★ [筆記] 哎呀！不小心刻了一套 React UI 元件庫 21 – Drawer
近期為了熟悉元件 Component 的客製化，便
★全文分享★ [筆記] 哎呀！不小心刻了一套 React UI 元件庫 20 – Select
近期為了熟悉元件 Component 的客製化，便
