kdan-ui-revamp

Kdan UI

The Setup

• React v18
• TypeScript
• StyledComponent for css styling
• UI development with Storybook
• Unit test with Testing-library
• Build the library with Rollup
• Automated release with changesets

Development

• Build the library:

  yarn build
  

• Run storybook:

  yarn storybook
  

• Unit test component with:

  yarn test
  

• Create changeset:

  yarn changeset
  

Release & Publish package

This boilerplate uses changesets to automatically generate CHANGELOG, create releases and publish to NPM registry via GitHub Actions. You can see action details at release.yml.

To automating publish your library, follow these steps:

• Create a NPM_TOKEN. See this article for more details. Make sure the type of access token is Automation.

• Follow this instruction to add the created token to your GitHub Actions secrets. Name of the secret is NPM_TOKEN.

• Install changeset bot.

P/S: Remember to check the Allow GitHub Actions to create and approve pull requests in your repo Settings > Actions > General & scroll to Workflow permissions.