Anchor — Personal Finance

A browser-based personal finance app for tracking your money, budgets, and net worth. Data is stored in Firebase Firestore with user authentication.

Features

• Dashboard — Net worth snapshot, income vs. expense charts, recent transactions, and budget status at a glance
• Transactions — Log income and expenses with categories, filter by type, category, or month
• Budgets — Set monthly or weekly spending limits per category with progress tracking
• Savings Goals — Track big financial goals with milestone markers and contribution history
• Saving Buckets — Earmark money for specific purchases (car, vacation, gadget, etc.) with a smart savings plan
• Bills — Track recurring and one-time bills, see what's due soon or overdue
• Net Worth — Add assets and liabilities, track your debt ratio and net worth over time
• Alerts — Set custom spending rules beyond your budgets to get notified when you overspend
• Insights — Monthly spending trends, savings rate, and personalized recommendations
• Dark / Light theme — Toggle between themes from the top bar or settings

Tech Stack

Layer	Technology
Frontend	Vanilla HTML, CSS, JavaScript
Charts	Chart.js v4.4
Auth	Firebase Authentication
Database	Firebase Firestore
Fonts	Google Fonts (Inter, Caveat)

Project Structure

public_html (2)/
├── anchor-app.html       # Main app shell (current version)
├── index-anchor.html     # Legacy app shell
├── anchor-auth.html      # Login / sign-up page
├── anchor-details.html   # Account detail view
├── anchor-goodbye.html   # Sign-out confirmation
├── app-anchor-ui.js      # UI logic for current version
├── app-anchor.js         # Core app logic (legacy version)
├── anchor-auth.js        # Authentication logic
├── style-anchor.css      # All styles for Anchor
└── firebase-config.js    # Firebase project config

Getting Started

1. Clone the repo and open the project in your editor.
2. Add your Firebase project credentials to firebase-config.js.
3. Serve the files from a local web server (e.g. VS Code Live Server) — Firebase Auth requires a served origin, not file://.
4. Open anchor-auth.html to sign in, which redirects to anchor-app.html.

Firebase Setup

• Enable Email/Password authentication in the Firebase console.
• Create a Firestore database and deploy the rules from firestore.rules.
• Paste your Firebase config object into firebase-config.js.