VIBE CODING CASE STUDY

From Zero to Enterprise Platform with AI-Assisted Development

How a solo developer built a 51,000-line enterprise HR platform with 2,079 tests across 9 iterations using Claude Code, GitHub Copilot, and modern AI-powered workflows.

9
Dev Iterations
51K
Lines of Code
2,079
Tests Written
111
Python Modules

What Is Vibe Coding?

A development philosophy where AI handles the bulk of code generation while the human focuses on architecture, quality, and product direction.

Vibe coding isn't about letting AI write random code. It's a disciplined workflow where you describe what you want at a high level — the architecture, the constraints, the user experience — and then collaborate with AI tools to produce production-quality code at a pace that would be impossible alone.

The key insight: AI excels at the "how" (implementation) while humans excel at the "what" and "why" (product decisions, architecture, quality standards).

Human Responsibilities

  • 🧭 Architecture decisions and system design
  • 🎯 Product requirements and acceptance criteria
  • 🔍 Code review and quality gating
  • 🧪 Testing strategy and edge case identification
  • 🔒 Security and compliance requirements
  • 📋 Iteration planning and prioritization

AI Responsibilities

  • ⚡ Rapid code generation from specs
  • 🧪 Comprehensive test suite generation
  • 🔧 Boilerplate and CRUD scaffolding
  • 📝 Documentation and docstrings
  • 🐛 Bug identification and fix suggestions
  • 🔄 Refactoring and code cleanup
"The platform doesn't sleep. An AI-powered HR assistant means employees in any timezone get instant, policy-accurate answers at 2 AM or 2 PM — no waiting for HR to open in another country. That's the real value of an AI agent: it solves the international timezone problem." — Core design principle for 24/7 global HR support

The AI-Powered Development Stack

Five tools working in concert, each playing a distinct role in the development workflow.

🟣

Claude Code

Primary development engine. Architecture design, multi-file code generation, complex agent logic, testing strategies, and iterative refinement.

~60%

of total code output

🤖

GitHub Copilot

In-editor companion for real-time autocomplete, inline suggestions, and maintaining code consistency across modules.

~20%

inline completions

🎨

Figma

Visual design tool for UI mockups and component layouts. Designs are translated to code via Claude Code, ensuring pixel-accurate implementation.

UI

design-to-code pipeline

🚀

Antigravity

Manual UI testing tool for visual QA, interactive flow validation, and catching UX issues that automated tests miss. The human-in-the-loop quality gate before deployment.

QA

manual UI verification

🎭

Playwright

Automated browser testing with 14 spec files covering login, dashboard, chat, role switching, mobile responsiveness, and API health.

14

browser test suites

How the Tools Work Together

Each tool has a sweet spot — the key is knowing when to use which.

TaskPrimary ToolWhy
Design new agent architectureClaude CodeMulti-file reasoning, understands system-wide implications
Implement agent from specClaude CodeGenerates complete modules with tests in one pass
Fill in function bodiesCopilotFast inline completions from surrounding context
Write API route handlersClaude Code + CopilotClaude generates structure, Copilot fills patterns
Fix integration issuesCopilotReal-time suggestions while debugging in editor
UI/UX design mockupsFigmaVisual component design before writing any code
Design → code translationFigmaClaude CodeFigma provides the visual spec, Claude generates the code
Generate test suitesClaude CodeComprehensive edge case coverage from spec understanding
Manual UI testingAntigravityVisual QA, interactive flows, catches what automation misses
Browser E2E testingPlaywright14 spec files testing real user flows across browsers
CI/CD pipeline debuggingClaude CodeLog analysis, config fixes, deployment troubleshooting

Vibe Coding Workflow Loop

The iterative cycle used for every feature and iteration.

1. Define Spec
2. AI Generate
3. Test
4. Review & Refine

Each iteration follows this cycle: human writes the spec → AI generates code + tests → run tests → review, fix, iterate. The human stays in the driver's seat on architecture and quality.

Build Timeline — 9 Iterations

From a simple chatbot to an enterprise-grade multi-agent platform, one iteration at a time.

Iteration 1 — Foundation

Nov 2025

Transformed the Human Rights Education chatbot into a multi-agent architecture. Built auth system, RBAC with 5 permission levels, 7 core agents, RAG with ChromaDB, and HRIS connectors for Workday & BambooHR.

163 tests passing 16 modules 7 agents

Iteration 2 — Workflows & Compliance

Early Feb 2026

Added leave request workflows with multi-level approval chains, GDPR compliance framework, bias audit logging, policy violation detection, and employee lifecycle management.

