Project
Roulette

Contribution Tracker

In the Charity Finder project you created an app to help you locate a charity worthy of your contributions.

AdvancedWeb appDashboard16–38hAI-buildable 3/5no setupworth shipping

In the Charity Finder project you created an app to help you locate a charity worthy of your contributions. Once a contribution has been made the goal of the Contribution Tracker app is to track it so to provide users with a record of all contributions for use in monitoring how funds are being directed and to provide records for financial reporting purposes. For example, for tax reporting. ### Constraints - Developers may use Vanilla JS, or a framework of their choice (like React, VueJS, etc.). - Developers should not use libraries for calculating and manipulating monetary amounts. All…

UI
Logic
Useful

Hosting · Free forever

Deploys free on GitHub Pages, Cloudflare Pages or Vercel Hobby.

Deploy it and share a link.

Core features · 14

  • User can see a Navigation Bar at the top of each page containing the
  • Dashboard
  • Transactions
  • User can see a Footer Bar at the bottom of each page containing an
  • User can see the Dashboard page when the app is started containing
  • Contributions by month for the current year
  • Total contributions by year
  • Contribution increase/decrease by year
  • Average contribution amount by month and year
  • User can return to the Dashboard page, if currently on another page, by
  • User can see a transaction input panel containing the following:
  • Transaction date
  • Payee name
  • Action buttons - 'Clear', 'Add'

Once it works

  • User can click in the transaction date field to display a calendar
  • User can see alternating row background colors in the transaction ledger.
  • User can click on a column heading in the transaction ledger to toggle
  • User can see a PDF option near the Transaction Ledger to create a PDF

Suggested stack

reacttypescripttailwindrechartsreact-hook-formdate-fnslocalstoragesupabase

Track it