Storybook for building React apps

3h 16m 25s
English
Paid

You're going to unlock skills that will help you develop UI faster, better, and with great quality. You will understand why it is important to learn Storybook in the context of React development and connect to the concepts of Atomic Design and Component Driven Development.

Read more about the course

You will achieve that by seeing real-life examples of projects from big companies that use Storybook, and discuss the value that Storybook brought to them. Additionally, we will go through the process of installation, setup, development, and documentation with Storybook.

By the end of this course, you will be able to use Storybook to develop and document components, features, and pages at your work.

You'll also learn how Storybook helps you to collaborate with your colleagues, both technical and non-technical (like designers and stakeholders).

This course includes Mealdrop, a real-life example of an application that you will be working on, both for creating a few components and for setting up Storybook on it.

Watch Online Storybook for building React apps

Join premium to watch
Go to premium
# Title Duration
1 Course Introduction 02:03
2 What is Storybook? 05:27
3 The key concepts around Storybook 02:23
4 Installing and exploring Storybook 05:56
5 What makes up a Story? 11:43
6 Decorators 06:30
7 Essential Addons 08:40
8 Theming the Storybook app 04:39
9 Accessing the project 05:09
10 Breaking down our use-case 04:33
11 Writing the atomic components 09:58
12 Adding decorators - theme support 10:42
13 Theme switching with globals and parameters in decorators 06:01
14 Connecting Figma with Storybook 08:33
15 Composing components 07:11
16 Finalizing the feature and integrating it into the app 07:55
17 Data fetching - Container Pattern 05:32
18 Data fetching - Conditional Logic 05:31
19 Data fetching - Mocking Requests 07:46
20 Adding PageTemplate and Redux support to Storybook 09:53
21 Adding the HomePage to Storybook 04:13
22 Adding the Restaurant detail page - Deeplinking and React portals 09:51
23 Adding the Restaurant detail page - mocking different scenarios with MSW 03:01
24 Storybook ESLint plugin 02:05
25 Interaction testing 11:11
26 Storybook test runner 03:31
27 Accessibility testing 07:49
28 Deploying your Storybook with Chromatic 09:49
29 Visual regression in Chromatic 07:42
30 Conclusion and extra resources 01:08

Similar courses to Storybook for building React apps

Doctor Appointment Booking App with React ,Firebase , ANT D

Doctor Appointment Booking App with React ,Firebase , ANT Dudemy

Category: React.js
Duration 5 hours 45 minutes 20 seconds
MERN Stack From Scratch

MERN Stack From ScratchBrad Traversy

Category: React.js, Node.js, MongoDB
Duration 13 hours 32 minutes 38 seconds
Server Side Rendering with React and Redux

Server Side Rendering with React and ReduxudemyStephen Grider

Category: React.js, Redux
Duration 8 hours 14 minutes 30 seconds
Fullstack ASP.NET Core and React Masterclass | Learnify

Fullstack ASP.NET Core and React Masterclass | Learnify fullstack.io

Category: React.js, C Sharp (C#)
Duration 20 hours 40 minutes 31 seconds
Next.JS with Sanity CMS - Serverless Blog App (w/ Vercel)

Next.JS with Sanity CMS - Serverless Blog App (w/ Vercel)udemy

Category: React.js, Next.js
Duration 13 hours 5 minutes 9 seconds
React Router v4

React Router v4ui.dev (ex. Tyler McGinnis)

Category: React.js
Duration 6 hours 44 minutes 1 second
React - The full course

React - The full coursefireship.io

Category: React.js
Duration 1 hour 20 minutes 10 seconds
Intro to Shopify App Development with React, Node & GraphQL

Intro to Shopify App Development with React, Node & GraphQLudemy

Category: React.js
Duration 4 hours 10 seconds
Modern React with Redux [2023 Update]

Modern React with Redux [2023 Update]udemyStephen Grider

Category: React.js, Redux
Duration 37 hours 44 minutes 46 seconds
The React practice course, learn by building projects.

The React practice course, learn by building projects.udemy

Category: React.js, MongoDB
Duration 43 hours 45 minutes 48 seconds