Install for development

Requirements :

• node v20+
• yarn

To install node:

Please follow this guide

To install yarn :

Development :

Note about the project architecture

The project uses a monorepo architecture using lerna. Lerna help us to manage the distribution and the versioning of multiple packages into the same repository. It also create symlink between the individual packages nodes_modules so they can be used in one another as npm dependencies.

When releasing the design system, lerna will automatically generate changelogs for the global/parent repo, as well as for the individual packages and select a version number based on the commit syntax. It's why it is very important that you follow the contributing guidelines.

Please read the docs to learn more about it.

Clone the repo and start the development environment

Clone the repo :

Move to the repo:

Install dependencies and create symlink between packages:

Add a github personal access tokens : follow those instruction and select repo as a scope for you personal access token. Copy your token in your clipboard

Create a .env file at the root of the project and add the following (replacing XXX by your token):

Lunch the dev server:

Targeting compilation of selected previews directory

Compiling previews take a long time, and most of the time you need only to compile the previews you are working on.

To target only previews contained in a directory, add a preview parameter to the develop command containing a path relative to src/pages/:

Lint and fix your css files using stylelint

Please note that stylelint is not able to fix everything, so run

and make the required changes.

stylelint fix and lint are run at pre-commit, so you can't commit ugly stuffs ;).

Create a production build :

CI/CD

If you want more explanation, please go to the related wiki page.

Deploy

Each branch is deployed when creating a Pull Request. A view deployment button is displayed into the Pull Request's timeline at the bottom.