Destino Dev

Cursos

Calculadora Financeira Avançada com React e TypeScript

Código do curso: github.com/johnpires/calculadora-financeira-react-ts

Construa uma calculadora financeira profissional do zero com React e TypeScript. Implemente 4 calculadoras reais: juros compostos, financiamento SAC e Price, planejamento de aposentadoria e simulador de investimentos com gráficos interativos via Recharts e UI com Tailwind CSS.

Conteúdo do curso

Módulo 1: Introdução e Setup do Projeto

Conheça o projeto, configure o ambiente de desenvolvimento e entenda a arquitetura da calculadora financeira.

  1. O que vamos construir: visão geral das 4 calculadoras (2 min)
  2. Configurando o ambiente: Node.js, Vite e TypeScript (8 min)
  3. Estrutura do projeto e arquitetura de componentes (2 min)

Módulo 2: Calculadora de Juros Compostos

Implemente a fórmula de juros compostos com formulário validado, hooks customizados e gráfico de barras interativo.

  1. Tipos TypeScript e schema Zod para juros compostos (2 min)
  2. Implementando a fórmula de juros compostos (8 min)
  3. Formulário, gráfico Recharts e componente final (8 min)

Módulo 3: Calculadora de Financiamento (SAC e Price)

Implemente os dois sistemas de amortização mais usados no Brasil — SAC e Price — com tabela de parcelas e gráfico comparativo.

  1. Entendendo SAC e Price: matemática e diferenças (2 min)
  2. Implementando SAC, Price e tabela de amortização (8 min)
  3. Tabela de parcelas e comparativo SAC vs Price (8 min)

Módulo 4: Planejador de Aposentadoria

Calcule quanto poupar por mês para atingir a independência financeira, com gráfico de evolução patrimonial e exportação em PDF.

  1. Modelando a simulação de aposentadoria (2 min)
  2. Cálculo, gráfico de evolução patrimonial e exportação PDF (8 min)

Módulo 5: Simulador de Investimentos

Compare poupança, CDB, Tesouro Selic e ações com cálculo de IR e IOF, dashboard multi-gráfico e persistência no LocalStorage.

  1. Comparando investimentos: poupança, CDB, Tesouro e ações (2 min)
  2. Cálculo de IR, IOF e dashboard comparativo multi-gráfico (3 min)

Módulo 6: Deploy e Próximos Passos

Faça o build de produção otimizado com Vite e publique a calculadora na Vercel gratuitamente em minutos.

  1. Build de produção com Vite e deploy na Vercel (2 min)
  2. Revisão do projeto e próximos passos (2 min)
  3. Próximos cursos recomendados na trilha (8 min)