Shared

Overview:

SharedShared is a boilerplate for writing React Libraries bundled with Rollup.js. It includes support for commonJS, ES6 modules, Storybook, Tailwind CSS, and Shadcn/ui. With this project, developers can quickly start developing their own React libraries and easily publish them to NPM or their private registry.

Features:

• Development environment set up with Rollup.js for building React libraries
• Support for commonJS and ES6 modules
• Integration with Storybook to showcase component libraries
• Integration with Tailwind CSS for styling components
• Support for Shadcn/ui for additional design components
• Linting and code formatting with ESLint and Prettier integration
• Testing with Vitest and @testing-library/react

Installation:

To start developing with SharedShared, follow these steps:

1. Clone the repository:

git clone <repository-url>

2. Install dependencies:

cd <repository-folder>
npm install

3. Start the development environment:

npm run start

4. Access Storybook in your browser:

http://localhost:6060

5. Begin developing your components in the src/components folder and update the src/index.js file accordingly. Don’t forget to provide a <YourComponent>.story.tsx file to showcase your component in Storybook.

6. Customize linting rules by overriding them in the .eslintrc.cjs file.

7. Run tests with the following command:

npm run test

8. To publish your library to NPM or your private registry, make sure you have an active NPM account, correctly set up the .npmrc file, and update the registry URL in the publishConfig section of the package.json file. Then, run:

npm run release

For more customization options, documentation, and deployment instructions, refer to the Storybook documentation.

Summary:

SharedShared is a boilerplate for developing React libraries bundled with Rollup.js. It provides an out-of-the-box development environment with support for commonJS, ES6 modules, Storybook, Tailwind CSS, and Shadcn/ui. With features like linting, testing, and easy publishing to NPM or private registries, SharedShared simplifies the process of creating and showcasing React component libraries.