/design-systems-cli

A CLI toolbox for creating design systems.

Primary LanguageTypeScriptMIT LicenseMIT

A CLI toolbox for creating design systems in minutes

Uses: Typescript, CSS, styled-components support

Outputs: CJS and MJS

No tooling configuration required

CircleCI npm npm Auto Release

Overview

Design-systems-cli is basically a Create React App for design systems.

The main benefit it brings you as a developer is time savings. Setting up all of the monorepo, storybook, and build tools for a design system takes over a week if you piece it together yourself. You can do it with this project in minutes.

Features

⭐ Scaffold components and entire design systems

⭐ Build your components for multiple outputs (cjs and esm)

⭐ Write styles with styled-components or css-modules

⭐ Craft excellent components using Storybook

⭐ Let component consumer try your components with playroom

⭐ Testing and linting support

⭐ Typescript supported out of the box

⭐ Track the size of your components and debug the changes

For the full documentation, go here.

Installation

Ensure you have the following softwares installed:

If node-gyp throws errors during installation, installation may still be successful

To get started:

To get set up, fork and clone the project then run the following command:

yarn && yarn start

Creating a new Plugin

To scaffold a new plugin inside this repo run the following command:

yarn run create:plugin "my plugin"

Contributing

Feel free to open an issue or a pull request!

Make sure to read our code of conduct.

We actively welcome pull requests. Learn how to contribute.

Contributors ✨

Thank you to all these wonderful people (emoji key):


Adam Dierkens

💻 🎨 🤔 📖 ⚠️

Andrew Lisowski

💻 🎨 📖 🤔 🚇 ⚠️

Tyler Krupicka

💻 📖 ⚠️

Kendall Gassner

💻 📖 ⚠️

Kelly Harrop

🎨

Peter Mikitsh

📖

WhiteSource Renovate

💻 ⚠️

mishavp2001

💻

Raj Vasikarla

💻 📖 ⚠️

Brandon Orther

📖 💻

alan-cruz2

💻

hainessss

💻

Athitya Kumar

💻

Jason Rundell (he/him)

📖 ⚠️ 💻

Reuben

📖

my99N

📖 ⚠️ 💻

anjaliguptaz

📖

chaopan

⚠️

Talor Anderson

💻 📖 ⚠️

Spencer Hamm

💻 📖 ⚠️

Adil Malik

⚠️

Salil Cuncoliencar

📖 ⚠️ 💻

Gaurav Kesarwani

📖 ⚠️ 💻

Nicolas Hoizey

📖

Harris Borawski

💻

Sean Powell

💻

melindali255

📖 ⚠️ 💻

Yucho Ho

💻

Jeremiah Zucker

⚠️

Abd El-Ghazali

📖 💻

This project follows the all-contributors specification. Contributions of any kind welcome!