React-storybook-archref NPM

UI library using React + Storybook with TypeScript and Jest

This is a boilerplate project for writing React NPM modules (or component libraries) in TypeScript + Storybook.

This boilderplate includes a Storybook to visualize and demonstrate your components.

Features

TypeScript with automatic linting via ESLint + Prettier
Unit testing with Jest + @testing-library/react
Storybook + hot reloading, including the addons Actions, Knobs, Storysource, Notes, Viewport, Console, and Centered.

Usage

Fork or clone this repository
If using VS Code, install recommended extensions
npm install
npm run start:storybook
Create your components
Export your components in index.ts
npm build To build your React components befor deploying to NPM.
npm publish Publish your module.

After puplish

To do...

`npm` Scripts

test - run unit tests
test:cover - run unit tests with test coverage
lint - check eslint and prettier rules
lint:fix - autofix unmet eslint and prettier rules
start:storybook - start the storybook server and automatically open in browser
build - for deployment
build:storybook - run this command to build your storybook
npm publish - run this command to publish your packages to npm

Before each commit, husky and lint-staged will automatically lint your staged ts, tsx, js, jsx files.

Configuration

npm login

Dependabot (optional)

I recommend enabling Dependabot on this repository to keep your dependencies up to date. Each dependency update will be created as a PR, which will automatically validate via Circle CI and you can manually validate via Zeit.

License

This code is released under the MIT license - feel free to use it.

Contribute

Please contribute any improvements or fixes to this project!

To make sure you have a pleasant experience, please read the code of conduct. It outlines core values and beliefs and will make working together a happier experience.