Build a 'micro' app in 7 days: from ChatGPT prompt to deployed web tool

Ship a production-ready micro app in 7 days: a hands-on, time-boxed walkthrough for engineers

Hook: If you’re an engineer stuck wasting days wiring up one-off scrapers and prototypes, this is your 7-day playbook to go from ChatGPT prompt to a deployed, maintainable micro app — using LLM-assisted coding, a minimal serverless backend, and a small CI/CD pipeline you can reuse across projects.

Why this matters in 2026

Since late 2025, LLMs with larger context windows, reliable function calling, and developer-focused products like Anthropic’s Claude Code and Claude Cowork have made rapid, reliable prototyping faster than ever. Teams are shipping Micro Apps — focused, single-purpose web tools — that replace slow vendor evaluation cycles and let engineers automate recurring tasks in days, not months. This approach mirrors Rebecca Yu’s 7-day micro-app workflow but emphasizes production-readiness: observability, CI/CD, secrets management, and legal compliance.

What you’ll get from this guide

• A day-by-day 7-day sprint plan that an engineer can follow
• Concrete LLM prompts you can paste into ChatGPT/Claude
• Minimal backend and serverless deployment patterns (Cloudflare Workers/Vercel)
• Sample CI/CD (GitHub Actions) and deployment scripts
• Production hardening tips: monitoring, rate limits, secrets, and legal checks

Before you start: scope and constraints (Day 0)

Time-boxing is everything. Pick a micro app that solves a single pain point for you or your team — e.g., a web scraper that extracts pricing from one vendor and posts normalized records to a Slack channel, or a utility that accepts a link and returns structured metadata.

Set strict constraints:

• Time: 7 days total
• Users: internal or small beta (<= 50)
• Stack: React (or Svelte) front-end, serverless functions for backend (Cloudflare Workers or Vercel Edge), and GitHub Actions for CI

The 7-day plan (high level)

1. Day 1 — LLM-assisted scaffold: app skeleton, file structure.
2. Day 2 — Front-end UI components and basic flows.
3. Day 3 — Minimal serverless backend and data model.
4. Day 4 — Integrate LLMs (LLM prompts, function calls) or scraping logic.
5. Day 5 — Add auth, secrets, and rate limiting.
6. Day 6 — CI/CD, tests, and end-to-end deployment.
7. Day 7 — Hardening: metrics, alerts, legal checks, and launch.

Day 1 — LLM-assisted scaffold (4–6 hours)

Use an LLM to generate a reproducible starter. Tell the model your exact constraints and ask for a repository skeleton with package.json, a simple React page, an API endpoint, and a README with run instructions.

Prompt (paste into ChatGPT/Claude):

“You’re an expert JS engineer. Create a Git repo scaffold for a micro app named ‘micro-scraper’. Use Vite + React, and a serverless function at /api/scrape. Include package.json scripts: dev, build, start, deploy. Output only files and contents in a tree format and a short README.”

The LLM will give you a starting tree. Run it, validate with npm install, and commit immediately. This creates momentum.

Day 2 — Front-end: build the UI quickly (4–8 hours)

Keep UI minimal and test-driven. Use Tailwind or shadcn/ui components for speed. Your UI should let a user: paste URL, choose options, submit, and show results with status updates.

Example component flow:

• Form -> POST to /api/scrape -> show job ID
• Polling or WebSocket for job status
• Result rendering with copy/download

LLM prompt: generate the React form

“Write a React component that posts a URL to /api/scrape. Use fetch, show loading state, display JSON response prettified. Keep it under 80 lines.”

Day 3 — Minimal serverless backend (6–10 hours)

Serverless is ideal for micro apps: low ops and predictable cost. For 2026, Cloudflare Workers and Vercel Edge Functions are preferred for low-latency serverless deployment. If you need headful scraping, consider a managed Playwright service or a small EC2/ECS task.

Simple API design

• POST /api/scrape — starts a job (returns job_id)
• GET /api/jobs/:id — returns status and result

Example Cloudflare Worker (edge function)

addEventListener('fetch', event => {
  event.respondWith(handle(event.request))
})

async function handle(req) {
  const url = new URL(req.url)
  if (req.method === 'POST' && url.pathname === '/api/scrape') {
    const body = await req.json()
    const jobId = 'job_' + Date.now()
    // enqueue to KV or Durable Object (simple pattern)
    await SCRAPE_KV.put(jobId, JSON.stringify({status: 'queued', url: body.url}))
    return new Response(JSON.stringify({jobId}), {headers: {'content-type': 'application/json'}})
  }
  return new Response('Not found', {status: 404})
}

