Master The Core Concepts of React and Storybook

Learn to build professional components library using React with Storybook and test them in isolation

4.45 (24 reviews)
Web Development
4 hours
Jul 2022
last update
regular price

What you will learn

Understand React fundamentals

Use React in the Browser and in Node

Build Reusable and Composable React components library

How to use Storybook and React in your project

How to test components with react-testing-library and Storybook

Style Components with TailwindCSS & CSS Modules

Accessibility Testing (a11y)

Visual Regression Testing (VRT)


Create Workflows with Github Actions


A Practical hands-on training to building React components library with Storybook.

In this practical, hands-on course, you will learn how to build a React components library with Storybook. You will start by learning React fundamentals and then move on to creating a whole React components library with Storybook. You will also learn about different types of automated testing for Components, how to test components in isolation and how to write CI/CD pipelines.

It doesn't matter if you're a seasoned React developer or just starting out - this course will help take your skills to the next level. With practical examples based on real-world components, we'll cover everything from building user interfaces with React's simple yet powerful DSLs all the way to properly styling our modules using CSS.

The course is designed in such a way that you will be able to create authentic-looking components for any project, whether it's a web app or Single Page Application (SPA). You'll also get insights into how companies develop and maintain standards using JavaScript-based technologies like React!

This course is perfect for anyone who wants to learn more about React and how to build Component libraries. So, if you're ready to take your React skills to the next level, sign up today!

  • What You Will Learn: You will learn how to build React components using React v17, Class-based components, Functional components, Hooks, JSX, Props , State, Storybook to develop Components, CSS Modules, Component Composition,  Unit Testing, Storybook testing, Testing Accessibility, Visual Regression Testing, CI/CD

  • Why You Should Take This Class: If you are a Frontend developer who wants to learn React or you have used React but want to learn more advanced concepts and how to use React in a production environment to create Web components and how to develop components in isolation with Storybook then you should take this class

  • Who This Class is For: Frontend developers who know the basics of Javascript and CSS

  • Materials/Resources: Javascript & CSS knowledge, Node.js installed, IDE , github account


Master The Core Concepts of React and Storybook - Screenshot_01Master The Core Concepts of React and Storybook - Screenshot_02Master The Core Concepts of React and Storybook - Screenshot_03Master The Core Concepts of React and Storybook - Screenshot_04


React Fundamentals

React Introduction
React in the Browser
JSX perks
Class based Components
Functional Components
Handeling Events
React app using Webpack

React with Storybook

Use create-react-app CLI
Adding Stylesheets
Install Storybook
Storybook intro with Button component
Counter component
React State with useState
Rating component
Accordion Component
useRef() with Accordion


Unit test Button Component
Testing with Storybook
Testing Accessibility (a11y)
Setup Visual Regression Test (VRT)


What CI/CD ?


May 19, 2022
This course is clear and the topics and the examples discussed were practical, also I found the instructor knowledgeable.
May 11, 2022
Helpful course to learn React from zero to expert, explaining the code in such a easy and simple way to understand it.
May 10, 2022
Quality Material and very clear tutorial, the Author was very knowledgeable with React in Storyboard. Highly Recommended.



Master The Core Concepts of React and Storybook - Price chart


Master The Core Concepts of React and Storybook - Ratings chart

Enrollment distribution

Master The Core Concepts of React and Storybook - Distribution chart

Related Topics

udemy ID
course created date
course indexed date
course submited by