CodeSprint 2025 – Personalized Savings Assistant 💰

Project Brief

This project is a Personalized Savings Assistant that helps users analyze bank transactions (via CSV upload) to:

• Identify areas of overspending
• Set and track saving goals (e.g., vacation, mortgage, etc.)
• Display potential savings
• Offer congratulatory messages on milestones
• Provide smart recommendations using a suggestion engine

Key Features

• 🧠 Transaction categorization using a Large Language Model (LLM)
• 📊 Expense tracking and budgeting
• 🎯 Personalized savings goals
• 📈 Interactive charts and visualizations
• 🤖 Recommendation engine for saving suggestions

---

🔧 Setup and Running the Project

Prerequisites

• Node.js (>=18)
• npm or yarn
• LLM API key (e.g., OpenAI, Anthropic)

---

1. Clone the Repository

git clone https://github.com/your-username/personal-savings-assistant.git
cd personal-savings-assistant

Or create a new Astro project and integrate this code manually.

---

2. Install Dependencies

npm install
# or
yarn install

---

3. Configure Environment Variables

Create a .env file in the root directory:

LLM_API_KEY=YOUR_API_KEY

---

4. Start the Development Server

npm run dev
# or
yarn dev

Then open http://localhost:4321 in your browser.

---

⚙️ Project Structure Overview

src/
├── components/         # UI components
├── lib/                # LLM service integration
├── pages/              # Astro pages
├── scripts/            # Client-side chart rendering
├── styles/             # CSS / Tailwind
data/                   # Cached transaction & savings data
public/                 # Static assets
.env                    # Environment variables

---

📈 Client-Side Chart Rendering

To render dynamic graphs:

1. Create src/scripts/chart.ts:

import Chart from 'chart.js/auto';

export function renderLineChart(canvasId: string, data: any) {
  const ctx = document.getElementById(canvasId) as HTMLCanvasElement;
  new Chart(ctx, {
    type: 'line',
    data,
    options: { responsive: true },
  });
}

2. In index.astro, import and invoke the function:

<script type="module">
  import { renderLineChart } from '../scripts/chart.ts';
  renderLineChart('myChart', myData);
</script>

---

🤖 LLM API Integration

1. Create src/lib/chatbotService.ts:

import 'dotenv/config';
import { readFile, writeFile } from 'fs/promises';

export async function categorizeWithLLM(transaction: string): Promise<string> {
  // Use fetch or OpenAI SDK to call LLM
  const response = await fetch(/* ... */);
  return await response.text();
}

2. Use LLM_API_KEY for authentication.

---

💾 Data Storage & Caching

1. Create a data/ directory at the project root.

2. Use functions like:

export async function loadCategoryCache() { /* ... */ }
export async function saveCategoryCache(data) { /* ... */ }

This keeps categorized transactions and savings suggestions locally cached.

---

🚀 Future Improvements

• Add authentication (OAuth or email-based)
• Export monthly reports
• Gamify savings achievements
• Deploy to platforms like Vercel or Netlify

---

📬 Feedback & Contributions

Feel free to fork the repo, raise issues, or contribute via pull requests! Let's build smarter savings habits together.

---

Built with ❤️ for CodeSprint 2025