Use durable storage (Cloudflare Durable Objects, R2, Redis) for job state if you expect concurrency.

Day 4 — Integrate LLMs or scraping logic

Decide: will your app call an LLM to normalize content, or run a headless browser to extract data? Both work. In 2026, function calling and RAG (retrieval-augmented generation) make LLM outputs more reliable. For scraping, consider Playwright + a lightweight proxy pool or using an API-based scraper (ScrapingBee, Zyte) to avoid low-level proxy ops.

LLM-assisted parsing pipeline (example)

1. Serverless function fetches HTML (or takes scraped text).
2. Send structured prompt + function_call to an LLM to extract fields.
3. Store normalized result in a DB and return to UI.

// pseudo-code: call LLM with function spec
const response = await openai.chat.completions.create({
  model: 'gpt-4o-mini',
  messages: [ {role: 'user', content: 'Extract name, price, rating from this HTML: ...'} ],
  functions: [{name: 'extract_product', parameters: {...}}]
})
// Model returns a function_call with JSON payload

This pattern reduces hallucinations because you force a JSON schema via function calling.

Day 5 — Auth, secrets, and rate limiting

At this point your micro app works locally. Add these production essentials:

• Secrets: Store API keys (LLM, proxy) in your platform’s secret manager (Vercel/Cloudflare/GitHub Secrets).
• Auth: Team-only micro apps can use GitHub OAuth or a simple bearer token in headers. For public beta, use NextAuth or Clerk.
• Rate limits: Prevent abuse using token buckets or Cloudflare rate-limiting rules. Queue expensive jobs and provide billing or quota per user.

Prompt to add auth middleware

“Add a middleware that validates a bearer token in Authorization header against a list in environment variable ALLOWED_TOKENS. Return 401 if missing.”

Day 6 — CI/CD, tests, and deployment

Automate deployment with GitHub Actions and deploy to Vercel or Cloudflare Pages. Keep the pipeline small: run lint, unit tests, build, then deploy.

Minimal GitHub Actions workflow (deploy to Vercel)

name: CI
on: [push]
jobs:
  build-deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: 20
      - run: npm ci
      - run: npm test --if-present
      - run: npm run build
      - name: Vercel Deploy
        uses: amondnet/vercel-action@v20
        with:
          vercel-token: ${{ secrets.VERCEL_TOKEN }}
          vercel-org-id: ${{ secrets.VERCEL_ORG_ID }}
          vercel-project-id: ${{ secrets.VERCEL_PROJECT_ID }}

For Cloudflare Workers, use wrangler in CI and deploy to the workers environment using CF API tokens.

Day 7 — Hardening, monitoring, legal checks, and launch

Finish with production hygiene:

• Monitoring: Add error tracking (Sentry, Honeycomb), request logs, and synthetic health checks.
• Observability: Export metrics (requests, failed jobs, LLM token usage), set up alerts on cost thresholds to avoid surprise bills.
• Compliance: Check target site’s robots.txt and terms of service before scraping. If capturing PII, ensure secure storage and retention policy.
• Cost controls: Track LLM tokens and set hard caps; use smaller models for routine tasks and escalate to larger ones only when needed.

“I built Where2Eat in a week using Claude and ChatGPT — you don’t need a full team to ship something useful.” — Rebecca Yu (summarized)

Advanced strategies & 2026 trends to adopt

• Orchestrate LLMs and tools: Use LLM-agents sparingly for automation (Anthropic’s Claude Code / Cowork is improving developer workflows for local file access; use them for code-gen, not as the single source of truth).
• Edge compute for low latency: Deploy inference/logic at the edge when user experience demands sub-50ms responses (Vercel Edge Functions, Cloudflare Workers).
• Hybrid scraping: Combine lightweight HTML parsing with an LLM for normalization — faster and cheaper than full headless runs for most tasks.
• Model governance: Keep auditable prompts and use function-call schemas to ensure consistent outputs and reduce hallucinations.

Builder’s checklist: code snippets, repo layout, and SDKs

Use this repeatable skeleton across projects:

