This is a submission for the Amazon Q Developer "Quack The Code" Challenge: Crushing theΒ CommandΒ Line
π οΈ What I Built
I developed a Real-Time Expense Tracker Dashboard β a fully client-side, responsive web application that helps users track and analyze personal expenses. Key features include:
β¨ Key Interactive Features
π User Profile Management
Set your monthly income and instantly track your balance and savings as you log expenses.
π Smart Expense Input
Easily add expenses with detailed info like amount, category, date, and a short description. Everything updates live!
π Visual Insights with Chart.js
Watch your spending come to life with dynamic pie charts (category breakdown) and line charts (daily/weekly trends).
π Real-Time Sync Across Tabs
Add an expense in one tab β see it reflected instantly in others! Powered by the BroadcastChannel API.
πResponsive UI + Dark Mode
Enjoy a sleek, intuitive interface that adapts to all devices β and switch between light/dark themes with one click.
π Demo
Live Website: Expense Tracker
π» Code Repository
GitHub:https://github.com/Dhanishka03/Awsdev-ExpenseTracker
π¬Connect with Me
πΌLinkedin:Dhanishka.M
π GitHub:Dhanishka_github
πDEV Profile:Dhanishka_dev
π€How I Used Amazon Q Developer
π§ Real-Time Guidance
Amazon Q Developer walked me through implementing real-time sync across tabs using the BroadcastChannel API β making multi-tab tracking effortless.
π Smart Visual Enhancements
It suggested using Chart.js for category breakdowns and trend charts, helping me bring my data to life with clean, dynamic visuals.
π§ Effortless Debugging
From fixing minor glitches to optimizing how data updates on the front end, it made sure everything worked smoothly and efficiently.
π¨UX Upgrades
Q Developer recommended UI improvements like dark mode and advanced filters for a better, more personalized experience.
π€ Team Collaboration
Huge shoutout to my teammate Ranjini S for her constant support and contributions throughout development!



Top comments (0)