May 11, 2026

Overview

MoneyBees is a financial planning and education brand for young adults in Singapore. Its site has marketing pages, a contact form and a blog of about 220 posts moved from WordPress. Behind the site sits an admin CMS. Editors write posts in an inline editor, moderate comments and track views.

My role

Lead developer from February to May 2026, and the only engineer on the repo. The project started from a Lovable scaffold.

• 350 of the 477 commits (73%), and 350 of the 353 commits people made
• I created all 47 files of the admin CMS
• Lovable made most of the rest, including database and edge function deploys from specs I wrote

The live site has changed since May 2026. Its Academy, Tools and Learn menus are not my work.

What I built

• Inline post editor: a slash menu with 16 block types, including callouts and tables. Images drag in or paste, with alt text and captions. Posts embed YouTube, Vimeo and link preview cards.
• Post settings: status, slug, category, tags, excerpt, featured image, a generated OG image, and SEO title and description.
• Admin roles: Editor and Super Admin, with ownership-based access to posts.
• Comment moderation: a pending queue with bulk approve, reject and delete, and a count badge in the sidebar.
• Admin dashboard: stat cards, a 30-day views chart, top posts and an author leaderboard. The posts table has search and a status filter.
• Blog reading experience: search, sort, a featured card, popular posts, category counts, numbered pagination and a table of contents. Branded images fill in where a post has none.
• Contact email pipeline: an edge function with branded HTML templates and an auto-reply.
• SEO: sitemap and RSS edge functions, OG and Twitter meta, JSON-LD, a CSP header and legal pages.
• Performance: a lazy-loaded map cut the contact page chunk from 265KB to 12KB. Vendor code loads in separate chunks.
• WordPress image rehosting: I added file-header checks, captcha rejection and safe filenames to the rehost function.
• WordPress migration: a local migration toolkit and the fix specs. I later fixed the types in the migration functions.

I wrote 3 of the 8 edge functions. Lovable wrote the other 5, 4 of them from my specs.

How I built it

I built it with Claude Code agents. I set up the task pipelines, wrote the specs and set the checks each change must pass. Lovable applied the database and edge function changes.

• A 324-line CLAUDE.md, the rule file the agents read, defines the pipelines.
• A tag on each task sets its checks, such as a plan review or a Playwright check.
• A /batch command works the queue alone: one task, one commit, one push.
• Claude Code never writes SQL. A Lovable handoff skill has it write database specs into a handoff file, and Lovable applies them. That file holds 59 checked-off items.
• In March 2026, six agents audited the site in parallel for production readiness.

Tech stack

• Web: React 18, TypeScript, Vite, Tailwind CSS, shadcn/ui, Magic UI, TanStack Query, React Hook Form, Zod, React Router 7, Recharts
• Editor: Tiptap 3
• Backend: Supabase (Postgres, Auth, Storage, Edge Functions)
• Quality: Playwright MCP for browser checks
• Agents: Claude Code, and Lovable for database and edge function deploys