Course Welcome

Welcome to the Guide to Building a Company Component Library course.

Welcome to the Guide to Building a Company Component Library. This course is a comprehensive guide to creating a private component library using React, TypeScript, Storybook, and GitHub Packages.

I'm Austin Green and I'll be your instructor for this course.

Why this course#

This course will teach you how to create a flexible, private, enterprise-grade component library using React.

Since its introduction in 2013, React has become one of the most used front-end frameworks. Its component-based architecture and flexibility has made it the framework of choice for those needing to share code across multiple teams.

However, the same flexibility that has helped React grow in popularity also creates many challenges when creating shared assets and tooling. Some of the most commonly asked questions include:

  • What components should be shared?

  • How do I choose which dependencies to include in my library?

  • Which component APIs and design patterns allow for the most flexibility?

  • How do I document and build my components?

  • How should I be testing my library?

  • Where do I deploy my components for internal use?

During this course we will create a shareable component library that includes:

  • Identifying sharable components and styling from an existing codebases

  • Creating a new NPM package using TypeScript, ESLint, Prettier, and Storybook

  • Implementing common and advanced shared component patterns

  • Common CSS-in-JS patterns with styled-components

  • Testing components with React Testing Library

  • Creating a tree-shakeable build process with RollupJS

  • Deploying our component library to a private NPM registry using GitHub Actions

After completion of this course, you will have the knowledge you need to create a flexible and maintainable component library that is consumable within your own organization.

Prerequisites#

This course is focused on intermediate to advanced React topics. You don't need to have years of experience for this course, but you should be familiar with React and other basics of front-end development including HTML, CSS, and JavaScript.

About the author#

My name is Austin Green and I'm a software engineer, focused on creating the best shared developer experiences. I come from a full-stack background, but have been focusing on shared front-end components and tooling since 2016. During this time I've worked across many open and closed-source React codebases and have seen common patterns that can make or break the development experience for a library.

For the past three years I've been a core contributor to the open-source Zendesk Garden Design System where I helped create shareable React components.

Find me#

No discussions yet