Ignite Lab | Project | Technologies | Layout | How to use | How to contribute | License | Storybook live demo

A 100% online, free and hands-on event focused on the front-end, for those who enjoy React and want to specialize even more in this awesome library.

• Stage 1: Base Building - ✔️
  • Starting Design System on Figma.
• Stage 2: Coding - ✔️
  • Creating React components and configuring Storybook.
• Stage 3: Deploy - ✔️
  • Configuring CI/CD with Github Actions and deploying Storybook on Github Pages.

Creating my first Design System with accessible and reusable components, using Composition and Polymorphism pattern.

This project was developed with the following technologies:

• TypeScript
• Node.js
• React
• Vite.js
• Storybook
• Stitches
• Radix
• Jest
• MSW (Mock Service Worker)

To access the layout use Figma.

To clone and run this application, you'll need Git, Node.js + Yarn installed on your computer.

From your command line:

# Clone this repository
$ git clone https://github.com/fellipeutaka/iglab-design-system

# Install dependencies
$ yarn

# Start server
$ yarn dev

# running on port 5173

# Clone this repository
$ git clone https://github.com/fellipeutaka/iglab-design-system

# Install dependencies
$ yarn

# Start storybook
$ yarn storybook

# running on port 6006

1. Fork this repository.
2. Create a branch: git checkout -b <branch_name>.
3. Make your changes and commit them: git commit -m '<commit_message>'
4. Push to original branch: git push origin <project_name> / <local>
5. Create the pull request.

Or, see the GitHub documentation on how to create a pull request.

This project is under the MIT license. See the LICENSE for details.

Made with ♥ by Fellipe Utaka 👋 Get in touch!