Summary
Keywords
Full Transcript
Precisa de ajuda? Solicite uma ajuda particular: https://forms.gle/Pu1aT2LsbU1nuTTDA Neste vídeo, eu te mostro uma das maiores mudanças que fizemos no projeto até agora: substituímos todos os componentes nativos de HTML pelos componentes do ShadCN. A grande vantagem dessa mudança é que os novos componentes já vêm com várias configurações importantes prontas, como acessibilidade, contraste de cores e adaptação automática entre temas claro e escuro. Tudo isso economiza tempo e garante mais qualidade na experiência do usuário. Mas, como sempre, nem tudo são flores — para usar os componentes do ShadCN corretamente, é preciso lidar com uma nova estrutura, mais verbosa e exigente. Durante a aula, a gente percorre o projeto e te mostro todas as alterações feitas, desde os inputs e botões até formulários mais complexos. Você vai aprender a estrutura necessária para usar o Form do ShadCN com o React Hook Form, como lidar com mensagens de erro, validações e até como implementar um componente de calendário completo que funciona bem em qualquer navegador. É uma aula prática, cheia de detalhes que vão te dar segurança para aplicar essa estrutura em qualquer projeto real. Se você está sentindo que seus componentes HTML estão limitando a escalabilidade e a acessibilidade da sua aplicação, essa aula é para você. A gente vai fundo no código, explica ponto a ponto o que muda, como resolver problemas comuns e por que vale a pena dar esse passo. Então dá o play e vem comigo explorar essa etapa avançada do nosso curso de React — você vai sair com uma base sólida para desenvolver interfaces mais modernas, acessíveis e bem estruturadas. Links mencionados no vídeo: 📖 Repositório do projeto - https://github.com/lvsouza/curso-base-de-react/tree/cf333aa19944c24e599ac986f7750945fcb3a1b3 🗨️ Discord - https://discord.gg/ZC7JrPZn7P 🎬 CodarSe - https://codarse.com Outros cursos no canal: 🎩 Figma para DEVs - https://youtu.be/4rSPV1NbM10 ☪️ Curso de estilização no React - https://youtu.be/oUbPkR799fc 💎 Curso base de React - https://youtu.be/ggtWTKbhN_U 👑 React, Material UI 5 e Typescript - https://youtu.be/wLH1Vv86I44 🏆 Curso de API Rest, Node e Typescript - https://youtu.be/SVepTuBK4V0 Livros recomendados: 📘 Código limpo - https://amzn.to/43Xiick 📘 Arquitetura limpa - https://amzn.to/3ZMCStr 📘 Migrando sistemas monolíticos - https://amzn.to/45ByPDZ 📘 The Micro SaaS Handbook - https://amzn.to/4jCan93 Conteúdo: 0:00 | Apresentação da aula 2:10 | Avisos importantes 2:30 | Revisando como ficou a interface depois da refatoração 5:35 | Revisando os novos componentes instalados 6:10 | Revisão das telas como ficou depois da alteração 10:57 | Revisão de como ficou o formulário com os componentes novos 18:45 | Revisão detalhada de como ficou o calendário do shadcn 30:30 | Finalização e agradecimentos CODARSE - [Membros apenas] Biblioteca de componentes #ReactJS #Vite #TypeScript #JavaScript #FrontEnd #Programação
Continue this lesson in the app
Install CourseHive on Android or iOS to keep learning while you move.
