vibe-code-webapp

Guides building production web apps from idea interview through validation, build pack, audit, and scripted deployment.

1|Updated Aug 7, 2026
One-click install
npx skills add https://github.com/Deepak-ai-93/deepak-skill --skill vibe-code-webapp-deepak-ai-93
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: vibe-code-webapp
Source: https://github.com/Deepak-ai-93/deepak-skill/tree/main/skills/vibe-code-webapp
Command: npx skills add https://github.com/Deepak-ai-93/deepak-skill --skill vibe-code-webapp-deepak-ai-93

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve? Turning a rough app idea into a production-ready web application usually fails on missing structure: no research, no validation, no locked design, no task list, and no deploy plan. This Skill provides an end-to-end staged workflow (onboard → research → validate → build pack → build → audit → deliver) so an AI coding agent builds what was actually approved instead of guessing. ## Core Features & Use Cases - Idea interview and project scan: Onboards new ideas with a detailed questionnaire, or scans an existing codebase (scan-project.mjs) so plans extend what already exists. - Research and SaaS validation: Keyless demand research (Reddit, Google Trends) plus a /35 scorecard (saas-score.mjs) producing a BUILD / ITERATE / PIVOT verdict with kill criteria. - Deterministic build pack: pack-builder.mjs turns one validated JSON into PRD.md, stack-blueprint.md, sitemap.md, and TODO.md, with a user approval gate before any code is written. - Audit and scripted delivery: audit-webapp.mjs checks production readiness (secrets, auth, payments, AI rails), deploy-setup.mjs generates host config, CI, and a deploy runbook, and package-deliverable.mjs bundles the handoff. - Use Case: Tell your agent "I want to build a SaaS for freelancers with Next.js" and it interviews you, validates the idea, generates the full build pack for your approval, then builds, audits, and deploys it step by step. ## Quick Start Ask your AI coding agent to use the vibe-code-webapp skill to turn your app idea into a validated build pack and start building it step by step.

Frequently Asked Questions about vibe-code-webapp

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I turn an app idea into a production-ready web app with an AI agent?

Run the vibe-code-webapp workflow: it interviews you about the idea, researches demand, scores it with a SaaS validator, and generates a build pack (PRD, stack blueprint, sitemap, TODO list). Only after you approve the pack does the agent write code, then audit and deploy it.

How do I validate a SaaS idea before building it?

Use the built-in SaaS validator: research-idea.mjs pulls Reddit and Google Trends signals without API keys, and saas-score.mjs scores seven criteria out of 35. Scores of 30+ return BUILD, 25-29 ITERATE, and below 25 PIVOT, with kill criteria and unit economics checks.

Can I use this with an existing Next.js project instead of starting fresh?

Yes. Existing-project mode runs scan-project.mjs first to capture the current stack, routes, data model, and gaps, then plans the extension on top of what exists. The existing stack stays the default unless you explicitly choose to re-platform.

Does the build pack work with Lovable, Bolt, or v0?

Yes. The pack is tool-agnostic: CLI agents like Claude Code, Cursor, or Codex build from BUILD.md, while web builders consume the paste-ready handoff mega-prompt in stack-blueprint.md carrying pages, design tokens, data model, and feature order.

What does the production audit check before deployment?

audit-webapp.mjs scans for app entry, run scripts, .env.example, hardcoded secrets, auth, database, payments, error handling, validation, tests, CI, deploy config, analytics, and SEO. Optional --payments and --ai flags add billing and AI-feature checks like streaming, abort handling, and key hygiene.

Why does the skill refuse to write code before approval?

The approval gate is a hard invariant: no scaffolding happens until the user approves the build pack and TODO list via todo.mjs confirm. This prevents agents from guessing requirements and building the wrong thing.