Molecule.dev

Budget Planner

Finance · React + Node (Express) · 16 @molecule/* packages

YNAB-like envelope budgeting with categories, assignments, spending reports, and goal tracking — with built-in Stripe-backed subscription tiers

Open in Molecule

Try it

Opens instantly. Runs on sample data, so changes reset on reload.

Open preview in a new tab ↗View workspace ↗

What is inside

Screens (20)

  • Landing /
  • Login /login
  • Signup /signup
  • ForgotPassword /forgot-password
  • ResetPassword /reset-password
  • Budget /budget (signed in)
  • Accounts /accounts (signed in)
  • Transactions /transactions (signed in)
  • Goals /goals (signed in)
  • Reports /reports (signed in)
  • Settings /settings (signed in)
  • Dashboard /dashboard (signed in)
  • AccountDetail /accounts/:id (signed in)
  • TransactionDetail /transactions/:id (signed in)
  • GoalDetail /goals/:id (signed in)
  • Categories /categories (signed in)
  • AddTransaction /transactions/new (signed in)
  • ImportTransactions /import (signed in)
  • Profile /settings/profile (signed in)
  • Billing /settings/billing (signed in)

Data model (8 tables)

  • budget_accounts — id, user_id, name, type, institution, mask, balance, on_budget, …
  • budget_categories — id, user_id, name, group_name, sort_order, archived, created_at, updatedAt
  • budget_transactions — id, user_id, account_id, category_id, payee, amount, type, date, …
  • devices — id, createdAt, updatedAt, userId, name, pushPlatform, pushSubscription, hasPushSubscription
  • envelopes — id, user_id, category_id, month, year, assigned, activity, created_at, …
  • goals — id, user_id, category_id, name, target_amount, saved_amount, monthly_contribution, target_date, …
  • payments — id, createdAt, updatedAt, userId, transactionId, productId, platformKey, data, …
  • budget_notifications — id, user_id, type, title, body, href, unread, created_at, …

API (10 handlers)

  • accounts api/src/handlers/accounts.ts
  • categories api/src/handlers/categories.ts
  • envelopes api/src/handlers/envelopes.ts
  • goals api/src/handlers/goals.ts
  • import_export api/src/handlers/import_export.ts
  • notifications api/src/handlers/notifications.ts
  • payments api/src/handlers/payments.ts
  • profile api/src/handlers/profile.ts
  • reports api/src/handlers/reports.ts
  • transactions api/src/handlers/transactions.ts

Subscription tiers

free / pro / team — gated by: maxAccounts, maxCategories, maxEnvelopes, maxTransactions, advancedFeatures, canExport, retentionDays

Built from 16 @molecule/* packages

Browse all @molecule/* packages →

Required secrets

  • DATABASE_URL PostgreSQL connection string

The @molecule/* packages are Apache-2.0. The app you build from this template is yours to export and self-host. Licensing