A CRM the size of the problem: localStorage, 8 stages, and a pasteable Apps Script

A freelance lead tracker that skips the backend entirely — localStorage for persistence, and Google Sheets sync through an Apps Script the app generates for you to paste.

The Lead Tracker is a demo build of the tool I'd want for freelance outreach: a Today queue that answers "who do I contact right now", a pipeline board with eight stages from New to Won/Lost, and lead details with notes, scores, and next-action dates. It ships in demo mode with 25 fictional seed leads so the board is explorable before you enter anything.

Stack: React 19, TypeScript, Vite, Tailwind CSS v4. No backend at all.

Persistence without a server

Solo-freelancer outreach doesn't need multi-user sync, auth infrastructure, or a database bill. State lives in localStorage, keyed separately for demo and real data so trying the demo can't touch your actual leads.

The interesting part is the escape hatch. If you want your leads somewhere durable and shareable, the app syncs with a Google Sheet — not through an API key or OAuth setup, but through a Google Apps Script the app hands you as copy-paste code. You paste it into your sheet's script editor, deploy it as a web app, and paste the resulting URL back into settings.

1export async function syncLeadsToSheets(url: string, leads: Lead[]): Promise<boolean> {2  const response = await fetch(url, {3    method: 'POST',4    mode: 'cors',5    headers: {6      'Content-Type': 'text/plain', // Using text/plain to prevent pre-flight CORS blocks on simple Apps Script setups7    },8    body: JSON.stringify({9      action: 'saveAll',10      leads: leads,11    }),12  });13 14  if (!response.ok) {15    throw new Error(`Failed to save leads to sheet: ${response.statusText}`);16  }17 18  const result = await response.json();19  return result.status === 'success';20}

The text/plain content type is doing quiet work there: Apps Script web apps don't answer CORS preflights, so the request has to stay "simple" — application/json would trigger an OPTIONS preflight and fail before the data ever left the browser.

The pipeline is a type

The eight stages are a union type, and the board columns derive from it — adding a stage is a one-line change that the type checker propagates:

1status: 'New' | 'Contacted' | 'Followed up' | 'Replied' | 'Call booked' | 'Quoted' | 'Won' | 'Lost';

What I'd improve

• saveAll rewrites the whole sheet each sync — fine for hundreds of leads, wasteful beyond that; a diff-based sync would scale better.
• localStorage means one browser owns the data until you sync; export/import as JSON would be a cheap safety net.
• The main App component has grown large; the board and queue views are due to be split out.

One of eight small-business demos on this site. Projects · Get a quote