Leave approval chains GDPR framework Bias audit

Iteration 3 — Database & Persistence

Feb 2026

PostgreSQL schema with 15+ tables, SQLAlchemy ORM models, Alembic migrations, Flask integration with session management, conversation history, and frontend UI rebuild.

15+ tables SQLAlchemy ORM Frontend rebuild

Iteration 4 — LLM Gateway

Feb 2026

OpenAI GPT-4 integration as primary model, Google Gemini fallback, cost tracking per request, streaming support, token counting, and LangSmith tracing integration.

Multi-model Auto-failover Cost tracking

Iteration 5 — DevOps & Integrations

Feb 2026

Docker + Docker Compose setup, GitHub Actions CI/CD, Slack bot with /hr commands, Microsoft Teams adaptive cards, Redis conversation memory, and env-specific configs.

Docker CI/CD Slack + Teams

Iteration 6 — Security & Metrics

Feb 2026

PII detection and automatic masking, API rate limiting (60 req/min), security headers, request encryption, Prometheus metrics, and Grafana dashboards.

PII masking Rate limiting Prometheus

Iteration 7 — CCPA & Multi-Jurisdiction

Feb 2026

CCPA implementation, multi-jurisdiction engine (US, EU, Canada, Australia), data localization enforcement, right-to-erasure automation, WebSocket support, Redis caching.

CCPA 4 jurisdictions WebSocket

Iteration 8 — Platform & Enterprise

Feb 2026

Admin API, health check endpoints (live/ready), feature flags, SLA monitoring, audit reports with export, backup/restore system, feedback collection.

Admin API Health checks Feature flags

Iteration 9 — Expanded Org & QA

Feb 8, 2026

Expanded from 3 demo users to 67-employee org (8 departments, management hierarchy). 6 multi-role case studies, auth upgrade to resolve real tokens, file reorganization.

67 employees 50/50 case study tests 100% pass rate

Final — CI/CD, Deployment & Polish

Feb 17, 2026

Google Cloud Run deployment, CI pipeline with Black/Flake8, 17 CI bug fixes in one day, Playwright E2E tests adapted for cloud, gap analysis and final polish.

Cloud Run deployed 14 Playwright specs 17 commits in 1 day

The Testing Story

How AI-generated tests evolved from basic assertions to comprehensive coverage.

2,079
Test Functions
29,515
Lines of Test Code
0.57:1
Test:Code Ratio

Testing Layers

LayerFilesWhat It TestsAI Tool Used
Unit Tests68 filesEvery module individually — agents, core services, middleware, APIs, connectorsClaude Code generated, human reviewed
Integration TestsFrontend flowsFull user journeys through the web interfaceClaude Code + manual validation
E2E Chatbot TestsConversation runnerMulti-turn agent conversations with expected output validationClaude Code designed scenarios
Playwright Browser Tests14 spec filesLogin, dashboard, chat, roles, leave, analytics, documents, mobile, APIPlaywright framework + Claude Code specs
Case Study Tests6 scenariosMulti-role HR scenarios across departments (50 assertions, 100% pass)Claude Code + domain knowledge

Playwright E2E Coverage

14 browser test suites testing the real deployed application

00-smoke (health check)
01-login (auth flows)
02-dashboard (widgets)
03-settings (preferences)
04-role-switching (RBAC)
05-leave (workflows)
06-workflows (approvals)
07-analytics (charts)
08-documents (downloads)
09-chat (agent conversations)
10-api-health (endpoints)
11-notifications (alerts)
12-pdf-export (documents)
13-mobile-responsive (viewport)

By the Numbers

Quantified output from the vibe coding approach.

MetricValueNotes
Total source code51,423 lines111 Python modules in src/
Total test code29,515 lines68 test files + 14 Playwright specs
Test functions2,079Unit + integration + E2E + case studies
Frontend31 filesHTML/Jinja2 templates + CSS + JS
Development iterations9 iterationsEach with progress report and test suite
Agents built8 + routerPolicy, Benefits, Leave, Employee, Onboarding, Performance, Compliance, Analytics
HRIS connectors4Workday, BambooHR, Payroll, Custom DB
Compliance frameworks4GDPR, CCPA, HIPAA, multi-jurisdiction
CI/CD pipelineGitHub Actions → Cloud RunLint, test, build, deploy — fully automated
Git commits (deploy day)17 commits in 1 dayFeb 17: CI fixes, bug fixes, final polish

Key Learnings from Vibe Coding

