Dynamic Dashboard

Inspiration

Managing personal finances can be overwhelming, and many budgeting tools either lack simplicity or require too much manual effort. We wanted to create a user-friendly, AI-enhanced financial dashboard that helps users track their spending habits effortlessly. By integrating GitHub Copilot for smarter coding and Azure Static Web Apps for seamless deployment, we built a tool that is efficient, scalable, and easy to maintain.

What It Does

Dynamic Dashboard is a React-based budgeting dashboard that allows users to:
Track spending habits with clear visualisations
Gain financial insights through an interactive UI
Experience real-time updates with a smooth, fast-loading interface
Benefit from seamless deployment using Azure Static Web Apps

How We Built It

Technology Stack

  • Frontend: React, built using Visual Studio Code
  • AI Assistance: GitHub Copilot for code suggestions, optimisations, and debugging
  • Hosting & Deployment: Azure Static Web Apps for a serverless and automated CI/CD pipeline
  • Version Control & CI/CD: GitHub, integrated with Azure DevOps for continuous updates

Development Process

  1. Initial Development: Built the React-based UI for the dashboard.
  2. AI-Powered Optimisation: Used GitHub Copilot to improve code quality and reduce redundancy.
  3. Before & After Comparisons: Documented how Copilot’s suggestions enhanced performance.
  4. Azure Integration: Implemented Azure Static Web Apps for seamless hosting and automatic updates via GitHub Actions.

Challenges We Ran Into

Code Complexity: Structuring a scalable React application while maintaining clean, efficient code.
Deployment Issues: Finding the best hosting service that ensures scalability and security without complex configurations.
Time Constraints: Balancing feature development, testing, and deployment within a limited timeframe.

Accomplishments That We’re Proud Of

Successfully implemented GitHub Copilot to improve productivity and enhance code quality.
Overcame deployment challenges by integrating Azure Static Web Apps for a streamlined, hassle-free experience.
Created an interactive, user-friendly financial dashboard that provides real-time insights.

What We Learned

AI can significantly improve development speed—Copilot made coding more efficient and helped debug issues faster.
Azure provides a powerful, easy-to-use hosting solution—Static Web Apps simplified deployment and automated updates.
A structured workflow is key to project success—From ideation to deployment, following a streamlined process ensured a high-quality result.

What’s Next for Dynamic Dashboard?

Enhancing Features: Adding backend support to allow users to store and manage personal financial data securely.
Expanding Azure Integration: Implementing Azure Functions for automated data processing.
User Customisation: Allowing users to set financial goals and receive AI-powered insights.


Dynamic Dashboard leverages AI-powered development and cloud hosting to bring smarter financial insights to users. The journey doesn’t stop here—bigger features and more powerful integrations are on the way!

Built With

Share this project:

Updates