Uncategorized

Your Vibe-Coded App Is Leaking Data

Mike Kwal
· 10 min read

What’s in this article

🚀 Plug this into Claude Code or Claude Desktop

This spec gives you the full 5-step security checklist, the exact prompts I use to make Claude act as a security auditor, and sample config files for Netlify and Replit to set secure defaults. Don’t just read about it — implement it.

Want hands-on help applying this to your agency’s projects? Join the Talk-to-Build community for weekly office hours or book a 1-on-1 working session.

You can now build a real, working app with a few sentences of plain English. You can ship it to a public URL in minutes on platforms like Netlify, Replit, or Lovable. This is the magic of what I call “vibe-coding.”

Last week, security researchers found the dark side of that magic: 380,000 of these AI-built apps were publicly leaking sensitive data. Healthcare records, financial information, internal company documents. All sitting open on the web.

The problem isn’t the AI. The problem is that we’re shipping faster than our security habits can keep up. This post is the fix: a ten-minute checklist that blocks most of these leaks. It’s for designers, agency owners, and anyone shipping fast with AI who doesn’t want their client’s name in the next headline.


What actually happened

A recent security report detailed how around 380,000 assets — apps, databases, APIs — built with AI coding assistants were accidentally exposed. These weren’t sophisticated hacks. They were open doors. The apps were built by non-technical founders and designers using tools that turn natural language into code, then deployed on platforms like Netlify, Replit, Base44, and Lovable.

The core issue is that these platforms often default to public deployments. You prompt an app, you get a link, you share the link. It works. But the AI, focused on making the app *function*, doesn’t automatically add the locks. It doesn’t build in user authentication, secure API keys, or database access rules unless you specifically ask it to.

So you end up with a fully functional app that’s also fully exposed. Anyone with the URL can access it, and sometimes, the data it’s connected to. That’s how patient records and financial data end up indexed by Google.

Default Path (Vibe-Coding)        Hardened Path (This Checklist)
──────────────────────────        ──────────────────────────────
Prompt → AI builds app            Prompt → AI builds app
   ↓                                 ↓
Deploy to Netlify (public)        1. Check environment variables
                                     ↓
                                  2. Lock down database access
                                     ↓
                                  3. Add user authentication
                                     ↓
                                  4. Run security scan (Claude)
                                     ↓
                                  5. Deploy (private by default)

The diagram above shows the gap. The default path has one step between idea and public deployment. The hardened path adds a few crucial checks. It’s a small change in process that makes a huge difference in outcome.

The AI will build you a house with no locks if you don’t ask for locks. This checklist is you asking for the locks.


Why this matters for designers and agency owners

For years, security was someone else’s problem. It was the engineer’s job. The DevOps team’s job. The client’s IT department’s job. With AI-assisted coding, that’s no longer true. If you can build it, you’re responsible for securing it.

This is a major shift. When a designer builds a client app using Claude Code and deploys it on Netlify, there is no engineering team to pass the buck to. You are the engineering team. Your client, who hired you for your design taste, is trusting you to handle the technical details they don’t understand.

They assume security is built-in. They assume their customer data is safe. When it’s not, it’s your agency’s reputation on the line. The speed of AI is a superpower, but it also shortens the distance between a simple mistake and a major data breach. We have to build new habits to match the new speed.


The 10-minute security checklist I use before any AI project goes live

This isn’t a comprehensive enterprise security audit. It’s a simple, five-step process that catches 90% of the common issues, like the ones in the 380,000 leaked apps. I run this on every MK-Way project. It takes about ten minutes.

  1. Check your environment variables. Never, ever hard-code API keys, database passwords, or other secrets directly in your code. Use environment variables. Create a .env file for local development and use the platform’s secrets management (e.g., Netlify Environment Variables) for production. Ask your AI: “Rewrite this code to pull all API keys from environment variables.”
  2. Lock down your database and API access. If your app connects to a database, make sure its access rules are as strict as possible. Don’t use a single admin user for everything. Create a specific user with read-only access if that’s all the app needs. For APIs, use tools like CORS to restrict which domains can call them.
  3. Add basic user authentication. If an app is meant for internal use or for specific users, put it behind a login. This is the single biggest step. Services like Clerk, Supabase Auth, or Netlify Identity make this a 15-minute task. You can prompt Claude: “Add user login to this app using Clerk.”
  4. Run a pre-launch security scan with an AI. This is my favorite step. I copy-paste the entire codebase into Claude 3.5 Sonnet and use a specific prompt: “Act as a senior security engineer. Review this code for common security vulnerabilities like XSS, SQL injection, and insecure direct object references. List any issues you find and provide the corrected code.” It’s not perfect, but it’s a thousand times better than nothing.
  5. Set your default deploy to private. On platforms like Netlify and Vercel, you can password-protect an entire site with a single setting. Do this for all staging and preview deployments. Only make the final, checked version public. This prevents accidental leaks during development.

