🏡 Home Bills

Minimalistic bill tracker for those who despise tracking microtransactions.

🏆 Goals & Milestones

Goals

1. 🔍 Track important data. Tracking microtransactions is extremely time consuming, especially when you have a lot of them spread out across multiple credit cards.

2. 🔐 Keep your data local and private. Why should you have to worry about privacy policies that you're never gonna read? Who knows what these crazy people are doing with your data.

3. 📊 Useful reports. Here's the thing: I want to know how much my household owes these credit card companies. And I want it in a nice UI — not some table-like, hard-to-use five-clicks-to-add-a-single-transaction app.

4. ⚡️ Shortcuts and hotkeys. Come on, you're a developer. Why should you click on your finance app to do things? Let's make tracking finances easier with quick keystrokes.

Milestones

01. The Minimum Viable Code.

• Design a friendly and minimal interface.
• Code interface for desktop.
• Code the entire interface reponsively.
• Add empty states #13
  • Transaction List empty state
  • Overview empty states
• Open "Add Bills" pop-up.
  • Add "Control + N" hotkey to add new bills.
  • Add "Escape" hotkey to close bills modal.
• Data handling with localStorage (MVP).
  • Add Bills: to transaction list and localStorage
  • Remove Bill
  • Toggle Paid
  • Edit Bill Values #14
• Generate overview reports with JS.
  • Calculate data #9
  • Render Overview Data #10
• Open Source it: add a license, make repo public, and document.

02. Better Data Management

• Handle data with a local JSON file that you can store and sync with your iCloud, or GDrive.
• Ability to visualize your bills from your computer, phone, or tablet.

03. Mobile App: I can see...

• iOS App (read-only).
• iOS Widgets for previewing data on the Home Page.

04. Mobile App: Permission to edit.

• iOS App: manage your data on the app

🏃 Run the project on your machine (or deploy it somewhere only you know 🏖️)

01. First Install all dependencies by running:

yarn

Or npm install if you're not into the amazingness of yarn. 👀

02. If you want to develop and make changes to it:

yarn dev

Or npm run dev... Whatever. 🙄

03. If you want to deploy it yourself, the build command is:

yarn build

Or, again, npm run build. Gosh, you're weird.