I built (vibe-coded) an AI agent for NPS analysis
As a PMM, if you’re tracking the user sentiment and voice of customer analysis, then you can built this into an in-house app with custom logic and prompts specific to your company process.
For context, I shared a LinkedIn post last week, basically asking every product marketer, “tell me what you want vibe-coded or automated as an internal tool, and I’ll try to hack it together over the weekend.”
btw, this offer is open, you can DM/comment/tag and i’ll try to build it out for you.
And Don (Head of Growth PMM at Vimeo), shared his usecase: Analyze NPS, produce NPS reports, and organize NPS comments by theme. 🧞♂️
His current pain: Just spend LOTS of time reading, analyzing, and organizing all those comments.
That’s how it began.
tbh, it took about 14 hour-ish end to end, but the real fight was a 4½hr flow-state sprint to ship it.
URL of my AI agent for NPS analysis (will deprecate the app after 15th July)
This is my 7th side-app, so a few patterns are finally sticking. I’m sharing the full play-by-play process and the “why I did it this way”—so you can copy the bits that work and skip the bits that don’t.
1. Nail the workflow before you even open an AI code editor / any vibe coding app
Every app I’ve shipped (this is #7) keeps proving the same rule: map the data journey first. I first use pen and paper to sketch the steps, and figure out, “What does the raw file look like? What does the final chart need? What moves in between?” Getting that chain clear and helps me refine my prompts ten times cleaner.
Btw, don’t fall for those stupid Linkedin posts about AI prompts. Just ask o3/opus4 to create prompts for you using all the best practices of prompt engineering. Most important piece is context about what and how you want the input and output to behave.
Once the flow felt solid, I forced myself to keep the stack thin just a browser UI since it is an internal app. You paste your own OpenAI key, run the report, delete the key when you’re done. I processed a 50 row sample CSV file multiple times for full executive reports while testing, and this was my spend ($0.99) for o3. So don’t worry much about token unless you are adding more than 1000 rows.
Remember: Front-end-only apps work fine for an internal usecase, but you can lock them with either an IP blocklist or a password. If your API key has no spend caps, anyone can use it from the browser and burn your budget. I know this is not a best practice but this just a fast way to ship v1. You can set up the secure and better backend infra (using Replit or even Firebase) once you need tighter guardrails. It is super simple to set up. That’s why I have added security and instruction notes in the app.
2. Code it piece by piece (and don’t sweat on the fancy UI yet)
UI can suck days if you let it. It’s super subjective and you can waste time just to refine edges, padding, boxes, colors, etc. Since this was an internal tool, a “good enough” is all I needed. The win was speed: ship something that cuts the team’s grunt work at 1/10 the old cost. Polish can wait till v2.
Here’s the order I followed:
A. Kickoff Prompt for Building:
Build a frontend-only AI analytics platform for customer survey data with these requirements:
ARCHITECTURE:
- React + TypeScript with Vite build system
- Frontend-first security (session-only API key storage, XOR encryption)
- Zero server-side data persistence for privacy
- Tiered analysis packages with transparent pricing
USER JOURNEY:
- Landing page with security transparency and trust indicators
- Drag-drop CSV upload with intelligent column auto-mapping
- Real-time AI processing with progress indicators
- Interactive dashboard with drag-drop widget customization
- Professional PDF export capturing all visualizations
AI INTEGRATION:
- Custom CX analyst prompts for theme extraction
- Sentiment analysis with business context
- Competitive intelligence from survey comments
- Revenue-focused strategic recommendations
- Dual AI provider support (OpenAI + Anthropic)
SECURITY FRAMEWORK:
- Prompt injection protection (40+ suspicious patterns)
- Rate limiting with browser fingerprinting
- Input sanitization and response validation
- Content Security Policy implementation
VISUALIZATION:
- NPS score distributions and trend analysis
- Sentiment breakdown with category clustering
- Theme modeling with interactive word clouds
- Competitive benchmarking with threat assessment
- Topic modeling heatmaps with hover insights
EXPORT CAPABILITIES:
- PDF reports with html2canvas chart capture
- CSV data export with company branding
- Shareable dashboard links
- Executive summary generation
B. Data-flow sketch:
Raw CSV Upload → Column Auto-Mapping → Data Validation & Preview → AI Analysis Pipeline → Dashboard Visualization → Export & Sharing
C. AI prompt layer for charts and visualizations:
You can add create n number of combinations to create custom dashboards but here are a few key ones that covers most of the use cases.
LEVEL 1: Basic Metrics
- NPS calculation (promoters - detractors)
- Response volume and completion rates
- Basic sentiment distribution
LEVEL 2: Theme Extraction
- Custom CX analyst prompts with few-shot learning
- Semantic theme normalization and clustering
- Frequency analysis with business context
LEVEL 3: Strategic Insights
- Revenue impact assessment and priority scoring
- Competitive positioning analysis from comments
- Implementation roadmap with timeline estimates
LEVEL 4: Executive Summary
- Key findings with business significance
- Strategic recommendations with impact metrics
- Action items with ownership and deadlines
D. Security Drill-down and User Experience Lessons:
Preview data before processing - builds user confidence, you can double-check if the fields are mapped correctly.
Real-time progress indicators - essential for long AI processes
Fallback analysis - always provide some value even when AI fails
Export capabilities - users need to share insights outside the tool. my export functionality didn’t do a good job. still figuring this out. but the dashboards are pretty lit, so you can take screenshots, record a loom video etc.
FRONTEND SECURITY LAYERS:
1. Input Validation
- CSV file type and size validation
- Malicious content detection
- Path traversal prevention
2. API Key Protection
- Session-only storage with auto-expiry
- XOR encryption with random keys
- Rate limiting per browser fingerprint
3. AI Prompt Security
- Injection pattern detection (40+ patterns)
- Content sanitization before AI processing
- Response filtering for malicious content
4. Export Security
- Filename sanitization
- Content validation before PDF generation
- Download path security checks
3. Why the flow matters?
I learned the hard way on app #4 that if you skip this step you’ll drown in prompt spaghetti later. Every prompt here feeds the next, classic chaining. Example: the “theme finder” prompt sends a JSON blob; that blob plugs straight into the “graph builder” prompt. No if-else rules, just the model deciding the next move from the last output. That tiny bit of reasoning is what turns a plain simple script into a baby AI agent.
4. Replit vs. Cursor: which felt better?
Replit = if you are a marketer and have less engineering/zero then go for this. even if there is a knowledge gap in the how-to, you will still figure it out. basically you can easily build workable 1-2 step workflow apps from this.
Cursor = this god mode. the prompting and way it thinks like an engineer is super powerful. might require a decent engineering knowledge or understanding to do some stuff, especially if you are going to save user info and have some complex backend logic. I’m still mastering my UI skills in this.
You can deploy using Vercel/Netlify. I used Netlify for this particular app.
Key Implementation Tips
Keep Security In Mind: Implement the security framework, the kick off prompt covers it
Build Incrementally: Start with basic NPS calculation, then add AI features
Test with Real Data: Avoid mock data from day one - use authentic CSV samples
Focus on UX: The user journey is crucial for right output as all the logic is sequential or parallel.
Plan for Scale: Structure components for easy addition of new chart types
Document Everything: Keep detailed notes on prompts you are using for each analysis and how the data flow is connected.
TL;DR
You can build your own AI NPS agent within a week. First sketch the data flow, keep the stack lean on Replit or Cursor, and ship on Netlify. Then tweak prompts till the findings make sense for your team. Have fun, keep shipping, and touch grass often ☘️
p.s. move on from frameworks and homepage copywriting BS you see on LinkedIn. dig deep into buyer and competitor data. it helps you build launch plans that break the status quo. find that gap/insight that helps you sell/market faster.
building has never been this fast. so PMMs need to step up and match that pace.