storybook Archive

Storybook 3.4 สนับสนุน Polymer แล้ว

ช่วงนี้เครื่องมือใหม่ ๆ ออกมาเยอะเลย หนึ่งในนั้นคือ Storybook 3.4 ซึ่งเป็นเครื่องมือที่มีประโยชน์มาก ๆ สำหรับการพัฒนาและทดสอบ UI component ของ React, React Native, Vue และ Angular ล่าสุดก็สนับสนุน Polymer แล้ว

Read More…

แนะนำ LearnStorybook

วันนี้ไปเจอ LearnStorybook เป็น web สำหรับสอนเกี่ยวกับการใช้งาน Storybook แน่นอนว่าฟรี อีกทั้งเป็นแหล่งความรู้ที่ดีสำหรับการใช้งาน Storybook มาศึกษากันเถอะ

Read More…

Storybook 3.3 สนับสนุน Angular แล้วนะ

หลังจากที่ Storybook 3.2 นั้นสนับสนุน Vue.js ไปแล้ว ถึงคิวของ Angular บ้างสำหรับ Storybook 3.3 (ตอนนี้ไปถึง 3.3.3 แล้ว) แต่ใช้ได้กับ Angular version 4 ขึ้นไปเท่านั้น โดยมีการ addons ต่าง ๆ เพิ่มมานิดหน่อย เช่น Viewport ทำให้สามารถจำลองการทำงานบน device ขนาดต่าง ๆ Jest สำหรับการแสดงผลการทดสอบ Story panel Storyshot ของแต่ละ story สนับสนุน Markdown ใน story ดูเพิ่มเติมได้ที่ Storybook Release

Read More…

มาดูความเปลี่ยนแปลงต่าง ๆ ใน Storybook 3.2.x

สำหรับชาว React และ React Native แล้วนั้น ผมคิดว่าน่าจะใช้ Storybook กันทุกคน !! ในการทำ snapshot testing ของ UI component แต่ละตัว ช่วยทำให้ชีวิตของนักพัฒนาง่ายและสะดวกสบายมากยิ่งขึ้น ยิ่งใน version 3.2 นี้ก็มีความสามารถที่น่าสนใจเพิ่มเข้ามา

Read More…

Part 2 :: มาทดสอบการสร้าง React component ด้วย Storybook กัน

จาก blog เรื่อง Part 1 :: เริ่มต้นเรียนรู้ไปกับ React นั้น มีคำถามต่าง ๆ เกิดขึ้นมาคือ เมื่อเราทำการออกแบบ และ สร้าง Component ต่าง ๆ ขึ้นมาแล้ว จะรู้ได้อย่างไรว่า สิ่งที่เราออกแบบมันดีพอ ? สิ่งที่เราออกแบบมันใช้งานง่ายหรือไม่ ? สิ่งที่เราอออกแบบมันทดสอบได้ง่ายหรือไม่ ? สิ่งที่เราออกแบบทำงานได้อย่างถูกต้องในกรณีต่าง ๆ หรือไม่ ? จะทดสอบและตรวจสอบการทำงานในแต่ละ component อย่างไร ? วันนี้น้องในทีมได้แนะนำ Storybook ซึ่งมันสามารถตอบโจทย์ต่าง ๆ ได้ดีพอสมควร จึงทำการทดลอง และ สรุปการใช้งานไว้นิดหน่อย

Read More…