Skip to content

Repository files navigation

FinAuto πŸš—

CI License: MIT

πŸ”— Live: https://vitorueno.github.io/FinAuto/

A car financing calculator: type the vehicle price, the down payment, the monthly interest rate and the number of installments, and see the monthly payment, the total paid, and how much of that total is interest β€” in BRL or USD, in English or Portuguese.

⚠️ This is a study project, built to practice TDD and layered architecture in React. It may contain errors, and the numbers it produces are not financial advice β€” don't use them to make a real decision.

✨ Features

  • Amortization math β€” fixed-installment (Price/PMT) schedule, plus an approximate effective annual rate.
  • Two currencies, two languages β€” BRL/USD and EN/PT, switchable without losing what you typed.
  • Right-to-left input masks β€” amount and rate fields fill from the cents, like a banking app.
  • Animated results β€” values count up to the final number, with a donut showing the interest share.
  • Responsive β€” the results pane moves below the form on narrow screens.

πŸš€ Running locally

Requires Node 24 (see .nvmrc).

git clone git@github.com:vitorueno/FinAuto.git
cd FinAuto
npm install
npm run dev

Other commands:

npm test         # run the test suite
npm run build    # production build into dist/

πŸ—οΈ Architecture

Four layers, each depending only on the one below it. The rule that keeps them honest: src/domain/ imports nothing from React.

src/
β”œβ”€β”€ domain/       # pure functions: math, masks, parsing, formatting, validation
β”œβ”€β”€ hooks/        # React state and effects, built on top of domain
β”œβ”€β”€ components/   # presentational β€” receive values and callbacks, decide nothing
β”œβ”€β”€ i18n/         # typed copy dictionary (EN/PT)
└── styles/       # design tokens and global CSS

App.tsx composes the layers: useLoanForm holds the state and calls into domain/, and the components only render what it hands them. Everything was written test-first, and that separation is what makes it practical: the amortization formula, the input masks and the validation rules are all covered by tests that never mount a component.

🀝 Contributing

Issues and PRs are welcome. A pre-commit hook runs Prettier and oxlint on staged files; CI additionally runs the full test suite and the production build, so make sure npm test and npm run build pass before opening a PR. Commits follow Conventional Commits.

πŸ“„ License

MIT β€” see LICENSE.

About

πŸš— Car financing calculator in React + TypeScript - an architecture and TDD exercise

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages