Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/jerp86/05-design-system
https://github.com/jerp86/05-design-system
eslint phosphor-react polished radix-ui react-component stitches storybook tokens ts-config tsup turborepo workspaces
Last synced: 24 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/jerp86/05-design-system
- Owner: jerp86
- License: mit
- Created: 2023-02-16T18:57:26.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2023-10-28T02:34:01.000Z (over 1 year ago)
- Last Synced: 2024-11-17T12:49:50.556Z (3 months ago)
- Topics: eslint, phosphor-react, polished, radix-ui, react-component, stitches, storybook, tokens, ts-config, tsup, turborepo, workspaces
- Language: TypeScript
- Homepage: https://jerp86.github.io/05-design-system
- Size: 5.42 MB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Ignite UI
>
---
Sobre |
Tecnologias |
Figma |
Fontes |
Executar |
Licença
---
## :information_source: Sobre
Nesse módulo foi construido um Design System, entendido como documentar os componentes do React e descoberto diversas ferramentas que nos ajudam desde a implementação do Design System até sua publicação, como Storybook, changesets e muito mais.
O Design System construído, pode ser avaliado e testado [clicando aqui](https://jerp86.github.io/05-design-system).
### Componentes Desenvolvidos
- [X] Avatar
- [X] Box
- [X] Button
- [X] Heading
- [X] Checkbox
- [X] MultiStep
- [X] Text
- [X] TextInput
- [X] Textarea
- [X] Toast
- [X] Tooltip
## :rocket: Tecnologias Utilizadas
- [ESLint](https://eslint.org/)
- [Phosphor](https://phosphoricons.com/)
- [Polished](https://polished.js.org/)
- [Radix-UI](https://www.radix-ui.com/)
- [React](https://reactjs.org/)
- [Stitches](https://stitches.dev/)
- [Storybook](https://storybook.js.org/)
- [tsup](https://tsup.egoist.dev/)
- [TypeScript](https://www.typescriptlang.org/)
- [Vite](https://vitejs.dev/)
- [@rocketseat/eslint-config](https://github.com/rocketseat/eslint-config-rocketseat#readme)
- [@storybook/addon-a11y](https://storybook.js.org/addons/@storybook/addon-a11y)
## :art: Layout no Figma
Para essa aplicação foi fornecido um layout para que fosse possível seguir e implementar todas as funcionalidades desenhadas no #Figma.
[Figma - Ignite Call](https://www.figma.com/community/file/1161274296921389678)
## :abc: Fontes utilizadas
- [Roboto](https://fonts.google.com/specimen/Roboto)
## :zap: Como executar
- Clone o projeto:
```
git clone https://github.com/jerp86/05-design-system.git
```
- Acesse a pasta clonada:
```
cd 05-design-system
```
- Instale as dependências:
```
npm ci
```
- Inicie o projeto:
```
npm run dev
```
## :memo: Licença
Esse projeto está sob a licença MIT. Veja o arquivo [LICENSE](LICENSE) para mais detalhes.
---
Feito por Jerp86 👋️
Entre em contato!
