April 27, 2026

Overview

MoneyBees Planner is a financial planning app for advisors in Singapore. It has CPF, HDB and tax calculators and client KYC profiles. It also has cash-flow, net-worth, insurance and scenario modules, a KYC PDF report and an AI planner chatbot.

My role

Co-developer from January to April 2026. I joined a client product that Lovable built most of. The client started it in Lovable in July 2025, and Lovable made 4,275 of its 4,456 commits.

• 170 commits on 13 days, the most of any person on the repo
• 93 of my 167 non-merge commits are documentation
• Of the other 74, 49 changed the UI
• My feature work: the KYC PDF report, chatbot polish, UI changes and the Claude Code setup

What I built

• KYC PDF pipeline: I replaced Lovable's manual jsPDF drawing with an html2canvas pipeline. The on-screen preview now matches the PDF.
• Nine-page branded report: cover, contents, disclaimer, personal info, two balance sheet pages, two cash-flow pages and a summary. Recharts donuts show the splits. I rebuilt it in 36 commits over two days.
• Download progress: a page-by-page progress bar while the PDF builds.
• AI chatbot polish: markdown streaming, typing dots, an auto-resizing input, suggestion chips and a capabilities panel. I also lazy-loaded it, so it no longer sits in the main bundle.
• Branding and mobile UI: a logo loader, light mode by default, mobile-friendly profile tabs and a simpler login.

Lovable built the chatbot and most screens. I polished the chatbot in six commits in April 2026.

How I built it

I set up Claude Code for the repo in February 2026. My first commit, in January, reads "say hi from claude code".

• A 512-line CLAUDE.md maps the routes, hooks, the CPF calculation chain and 81 assumption fields for agents.
• Seven skills cover the codebase, including CPF calculations, Singapore financial rules and the Lovable handoff.
• A /batch command works [AUTO] tasks one by one.
• The build must pass before each commit. /batch stops on build errors, unclear tasks or database changes.
• Database changes go into a handoff file for Lovable.
• CLAUDE.md marks shared UI components and the Supabase client as off-limits to agents, and agents may not read .env.

Tech stack

• Web: React 18, TypeScript, Vite, Tailwind CSS, shadcn/ui, TanStack Query, React Router, Recharts
• PDF: jsPDF, html2canvas
• Backend: Supabase (Postgres, Auth, Edge Functions)
• Tests: Playwright
• Agents: Claude Code, alongside the client's Lovable