Alume Design System

Compose of React components displayed at Storybook for Alume company

Storybook

Storybook is the tool we use to visualize the components. For more information, go to the Storybook introdutory page.

Start local page

You can run the local Storybook, after using yarn to install or update the dependencies: yarn start:storybook It will show the canvas and selected component in it.

Publish a new version

You can build and publish both site and package with separated commands or it all together.

Publish both site and package

Most of the times you will modify both stories and components. If so, you can publish both with the same command: yarn publish:all It will ask for a new version number.

Publish just the package

You would like to publish just the package when no modifications where made to the stories. To publish a new package version just run: yarn publish:package It will ask for a new version number.

Publish just the site

If you modified just the stories you can publish just the site. To publish the site just run: yarn publish:site

ESLint and Prettier

ESLint search for erros in the code and Prettier modify files to use good code practices. We also use Husky and Lint-Staged to clean the code in pre-commit, but you can run both tools mannualy. You can run yarn lint to search for erros and yarn lint:fix to fix every error that can be fixed automaticaly. You can run yarn format so Prettier will format every .ts and .tsx file inside the src directory.