From low code to vibe code: how we bridged the gap for internal tools

A love story

If you’ve ever built internal tools at scale, you know the pain: permissions, deployments, auth, UI boilerplate… all for something as trivial as changing a username in an admin UI.

When I first discovered low-code app builders like Retool, I fell in love. Retool made building internal tools so easy.

The combination of low-code UI, easy data access, and built-in authentication made it a no-brainer when the alternative was spinning up my own service. The elimination of dev ops, authentication, security concerns, or just time spent building UIs meant huge time savings and happy customers.

The breakup

That all started to change in November 2022.

“Vibe coding”, ChatGPT, and the rise of embedded AI tools like Cursor made greenfield development faster than ever. Rapid prototyping was a breeze, and apps could be built faster than ever.

Vibe coding in days what used to take weeks felt like magic… until it was time to deploy. That’s where the chaos began.

Even if you ignored security issues, getting a vibe-coded app into production was a whole new level of pain. Auth, permissions, staging environments, change management… all the invisible stuff that Retool quietly handled for you suddenly mattered again. I couldn’t help but think, “Why can’t I use ChatGPT to build in Retool?”

Bringing vibe coding to Retool

The balance that worked best for our team: use low-coded apps for scaffolds and vibe-coded components for custom functionality.

Here’s how I see the tradeoffs between the three approaches:

This hybrid approach lets us deploy complex, modular features that go far beyond standard Retool functionality while still taking advantage of Retool’s integrations, authentication, and security.

Retool supports custom react components, which you can import directly into any Retool app. These components accept and return data from Retool, meaning they can interact seamlessly with other components and data sources already configured in your environment.

At its simplest, it looks like a React app that can read/write Retool variables, process them, and render itself as a Retool component:

import { Retool } from './mocks/retool'

const MyRetoolComponent = () => {
  const [count, setCountState] =
    Retool.useStateNumber?.({
      name: 'count',
      initialValue: 0
    }) || useState(0)
  const handleIncrement = () => {
    setCountState(count + 1)
  }
  return (
    <div className="my-retool-component my-retool-component-container">
      <h1 className="my-retool-component-title">My Custom Retool Component</h1>
      <p className="my-retool-component-text">Count: {count}</p>
      <button
        className="my-retool-component-button glow-button"
        onClick={handleIncrement}
      >
        <span data-glow aria-hidden="true"></span>
        Increment
      </button>
    </div>
  )
}

The above code from our retool-custom-react-component-starter renders a Retool component that can increment a counter. The component listens to and updates Retool state meaning it can plug directly into existing queries, variables, or user inputs.

And the best part—LLMs are great at working within the boundaries of these components.

Custom React components naturally separate their internal state from Retool’s external state (queries, variables, etc). That boundary keeps the code small and modular, which makes them perfect for fitting into an LLM context window.

So what can you actually build with this?

A great example of what’s possible is our Video On Demand analyzer, an internal tool that connects to S3, Snowflake, and OpenAI’s inference API. This tool takes a multi-hour video transcript, breaks it into chunks, analyzes it with an LLM, and outputs a JSON file including its analysis. This is a project that would’ve taken weeks and was deployed in days.

Where did we save time?

The efficiency came from leveraging Retool’s integrations in combination with vibe coding’s development speed.

Each part of our workflow benefited from one or both, here’s a breakdown:

• Vibe coded component implementation: We used modern AI tooling (Cursor, Claude Code, etc) in combination with local hot reloading support using our retool-custom-react-component-starter (a lightweight template for local development with hot reloading)
• No deployment barriers: Retool’s custom react components allowed us to deploy changes instantly. Zero need to worry about setting up deployment pipelines.
• No data access barriers: We leveraged existing Retool access to S3, Snowflake, and LLM APIs. Getting access without Retool would have taken days, if not weeks.
• No distribution barriers: Our Retool app was immediately available to all employees via SSO auth. This allowed us to get this into the hands of internal testers for feedback instantly.

If you’re interested in trying this for your own internal apps, we open-sourced a starter kit at Whatnot-Inc/retool-custom-react-component-starter.

The library supports:

• Simple starter component with local state example
• Local development with hot reloading
• Making API calls from your component using Retool queries

Final Thoughts

In practice, we’ve found the combination of vibe coding + Retool incredibly powerful because it allows us to:

1. Build more complex apps than allowed by Retool’s standard no/low-code interface
2. Reuse existing connections to power apps with internal data
3. Easily deploy apps with SSO-based authentication by publishing a Retool app

And this isn’t just about Retool. Platforms like Appsmith, Budibase, and Refine play a similar role in abstracting away the risky parts of big-company/complex environments.

Vibe coding shines for bespoke logic and UI, but these battle-tested layers handle the universal foundations (auth, permissions, and deployment) so you can ship fast and safely.

The fastest path to production: vibe-code what’s unique, leverage platforms for what’s proven.

Vibe coding is great for quick prototypes but for deploying production ready tools there’s way more pitfalls than are immediately obvious, whether it’s potential security issues or simply the devops pain involved in spinning up a new service. I’ve found incredible value in tools like Retool, Budibase, Appsmith, etc, which provide a protected and compliant environment where you can get the advantages (speed!) of vibe coding while avoiding the majority of issues out of the box.

AI models will continue to advance rapidly, but the deployment overhead remains for now. Models will increasingly handle logic and interfaces, but the foundations that keep systems reliable (identity, policy, observability) evolve at a slower pace. Until that gap closes, these abstraction layers remain the fastest, safest path from idea to production.

We’re entering what some are calling the transition from the “knowledge economy” to the “allocation economy”, where the scarce skill shifts from what you know to deciding where and how to apply knowledge, tools, or platforms. In that sense, the hybrid strategy of vibe-coding on top of abstractions is a preview of a skill that will be increasingly valuable as AI tools mature.

The teams that thrive will compose the two: using vibe coding to explore, and abstractions to stabilize. The future of software isn’t about writing everything from scratch; it’s about deciding what to let the machine create and what guardrails to stand on. The winners will be those who master both.