Crie sua Biblioteca de Ícones com React, TypeScript e NPM

Aprenda a criar sua própria biblioteca de ícones com React e TypeScript, dominando SVGs, GitHub Actions, publicação automatizada no NPM, Husky, Commitlint, Commitizen, Semantic Release e muito mais.

Neste curso 100% prático, você vai aprender a criar do zero uma biblioteca de ícones com React e TypeScript, utilizando um conjunto moderno de ferramentas que refletem as boas práticas do mercado atual. Vamos transformar arquivos SVG em componentes React reutilizáveis, otimizados e prontos para publicação no NPM, com um fluxo de trabalho automatizado e profissional.

Você aprenderá a usar o SVGO para otimizar seus ícones SVG, garantindo leveza e performance. Com o auxílio do Fast-Glob e da API do Node.js, vamos automatizar a geração de componentes em tempo de build. Também vamos criar um componente base genérico chamado IconBase.tsx, que padroniza o comportamento visual dos ícones — incluindo propriedades como color, size, fill e viewBox.

Além disso, o curso ensina como configurar ESLint, Prettier, Husky, lint-staged, Commitlint e Commitizen para manter seu código limpo e padronizado até o deploy. Por fim, você aprenderá a automatizar o versionamento e a publicação da sua biblioteca no NPM com o Semantic Release e Workflows com GitHub Actions, sem precisar alterar versões manualmente.

Este curso é ideal para quem já tem uma base em React e TypeScript e deseja ir além, aprendendo a construir, versionar e publicar pacotes reutilizáveis com qualidade e eficiência profissional.