系列文章
玩轉 Storybook: Day 01 說明
Intro 想做這個主題是因為，在翻閱過去的鐵人賽，「單純」只討論 Storybook 的文章並不多，雖然它的基本觀念並不難理解。 若有更多人知道及理解這個好用...
玩轉 Storybook: Day 02 安裝
Install Storybook 安裝 Storybook 只需要在Terminal，切換到現有專案的根目錄後，簡單的執行一行指令 npx sb init...
玩轉 Storybook: Day 03 專案結構
前情提要 從開始安裝到完成，檢查專案目錄下變更的檔案結構，會發現Storybook的安裝做了以下的步驟。 安裝需要的相依套件 在Package.json加上建...
玩轉 Storybook: Day 04 Configure
預設放置組態檔案的目錄 Storybook集中放置組態設定檔案的目錄預設是.storybook，若需要變更路徑及名稱，要在Storybook的CLI指令做設定。...
玩轉 Storybook: Day 05 CLI Options
以下列出，啟動或是建置 Storybook 時，有哪些可以使用的 CLI Options。 start-storybook 啟動 Storybook Usage...
玩轉 Storybook: Day 06 Component Story Format
Story檔案放置位置 Component對應的Story檔案，通常會放置在Component檔案旁邊。Story只會用於開發時期，在Production的bu...
玩轉 Storybook: Day 07 Write stories
Template & Args 同一個元件的多個story function，都會重複的指定相同的Template，可以拉出一個共用 template...
玩轉 Storybook: Day 08 Parameters
Parameter Parameter 是用來定義Stories的靜態metadata(解釋資料的資料)，Parameter能提供給不同的addon去做設定。...
玩轉 Storybook: Day 09 Decorators
Decorators Decorator是一種設計模式，把要被裝飾的Story當做參數，傳入裝飾器中，Decorator可以幫Story加上額外的資訊，賦予給S...
玩轉 Storybook: Day 10 Naming components and hierarchy
Naming components 修改一下Story檔案，對應於Component的Title名稱(default export區塊)，就會發現Sidebar...