New here? See how enrollment works →
React & Next.jsAdvancedProject-based online course

React Design System

Build a small React design system with tokens, components and Storybook docs.

4 weeks duration~12 learning hours180-day course access4 modules

What you'll learn

  • Define design tokens for color, spacing and type
  • Design component APIs with clear props
  • Document components in Storybook
  • Publish a component package

About this course

You build buttons, inputs, cards and a modal on top of design tokens. You document each component in Storybook and publish the library as a package.

Course curriculum

4 modules and 12 lessons over 4 weeks. Plan for about 12 learning hours.

01TokensWeek 1 · 3 lessons
  1. Color and spacing
  2. Type scale
  3. Theming
02ComponentsWeek 2 · 3 lessons
  1. Button and input
  2. Card
  3. Modal
03DocumentationWeek 3 · 3 lessons
  1. Storybook setup
  2. Stories and controls
  3. Usage notes
04PublishingWeek 4 · 3 lessons
  1. Building the package
  2. Versioning
  3. Using it in an app

Project

Component library. A token-based React component library documented in Storybook and published as a package.

Who this course is for

React developers who build the same components over and over.

Prerequisites

You build React components and know CSS.

What's included

  • 180-day course access
  • Project brief
  • Starter repository
  • Coding labs
  • Reference solutions
  • One written project review
  • A digital completion certificate

Learning format

Project-based online course, part of our guided project courses. One written project review.

Access and delivery

  1. Course access is delivered within 15 minutes after payment.
  2. Written project review is returned within 2 business days of submission.
  3. Completion materials are issued within 2 business days after the project is approved.

Certificate

You receive a digital completion certificate. Completion materials are issued within 2 business days after the project is approved.

Frequently asked questions

When does access start?

Course access is delivered within 15 minutes after payment.

Is payment taken on this website?

No. After you submit your enrollment request, we reply by email with payment details and enrollment confirmation.

Does this course guarantee a job or income?

No. It is an education and training service and does not include employment, income or placement guarantees.

Can I cancel?

Our Refund and Cancellation Policy lists the terms for project-based programs.

Related courses in React

$399