Conheça o Storybook, a ferramenta gratuita mais popular para desenvolver, testar e documentar os seus componentes de forma fácil, rápida e profissional. Ele pode ser usado com diversas ferramentas orientadas a componentes baseadas em Javascript como React, React Native, Angular, Vue e Svelte. Chega de ter que rodar o projeto inteiro e editar várias partes para refletir no componente que você está tentando criar. Com Storybook, você constrói cada componente isoladadamente, usando uma poderosa interface gráfica que simplifica o desenvolvimento.
No workshop, iremos conhecer o Storybook, instalá-lo em uma aplicação React e utilizar as suas principais funcionalidades. Vamos aprender na prática como criar, documentar e testar componentes da melhor forma. Obs: Para melhor acompanhamento desse workshop, é recomendado ter conhecimento em desenvolvimento frontend com React, Git, Github.
React com create-react-app
CSS com @chakra-ui/react
Formulário com react-hook-form e yup
Qualidade e estilo de cógido com eslint e prettier
Clone o projeto
Entre na pasta do projeto
Na pasta raiz do projeto, instale todas as dependências ao rodar
Se quiser iniciar o projeto, dê o comando
Abra http://localhost:3000 para ver no navegador
Se quiser iniciar o Storybook, dê o comando
Abra http://localhost:6006 para ver no navegador