系列文章
玩轉 Storybook: Day 11 Simple component - Vue
在這個單元我們使用官網的教學搭配Vue的框架，STEP BY STEP的撰寫Component及Stories。 Setup Vue Storybook 官網教...
玩轉 Storybook: Day 12 Composite component - Vue
接下來就來把Task元件組裝成TaskList吧 TaskList 可以把TaskList規劃成四種狀態 Default - 當 Task 都是 defu...
玩轉 Storybook: Day 13 Simple and Composite - Angular
在這個單元我們使用官網的教學搭配Angular的框架，STEP BY STEP的撰寫Component及Stories。(如果是使用Vue的讀者，可以跳過這個單...
玩轉 Storybook: Day 14 Addons - Essential / Actions
Storybook的另一個主要的功能就是Addons 在使用Storybook做元件開發設計時搭配Addon功能更加強大 接下來就來好好體驗感受他的威力吧 寫在...
玩轉 Storybook: Day 15 Addons - Controls
Controls Addon 提供 Storybook 一個視覺化動態設定元件參數的方式，這樣就不需要寫程式重啟，也能發現元件的變化。 要使用 Control...
玩轉 Storybook: Day 16 Addons - Viewport/Accessibility
Viewport https://storybook.js.org/docs/vue/essentials/viewport Viewport 也是預設安裝好的...
玩轉 Storybook: Day 17 Unit Test with JEST
用 Storybook 搭配測試方法，從元件開發到完成整個專案，可以增加開發者的信心，不會擔心改A錯B的狀況發生，因為從邏輯面及UI面都能被完整的測試到。 單元...
玩轉 Storybook: Day 18 Automated Visual Testing
視覺回溯測試 做視覺回溯測試的目的是要檢查每次修改元件UI的變化，當專案越來越大時，或是接近上線時期，修改元件的部分，有時會影響到整個專案。人工去檢視一定會有疏...
玩轉 Storybook: Day 19 Wire in data - Vue & Vuex
Container and Presentational 官網的程式碼架構，會把元件分成二種類型-容器型(Container)及表現型(Presentation...
玩轉 Storybook: Day 20 Construct a screen - Vue
在前面的單元，我們已經完成了開發單一元件Task，也完成了複合元件 TaskList，也把 TaskList 拆分為容器型(TaskList.vue) 及 表現...