+
+
+
+
+
+
+
+
+ + Acme +
+ + +
+
+
+ + Pages in Storybook +
+ + ++ + We recommend building UIs with a + + + + + + component-driven + + + + + + process starting with atomic components and ending with pages. + +
+ + ++ + Render pages with mock data. This makes it easy to build and review page states without + needing to navigate to them in your app. Here are some handy patterns for managing page data + in Storybook: + +
+ + +-
+
+
+
- + + Use a higher-level connected component. Storybook helps you compose such data from the + "args" of child component stories + + + + +
- + + Assemble data in the page component from your services. You can mock these services out + using Storybook. + + + + +
+ + Get a guided tutorial on component-driven development at + + + + Learn Storybook + + + + . Read more in the + + + docs + + + . + +
+ + +
+
+
+
+ Tip
+
+
+ Adjust the width of the canvas with the
+
+
+
+ Viewports addon in the toolbar
+
+
+
+
+