That’s it. Five steps. Do them every single time. It’s the new cost of shipping fast.


What this changes for designer-run agency work

This news changes three things about how a design or creative agency should operate in the AI era. It’s not just about process; it’s about business model.

Security hardening is now a billable line item. You should add a “Security & Deployment Hardening” phase to every proposal for an app or dynamic website. It’s real work that provides real value. I price this as a flat fee, typically 10-15% of the project build cost. It’s an easy sell when you can point to headlines about 380,000 data leaks.

Your professional liability just went up. If you ship an insecure app that leaks client data, you could be held liable. Review your client contracts and your professional liability insurance. Your contract should have a clause that clearly defines the scope of your security responsibility and limits your liability. Don’t skip this.

This is a competitive advantage. Most designers and small agencies are still just focused on making things look good. The ones who can also talk intelligently about securing what they build will win the better clients. Being the designer who says, “Here’s how we’ll protect your customer data,” builds immense trust and lets you charge a premium.

The bottom line: treating security as a feature is no longer optional. It’s a core part of the service for any agency building on the modern web.


My $0.02 — How I’d roll this out for a design business

If you run an agency, here’s the three-day playbook I’d use to make this standard practice without slowing your team down.

Day 1 — Audit your active projects. Don’t panic. Just get a clear picture. Make a list of every app or site you’ve deployed in the last six months. Run the 5-step checklist on each one. Use a simple spreadsheet: Project Name, URL, Step 1 Pass/Fail, Step 2 Pass/Fail, etc. Identify the 1-2 projects with the highest risk and fix them first.

Day 2 — Standardize the checklist. Turn the five steps into a mandatory template in your project management tool (monday.com, Asana, whatever you use). Make it a sub-task list on every “Deploy” or “Launch” ticket. No project can be marked as complete until the security checklist is done. This builds the habit into your workflow.

Day 3 — Communicate to clients and update your proposals. For existing clients, send a brief, confident email: “As part of our commitment to best practices, we’re implementing an enhanced security protocol on all projects. We’ve already audited your site and confirmed it meets these standards.” For new proposals, add the “Security Hardening” line item. Frame it as a standard part of a professional build, like responsive design.

I did this for my own agency, MK-Way. It took a few days of focused work, but now it’s just part of how we ship. The peace of mind for me and my clients is worth it. *If you can talk it, you can build it* — and you can secure it, too.


FAQ

Isn’t this the platform’s (Netlify, Replit) fault?
Partially. Platforms could do more to promote secure defaults. But ultimately, the person who builds and deploys the app is responsible for its configuration. The tool gives you options; you have to choose the secure ones.

Do I need to be a security expert now?
No. You need to be a security-conscious builder. You don’t need to know how to stop a state-level attack. You just need to know how to use the basic locks that come with your tools, which is what the 5-step checklist covers.

Will this slow down my shipping speed?
Barely. The checklist takes about 10-15 minutes once you’ve done it a few times. A 15-minute check is a small price to pay to avoid a multi-week data breach cleanup.

What is “Claude Security”? Is that a real tool?
It’s not a separate product. It’s a process I use: feeding my code to a capable model like Claude 3.5 Sonnet with a specific prompt asking it to act as a security auditor. It’s surprisingly effective at catching common mistakes.

Does this apply to simple static websites, or just “apps”?
It applies to anything that handles user input or connects to an API or database. If your site is just static HTML/CSS, the risk is much lower. But as soon as you add a contact form, a login, or pull data from another service, you need this checklist.

How do I explain this to a non-technical client?
Keep it simple. “Just like we build your website to work on phones and desktops, we also build in a standard set of security features to protect your business and your customers. It’s a normal part of a professional website build today.”


Want help applying this?

Four ways to go deeper:

  • Build with Builders. Join the Talk-to-Build community to learn how to Earn money with AI, Download our AI Skills, Advance your business, and learn to build real assets — AI-native websites, cinematic AI video, agent-driven workflows — that you can sell to SMBs who want the outcomes but don’t have time to learn the skills.
  • 1-on-1 working session. Skip the friction. Book a screen-share with me — bring a real problem, leave with a working piece of it.
  • Done-for-you. MK-Way builds AEO-ready websites, apps, and AI agent workflows for design agencies and founders who want it shipped fast.
  • Quick question. DM me on Instagram or connect on LinkedIn. I read every message.

This post is part of the AI Pulse atomic series. If you commented “SECURE” on one of my videos — this is the breakdown. Sources: One News Page.

Last updated: 2026-05-28.