Inspiration

Day Dex was inspired by the growing fragmentation of personal productivity and financial management tools in our digital lives. We noticed that people are constantly switching between multiple apps for managing tasks, tracking finances, and organizing their personal information. This context-switching creates friction and cognitive load in our daily routines. We asked ourselves: what if there was a single, elegant platform that could bring together the essential tools for modern life management without overwhelming the user?

The financial aspect specifically was inspired by the lack of simple yet powerful budget tracking tools that focus on what matters most - your current month's activity and clear visibility into your financial health without complex configurations.

What it does

Day Dex is a comprehensive personal operating system that seamlessly integrates multiple life management functions:

Financial Management: Budget tracking with monthly income and expense monitoring (focused on the past 30 days) Net worth calculation from connected bank accounts via Plaid integration Expense categorization and visualization Personalized budget setting with visual progress indicators Productivity Tools: Task management with prioritization Calendar integration Note-taking capabilities Personal Dashboard: Customizable widgets showing the most relevant information At-a-glance financial health indicators Beautiful, modern UI with dark/light mode support The system intelligently connects these elements, providing a holistic view of the user's life and finances in one cohesive interface.

How we built it

Day Dex is built using a modern tech stack designed for performance, reliability, and scalability:

Frontend: Vue 3 with Composition API for reactive state management Styling: Tailwind CSS for responsive, utility-first styling Data Visualization: Vue-ChartJS for financial data visualization Backend Integration: Supabase for database operations with Row Level Security Firebase Authentication for secure user management Financial Connectivity: Plaid API for secure bank account connections Voice Integration: ElevenLabs API for potential voice assistant features State Management: Vue's reactive system with local storage fallbacks for offline capability Deployment: Vite for fast development and optimized production builds We implemented a robust service architecture where each feature has dedicated service modules (like supabaseBudgetService.ts and bankingData.ts ) that handle specific functionality, making the codebase maintainable and scalable.

Challenges we ran into

Data Synchronization: Ensuring data consistency between Supabase, local storage, and Plaid was challenging, especially with UUID type mismatches between Firebase user IDs and Supabase. User Experience Balance: Creating a feature-rich application without overwhelming users required careful UI/UX decisions and iterative design. Financial Data Processing: Filtering transactions for the past 30 days across multiple accounts while maintaining performance took careful optimization. TypeScript Integration: Ensuring type safety across the application, especially with external APIs returning varied data structures, required careful interface design. Error Handling: Building graceful fallbacks for potential API failures or connectivity issues, particularly for financial data which is critical to user trust. Cross-platform Compatibility: Ensuring consistent behavior across different devices and browsers while maintaining the modern UI aesthetic.

Accomplishments that we're proud of

Seamless Integration: Successfully integrated multiple data sources (Plaid, Supabase, Firebase) into a cohesive experience. Elegant UI/UX: Created a beautiful, intuitive interface that handles complex financial data without overwhelming users. Robust Architecture: Developed a resilient system with offline capabilities and fallback mechanisms that ensure users always have access to their data. Performance Optimization: Achieved smooth performance even when processing large transaction datasets and complex financial calculations. Data Visualization: Implemented clear, actionable visualizations of financial data that help users understand their spending patterns. User-Centered Design: Focused on user needs with features like the "past 30 days" filter that shows relevant recent activity rather than overwhelming historical data.

What we learned

Financial Data Complexity: Working with financial transactions revealed the complexity of categorization, normalization, and meaningful presentation. Progressive Enhancement: The importance of building features that gracefully degrade when services aren't available. State Management Patterns: Refined our approach to state management in complex applications with multiple data sources. TypeScript Best Practices: Deepened our understanding of TypeScript's type system for building robust applications. User Feedback Loop: The importance of quick iterations based on user feedback for financial features, which require high trust. Database Design: How to structure data models that support both online and offline experiences effectively.

What's next for Day Dex

Machine Learning Integration: Implementing intelligent categorization and spending pattern analysis. Voice Commands: Expanding ElevenLabs integration for natural language interaction with financial data. Financial Goals: Adding goal-setting features with automated tracking and recommendations. Mobile Application: Developing native mobile experiences to complement the web application. Data Export: Adding comprehensive export options for financial reports and tax preparation. Advanced Forecasting: Implementing predictive models to help users plan future expenses and savings. Social Features: Optional sharing of financial goals and achievements with trusted contacts for accountability. Integration Ecosystem: Expanding the list of supported financial institutions and productivity tools. Day Dex aims to become the central hub for personal life management, continuing to integrate the essential tools people need while maintaining the simplicity and elegance that sets it apart. Integrations: Notion and google calendar

Built With

Share this project:

Updates