LAB.md

💻 Lab 10 - Generate Storybook stories for the shared ui component

⏰  Estimated time: 10-15 minutes

Let's explore some more Nx plugins by generating and running a storybook configuration for our shared store header.

📚 Learning outcomes:

• Explore other Nx plugins to create a storybook configuration

📲 After this workshop, you should have:

App Screenshot

No change in how the app looks!

File structure

🏋️‍♀️ Steps:

1. yarn add @nrwl/storybook or npm i -S @nrwl/storybook

2. Use the @nrwl/react:storybook-configuration generator to generate a storybook configuration for the store-ui-shared project

   ⚠️  Answer YES to all questions

3. Serve storybook!

   🐳   Hint

   nx storybook store-ui-shared

   
   

4. Start typing in different titles and see how they appear in the header

   

5. Inspect what changed from the last time you committed, then commit your changes

---

🎓  If you get stuck, check out the solution

---

➡️  Next lab ➡️