TypeScript React Component Library

This library is published on npm and demonstrates how to write your own React components in TypeScript and publish them as npm package.

Features

• [x] React components written in TypeScript
• [x] Leverages TSDX to create library
• [x] Use of styled-components for styling
• [x] Connected with Storybook
• [x] Integrated tests with Jest and Testing Library
• [x] Linting support using Prettier
• [x] Integrated Continuous Integration (CI) using GitHub Actions
• [x] Integrated Continuous Deployment (CD) to using Github Actions
• [x] Uses Semantic Release for releasing the library
• [x] Publishes to npm
• [x] Publishes Storybook to Chromatic

🤖 Dev Commands

• yarn install to install the necessary dependencies
• yarn start to start developing your components
• yarn test to test your components
• yarn lint to lint your code
• yarn lint --fix to fix linting issues in your code
• yarn prepare to create the production bundle
• yarn storybook to start storybook in development mode (starts as a new process)
• yarn build-storybook to create production version of storybook for the project. This can be deployment to platforms such as Vercel, Gatsby, Surge, or Firebase hosting
• yarn size tells you size of your library for the production bundle

🚀 Publishing the project to NPM

• npm version patch bump up package version
• npm publish to publish to npm as private package

📦 Full Component list & functionality TBC...

• Button
• String
• Card
• Form
  • Text input
  • Custom checkbox input
  • Custom file upload input
  • Custom select input
• Accordion
• Carousel
• Header component
• Modal component