Go to Preview Lesson
Go to Preview Lesson
LESSON 1.1
Course Welcome
LESSON 1.2
An Intro to Component Libraries and Design Systems
The newline Guide to Building a Company Component Library
MODULE 1
Introduction
LESSON 1.1
Course Welcome
LESSON 1.2
An Intro to Component Libraries and Design Systems
LESSON 1.3
Syllabus
LESSON 1.4
Environment setup
MODULE 2
Shared components
LESSON 2.1
Which React Components to Build? An Atomic Design Guide
LESSON 2.2
Which UI Elements Should be Turned Into React Components?
LESSON 2.3
Choose React Dependencies for a Maintainable Component Library
MODULE 3
Library creation
LESSON 3.1
How to Host an NPM Package in GitHub for Free
LESSON 3.2
How to Add Storybook to React to Test Component Library Locally
LESSON 3.3
How to Keep React Code Consistent With Prettier and ESLint
MODULE 4
Shared component patterns
LESSON 4.1
Build a Custom React Button Component With forwardRef API
LESSON 4.2
Build a Custom Design System With React Styled Components
LESSON 4.3
Validate React Props With PropTypes and TypeScript
MODULE 5
Advanced patterns
LESSON 5.1
How to Design Compound Components With React Context
LESSON 5.2
How to Design Custom React Field Components With useUniqueID
LESSON 5.3
How to Extend Styled Component Styles With New Style Props
MODULE 6
Component testing
LESSON 6.1
How to Test React Component Libraries With ts-jest
LESSON 6.2
How to Build Tests For React Button Components
LESSON 6.3
How to Build Accessibility Tests For React Field Components
MODULE 7
Build process
LESSON 7.1
The Best Ways to Bundle React Modules Into Packages
MODULE 8
Deployment and automation
LESSON 8.1
Setting Up Continuous Integration for a React Component Library With GitHub Actions
Go to Next Lesson
Go to Next Lesson
LESSON 1.3
Syllabus
Go Pro