• /src/ui — React components
• /src/api — serverless endpoints
• /tests — unit and integration tests
• /infra — deployment configs (vercel.json / wrangler.toml)
• /scripts — lint, format, local start

Recommended SDKs and tools (2026):

• Playwright or Playwright Cloud for headful scraping (consider managed options)
• Axios/fetch for HTTP; node-html-parser or cheerio for fast parsing
• OpenAI/Anthropic SDKs with function-calling support
• Sentry / Honeycomb for observability
• Vercel / Cloudflare for serverless deployment

Example: small scraper + LLM normalization flow (code sketch)

// /api/scrape - pseudo code
export async function POST(req) {
  const {url} = await req.json()
  // quick fetch (avoid heavy headless unless necessary)
  const html = await fetch(url).then(r => r.text())
  // quick parse
  const parsed = parseHtmlWithCheerio(html)
  const rawData = {title: parsed('title').text(), prices: parsed('.price').text()}
  // call LLM for normalization
  const normalized = await callLLMToNormalize(rawData)
  // store result
  await DB.put('latest:' + normalized.id, JSON.stringify(normalized))
  return new Response(JSON.stringify(normalized), {headers: {'content-type': 'application/json'}})
}

Prototype → Prod: operational checklist

• Secrets rotated and moved to a secrets manager
• Rate limits and quotas in place
• Alerting on error rate and LLM spend
• Access control for internal vs external users
• Automated deploy pipeline with a protected main branch (see CI/CD patterns)

Legal & ethical considerations

Scraping and LLM usage carry legal risks. Run a short legal checklist before launch:

• Check robots.txt and target site Terms of Service
• Avoid collecting or retaining sensitive personal data
• Document data usage and retention policies
• Rate-limit to avoid DDoS-like behavior

When in doubt, use a partner scraper API that handles compliance and proxies.

Real-world example: Where2Eat-style rapid build (adapted for engineers)

Rebecca Yu’s Where2Eat is a model for fast iteration. For engineers, replicate the vibe-coding pattern but add production hygiene:

1. Day 1: scaffold app with LLM
2. Day 2–3: MVP UI and job queue
3. Day 4: add LLM normalization and cache
4. Day 5–6: secure and automate deployment
5. Day 7: launch, monitor, iterate

Takeaways and actionable checklist

• Time-boxed scope: Fix the problem, not feature creep — ship a single workflow.
• LLM as accelerator: Use LLMs for scaffolding, parsing aids, and generating tests — avoid treating them as oracle.
• Serverless first: Use edge/serverless to reduce maintenance; pick a managed headless/Playwright option if you need browsers.
• Automation: One small CI workflow (lint/test/build/deploy) is enough for early-stage micro apps.
• Production hygiene: Secrets, rate limits, monitoring, and legal reviews are needed before inviting users.

Further reading & references (2025–2026)

• Rebecca Yu — Where2Eat writeup (Substack) — inspiration for rapid micro apps
• Anthropic — Claude Code and Cowork (late 2025 preview) — developer-focused LLM tools
• Vercel/Cloudflare docs — Edge Functions and serverless deployment patterns

Start your 7-day sprint now

Ready to build? Create a repo with the scaffold, run the LLM scaffold prompt, and follow the 7-day plan day-by-day. If you want a starter repo, clone the micro-scraper template we use internally (includes GitHub Actions and Vercel config) and replace the scraping logic with your first endpoint.

Call to action: Kick off a focused 7-day sprint with your team this week. Clone the starter repo, run the LLM prompts above, and deploy the first version to Vercel. Share feedback or a link to your micro app in your team chat — iterate from real usage data, not assumptions.

Related Reading

• Edge AI at the Platform Level: On‑Device Models, Cold Starts and Developer Workflows (2026)
• Review: Top Monitoring Platforms for Reliability Engineering (2026)
• Privacy by Design for TypeScript APIs in 2026
• Hybrid Edge–Regional Hosting Strategies for 2026
• Age Verification Compliance Playbook for EU Small Businesses Using TikTok and Other Platforms
• How to Build a Safe Online Presence in Bahrain: Lessons from Hollywood Directors
• Rehab on Screen: How Medical Dramas Have Portrayed Addiction and Recovery
• Pitching Your Comic Book IP to Agencies: What The Orangery’s WME Deal Teaches Indie Creators
• Hot-Water Bottles vs Rechargeable Heat Pads: Best Picks for Menstrual Cramp Relief and Recovery