Bem-vindo ao repositório de código-fonte do Design System do Hambre Delivery, neste projeto estão documentados os componentes React e ferramentas que ajudaram desde a implementação do Design System até a publicação, como Storybook, changesets e muito mais.
- Avatar
- Box
- Button
- Checkbox
- Heading
- Loading
- MessageIcon
- MultiStep
- Radio
- Select
- Switch
- Text
- TextArea
- TextInput
- Toast
- Transition
# 🛠️ Para inicializar o projeto- npm init -y
# 🛠️ instalando o typescript- npm i -D typescript
# 🛠️ para criar o arquivo de configuração tsconfig- npx tsc --init
# 🛠️ converte o projeto em um pacote javascript- npm i tsup -D
# 🛠️ comando para fazer o build do pacote de tokens- npm run build
# 🛠️ instalação do eslint em packages/eslint-config- npm i -D eslint @rockeseat/eslint-config
# 🛠️ comando para executar o eslint no packages/tokens e packages/react- npm run lint
# 🛠️ instalar as libs react e react-dom e packages/react- npm i -D @types/react @types/react-dom
# 🛠️ instalar ferramenta de estilização em packages/react- npm i @stitches/react
# 🛠️ Biblioteca para documentar componentes do frontend em packages/docs- npx -p @storybook/[email protected] sb init --builder @storybook/builder-vite --type react
# 🛠️ Instalação da biblioteca em packages/docs- npm i vite @vitejs/plugin-react -D
# 🛠️ Instalação do react e react-dom em packages/docs- npm i react react-dom
# 🛠️ Permite fazer cálculos com cores em packages/docs- npm i polished
# 🛠️ Biblioteca Permite executar os scripts em todos os pacotes ao mesmo tempo, acelerando o build- npm i turbo@latest -D
# 🛠️ Biblioteca para carregar imagem de avatar em packages/react- npm i @radix-ui/react-avatar
# 🛠️ Biblioteca de ícones em packages/react- npm i phosphor-react
# 🛠️ Biblioteca de ícones em packages/docs- npm i phosphor-react
# 🛠️ Biblioteca para componente de checkbox em packages/react- npm i @radix-ui/react-checkbox
# 🛠️ Biblioteca para acessibilidade em packages/docs- npm i @storybook/addon-a11y
# 🛠️ Biblioteca para utilizar o toast em packages/react- npm i @radix-ui/react-toast
# 🛠️ Biblioteca para utilizar o switch em packages/react- npm i @radix-ui/react-switch
# 🛠️ Biblioteca para utilizar o radio em packages/react- npm i @radix-ui/react-radio-group
# 🛠️ Biblioteca para utilizar AlertDialog em packages/react- npm i @radix-ui/react-alert-dialog
# 🛠️ Biblioteca para utilizar select em packages/react- npm i @radix-ui/react-select
# 🛠️ Biblioteca para faze o deploy em packages/docs- npm i @storybook/storybook-deployer --save-dev
# 🛠️ Biblioteca para gerenciar o versionamentos dos pacotes- npm i @changesets/cli -D
# 🛠️ Comando para inicializar o changesets- npx changeset init
# 🛠️ Executar esse comando para validar no npm, qualquer atualização no repositório- npm run changeset
# 🛠️ Executar o comando para mudar a versão no caso de uma alteração- npm run version-packages
# 🛠️ Executar o comando para fazer o deploy no npm- npm run release
Feito com ♥ by Laciene Melo 👋 #lacymelo
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent