Development

💻 Local Development

Please git clone the okp4/ui project, then:

$ yarn      # install all dependencies
$ yarn dev  # launch the app

Finally, you can visit the app http://localhost:6006/.

🧬 Atomic Design Methodology

The OKP4 Design System follows the Atomic Design Methodology.

It is important to fully understand its principles in order to build components adapted to our design system: you can learn more here.

🌳 Folders Tree

The files are separated into two parts:

• a ui part which contains the code of the react components
• a stories part which contains the description related to each component created in UI

.
├── src
│   ├── adapters
│   ├── assets      # icons/images/logos for components   
│   ├── domain
│   ├── event
│   ├── hook
│   ├── i18n
│   └── ui
└── stories.        # storybook code
    ├── assets.     # icons/images/logos for stories
    ├── atoms
    ├── molecules
    ├── templates
    └── pages