Arth Shikshak

Plan Your Finances, Achieve Your Goals.

Comment

About the Project: Your Personal Financial Navigator

Inspiration

The inspiration behind this project, "Arth Shikshak" (which translates to 'Financial Teacher' in Hindi), came from a desire to empower individuals with the tools and knowledge needed to take control of their financial future. Many people find personal finance daunting, scattered across various apps and resources. I envisioned a single, intuitive platform that could simplify financial planning, goal setting, and tracking, making it accessible and actionable for everyone. The integration of AI, specifically through the Gemini API, was planned to offer personalized insights and guidance, acting like a personal financial co-pilot.

How I Built It

I chose the Next.js framework for its robust features, including server-side rendering, API routes, and a great developer experience. The project follows a standard Next.js architecture:

  • Frontend: Built with React components in the src/components directory and pages in src/app. I utilized a comprehensive UI library to accelerate development and ensure a consistent look and feel.
  • Backend: Implemented using Next.js API routes (src/app/api) to handle user authentication, data management for chats and goals, and interactions with external services like the Gemini API.
  • Database: MongoDB was selected as the database due to its flexibility and scalability, with Mongoose (src/models, src/lib/mongodb.ts) used for object data modeling.
  • Authentication: NextAuth.js was integrated for secure and flexible authentication strategies.
  • Core Features: I developed modules for key functionalities such as financial calculators, goal setting and tracking, a chat interface for AI interaction, and a user onboarding flow.
  • Styling: Tailwind CSS was used for efficient and utility-first styling.

What I Learned

Throughout the development process, I gained significant experience in building full-stack applications with the T3 stack (Next.js, TypeScript, Tailwind CSS, tRPC/some form of API layer - in this case, Next.js API routes and Mongoose/MongoDB). Key learnings included:

  • Effective API Design: Designing clear and efficient API endpoints for various functionalities (auth, chat, goals, etc.).
  • State Management in React/Next.js: Handling complex application state, especially across different pages and components, using Context API and React hooks.
  • Database Modeling and Interaction: Designing Mongoose schemas and performing CRUD operations effectively.
  • Secure Authentication Implementation: Understanding and implementing secure user authentication flows with NextAuth.js.
  • Integrating External APIs: Connecting to and handling responses from the Gemini API, managing API keys and potential errors.
  • Building Reusable Components: Creating a library of reusable UI components (src/components/ui) to improve development speed and maintainability.
  • Handling Asynchronous Operations: Managing promises and async/await effectively in both frontend and backend code.

Challenges Faced

Building a project of this scope presented several challenges:

  • Integrating Gemini API: Ensuring seamless and efficient communication with the Gemini API, handling potential latency, and formatting prompts and responses correctly for financial contexts.
  • Real-time Chat Implementation: Setting up the infrastructure for a real-time chat feature, ensuring messages are delivered and displayed promptly.
  • Data Consistency: Maintaining data consistency between the frontend and backend, especially during user actions like updating goals or completing onboarding steps.
  • Complex Calculator Logic: Implementing the logic for various financial calculators accurately and handling potential edge cases.
  • User Onboarding Flow: Designing a smooth and intuitive multi-step onboarding process that effectively gathers necessary user information.
  • Error Handling: Implementing robust error handling across the application, from API calls to database operations, and providing clear feedback to the user.
  • Performance Optimization: Ensuring the application remains performant as features were added and data grew.

Despite these challenges, the process was incredibly rewarding, allowing me to build a powerful tool aimed at improving financial literacy and well-being.

Built With

Share this project:

Updates