A minimalistic expense tracker and analyzer that turns your spending into clear monthly and month-to-month insights, so you can finally answer: "Where does it all go?" PandaCoins helps you track your coins!

Live website: https://pandacoins.vercel.app/

I have always struggled by the end of every month because I don’t know where my money went. PandaCoins was born to solve this. Existing expense-tracking apps and platforms are either too complex or not free.

I built a minimalistic expense tracker and analyzer that allows users to:

• Track expenses in a clean, table-based format
• Categorize transactions
• Generate natural-language explanations of spending behavior
• Quickly skim through monthly expense summaries
• Support multiple currencies and custom categories
• Installable PWA: Access PandaCoins instantly from your home screen with offline support.

• React + Vite
  Chose Vite over Next.js for its simplicity, faster development experience, and because the app does not require SSR or advanced routing features.

• React Hook Form + Zod
  Chosen over Formik due to better type safety, less boilerplate, reusable schemas for future validation, and improved performance.

• TanStack Router (file-based)
  Chosen over React Router to take advantage of built-in file-based routing.

• Tailwind CSS
  Chosen over vanilla CSS to ensure design consistency and rapid development.

• Shadcn UI
  Used to speed up UI development while maintaining consistency and focusing on core features.

• Vite PWA Plugin
  Used to transform the app into a Progressive Web App, enabling installation and offline capabilities.

• Vitest (Unit)
  Chosen because it integrates seamlessly with Vite.

• Vitest + React Testing Library (Integration)
  Used for integration testing due to excellent compatibility with React and Vite.

• Playwright (E2E)
  Chosen for end-to-end testing because of its simplicity and reliability.

No backend is currently implemented due to the simplicity of the app and the lack of complex business logic.

• The frontend handles the UI and user-triggered actions.
• Triggered actions are handled by the domain layer.
• The domain layer performs any necessary business logic.
• The data layer manages data persistence when needed (e.g., local storage).
• Results are passed back to the frontend for display.
• The testing layer covers unit, integration, and end-to-end tests.
• A CI/CD pipeline runs tests, performs security checks using npm audit, builds the app, and automatically deploys to Vercel.

• Node.js v22.17.0 or higher
• npm v11.8.0 or higher

1. Clone the repository:

git clone https://github.com/sohila-hashem/pandacoins.git

2. Navigate to the project directory:

cd pandacoins

3. Install dependencies:

npm install

4. Run the development server:

npm run dev

5. Open http://localhost:5000 in your browser to see the app.

• Support for custom categories
• Allow filtering by category
• PWA Support: App is now installable and works offline.
• Import expenses from a CSV file
• Export reports as PDF
• Optionally sync expenses and preferences (custom categories, currency, etc.) across devices by creating an account.