Skip to content

Hey! If you’re here, you want to learn how to apply the composition pattern in React. You’re in the right place!

Notifications You must be signed in to change notification settings

BelkaLab/how-to-create-a-composable-component-with-react

Repository files navigation

Belka logo

How to create a composable component with React

👋 Hey! If you’re here, you want to learn how to apply the composition pattern in React. You’re in the right place!

As projects grow, UI components often become large and difficult to manage. This can lead to complex, hard-to-update code that slows down development.

Compound and composable components offer a solution. By breaking down a UI into smaller, reusable parts, you can keep your code more flexible and easier to maintain. Composable components are made of self-contained subcomponents that you can mix and match as needed, while compound components group subcomponents that work together but need each other to function.

This approach helps you avoid rewriting large sections of code and makes it easier to manage new design requests and updates.

Take a look to the article to learn more

👉 https://www.belkadigital.com/blog/how-to-make-your-life-easier-and-your-code-cleaner-by-using-composable-components

Project setup

To get started with the project, follow these steps:

  1. Clone the repository:

    SSH

    git clone [email protected]:BelkaLab/how-to-create-a-composable-component-with-react.git

    or

    HTTPS

    git clone https://github.com/BelkaLab/how-to-create-a-composable-component-with-react.git
  2. Install dependencies:

    yarn
  3. Start Storybook:

    yarn storybook

Additional resources

About

Hey! If you’re here, you want to learn how to apply the composition pattern in React. You’re in the right place!

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published