✅ What Worked

  • • Claude Code for architecture-level code generation — entire modules with tests in one pass
  • • Copilot for in-editor flow — fills in patterns and maintains consistency
  • • Playwright for catching UI regressions that unit tests miss
  • • Iterative development with clear specs per iteration
  • • AI-generated tests caught real bugs before manual testing

⚠️ Watch Out For

  • • AI can generate plausible-looking but subtly wrong code — always review
  • • Test coverage numbers can be misleading if tests don't assert the right things
  • • Architecture decisions still require human judgment — AI follows, doesn't lead
  • • Integration issues between AI-generated modules need manual debugging
  • • CI/CD setup took 17 commits in one day to get right — pipelines are fiddly
"Vibe coding is not about replacing developers — it's about amplifying them. One developer with the right AI tools can build what would traditionally take a small team. The human brings the vision, the AI brings the velocity." — Reflection on the development process

Understanding LLM Boundaries

The most important skill in vibe coding isn't prompting — it's knowing where LLMs break down and designing your workflow around those limits.

Building a 51K-line platform with AI taught me that effective AI-assisted development requires understanding exactly where hallucination creeps in, which models excel at which tasks, and when to bring in manual human verification. Blindly trusting any single model is how projects fail.

Where LLMs Hallucinate — And How I Caught It

Hallucination isn't random — it follows patterns. Knowing the patterns lets you build guardrails.

Hallucination PatternReal Example from This ProjectHow I Caught / Prevented It
Confident but wrong API usageGenerated LangGraph code using deprecated .add_node() signatures that looked correct but failed at runtimeAlways run generated code immediately; never trust "it looks right"
Phantom importsReferenced non-existent Flask extensions and SQLAlchemy methods that don't exist in the installed versionsCI pipeline with strict linting catches import errors before merge
Plausible but wrong logicGDPR compliance checks that passed tests but missed edge cases — e.g., data retention for terminated employeesDomain-specific code review; AI doesn't understand legal nuance
Test hallucinationGenerated tests that asserted the wrong thing — tests passed but didn't actually validate the featureManual review of every test assertion; check what's being tested, not just pass/fail
Configuration driftDocker configs that worked locally but had subtle env var differences for Cloud Run17 CI commits in one day to fix deployment — some things need hands-on debugging

Right Model for the Right Job

No single LLM is best at everything. The key insight: treat models like specialized team members, each with their own strength.

Backend & Architecture

Claude Code (Sonnet / Opus)

  • 🟣 Multi-file agent architecture across 111 modules
  • 🟣 LangGraph orchestration with complex state graphs
  • 🟣 Full test suite generation with edge case coverage
  • 🟣 CI/CD pipeline debugging and deployment configs
  • 🟣 Database schema design and migration scripts
Best at: System-level reasoning, multi-file changes, complex logic

Frontend & UI

Figma → Claude Code → Antigravity

  • 🎨 Figma for visual design and component mockups
  • 🤖 Claude Code for converting designs to HTML/CSS/JS
  • 🔵 GitHub Copilot for in-editor frontend tweaks
  • 🧪 Antigravity for manual UI testing and visual QA
  • 🎭 Playwright for automated browser E2E regression
Best at: Design-to-code, visual consistency, cross-browser testing

In-Editor Flow

GitHub Copilot

  • ⚡ Real-time autocomplete while coding
  • ⚡ Pattern completion from surrounding context
  • ⚡ Boilerplate and repetitive code blocks
  • ⚡ Quick bug fixes during live debugging
Best at: Speed, inline suggestions, staying in flow state

Manual QA & Visual Testing

Antigravity

  • 🔍 Manual UI testing that catches what automation misses
  • 🔍 Visual regression detection across viewport sizes
  • 🔍 Interactive flow testing with real user behavior
  • 🔍 Final human-in-the-loop QA before deployment
Best at: Catching visual bugs, UX issues, human-judgment QA

The Multi-Model Workflow in Practice

A real feature built using all tools in their optimal roles.

Figma
Design mockup
Claude Code
Backend + Frontend
Copilot
Polish & tweaks
Antigravity
Manual UI QA
Playwright
Automated E2E

Example — Leave Management Dashboard: Designed layout in Figma → Claude Code generated Flask route + Jinja2 template + JS → Copilot refined in-editor styling → Antigravity tested interactive flows manually → Playwright automated the regression suite.

"The question isn't 'Can AI build this?' — it's 'Where does AI break on this?' Finding the hallucination boundary for each model is the real engineering skill. Once you map those limits, you know exactly which tool to reach for and when to step in yourself." — Key takeaway from building with multiple AI models