Junte-se a outras 23 pessoas que estão fazendo esse mini projeto.
Projeto Gráficos com shadcn/charts e Next.js
Muitas vezes gráficos são a melhor forma de "enxergarmos" os dados. Neste mini projeto, vamos criar gráficos dinâmicos com shadcn, Next.js e Recharts.
- Estruturando o HTML do projeto
- Extraindo componentes
- Estilizando os botões do Header
- Dica - transforme ícones SVG em componentes React
- Responsividade do Header
- Usando o Card do shadcn/ui
- Preparando os dados da API para o gráfico
- Instalando o shadcn charts
- Adicionando labels dos estados (LabelList)
- Adicionando o eixo horizontal
- Adicionando tooltip
- Adicionando a barra de média
- Gráfico de Gastos por Partido
- Finalização
HTML e CSS do App
Gráficos com Recharts e shadcn
Finalização