Overview:

The @nice-boys/components is a React component library designed to quickly assemble products. It is used in conjunction with the product-boilerplate. The library is based on styled-components, styled-system, and rebass. It is recommended to use it with rebass, as it does not re-export the core primitives such as Flex and Box.

Features:

• React Component Library: Easily plug together components to create products.
• Based on styled-components: Leverages the power of styled-components for styling.
• Based on styled-system: Utilizes styled-system for building responsive and themeable components.
• Recommended usage with rebass: Works seamlessly with rebass for enhanced functionality.

Installation:

Follow these steps to install and use @nice-boys/components in your app:

1. Link @nice-boys/components globally: Run yarn link in the @nice-boys/components directory to link the package globally (you only need to do this once on your machine).
2. Specify your app to use the local version of @nice-boys/components: Run yarn link @nice-boys/components in your app directory that depends on the package (you only need to do this once per app).
3. Rebuild the components on any change: Run yarn run build:watch in the components directory to ensure the library rebuilds every time you make a change/add/remove a component.

That’s it! Now you can use the @nice-boys/components library in your app for development. If you want to use the remote version of the library again, simply run yarn unlink @nice-boys/components in the app directory.

Summary:

The @nice-boys/components is a React component library that allows users to quickly assemble products using pre-built components. It is based on styled-components, styled-system, and rebass. The library provides easy installation and usage instructions, making it convenient to integrate into new or existing projects. With its recommended usage with rebass, developers can leverage the library’s powerful functionality for enhanced UI design. Overall, @nice-boys/components is a valuable tool for React developers looking to accelerate their product development process.