How to migrate a Replit app and deploy it to Retool

If you built your internal tool or app in Replit, Retool lets you bring it into its governed environment, keeping what you built while adding the permissions, audit logs, and access controls your organization needs.

In this migration guide, we’re going to do exactly that—exporting a sales pipeline app from Replit over to Retool, connecting it to our data, and giving it the security and governance that internal tools need to make it in production.

What you'll migrate: A sales pipeline viewer

We've built a sales pipeline viewer in Replit. It shows deals as cards on a Kanban board, organized into stages from Lead through Qualified, Proposal, and Negotiation, and reps drag a card from one column to the next as a deal moves forward.

Each card carries the essentials: deal value, the rep who owns it, and the expected close date. Each stage totals the deals within it, so anyone can see where the pipeline stands at a glance.

The app works, and the team uses it. What it doesn't have is governance. Here’s why:

Anyone with the link gets in with the same access
The deals are read from a dev database
Nothing records who moved which deal or when

When we’re done, we’ll have that same pipeline running in Retool. It reads from your live database, every rep sees only the deals their role allows, and each change is logged automatically. It’s the exact same board as before, but with Retool’s governance wrapped around it.

If you have your own app in Replit, you can follow these same steps.

Prerequisites

Before you start the Replit to Retool migration, make sure you've got the requirements in place:

A working React app in Replit, ready for export
A Retool account, the free plan covers everything here (sign up)
A data source to connect: PostgreSQL, a REST API, or anything similar
Basic React familiarity

Step 1: Export your app from Replit

Everything here happens on the Replit side. The goal is a clean React project you can hand off, so the pipeline leaves Replit as a standard project rather than something wired to the Replit runtime. You won't change any code in this step; you're just getting the project off the platform and confirming it came out whole.

Pre-export checklist

One thing before you export—confirm the app actually runs:

Start it on Replit and click through the pipeline end-to-end.
Drag a deal between stages, open a card to check its value, owner, and close date, and watch the stage totals update as a deal moves.
Add a new deal and make sure it is stored.

You're exporting a working app, so the last thing to do on the Replit side is make sure it's working.

Download the project from Replit

Open your Replit App and find the Files pane on the left. Click the three-dot menu at the top of it and choose Download as zip. Replit bundles the entire project, source, config, and dependency manifests into one archive.

These projects contain many files, so packaging and downloading take a minute or two. When it finishes, you'll have a {project}.zip in your downloads. Note that the zip is the project's source, not its installed node_modules—which is exactly what you want. Retool installs the dependencies and configures the rest of the project for you during import.

Review what Replit packages in the export

Unzip the archive and open the folder. It's worth knowing the layout before you import, because these are the pieces Retool reads on the way in:

1.
src holds your components and app logic, the Kanban board, the deal cards, the stage columns, and the state that moves a deal from one stage to the next.
2.
package.json lists your dependencies and defines the scripts and entry point Retool uses to build the app.
3.
The entry file, main.tsx in this project, is where the app starts.

You'll also spot Replit-specific entries in package.json, like the Replit Vite plugins and catalog: or workspace:* version strings in place of real version numbers. Leave them alone. Those references are Replit-specific and the Retool import process will convert them when we bring the project over, so there's nothing to clean up before bringing the project over.

Step 2: Import your React app into Retool

Now we get to the fun part. AI will take care of most of it for you. All you need to bring is the zip folder from Replit.

Find “Import React code” in the Retool editor

Let’s start by creating a new app in Retool from your dashboard.

This will take you straight through to the editor. From there, you’ll see the left-hand menu offering different starting options: a starter prompt, convert a classic app, or, the one we want, Import React code:

Upload or connect your project

As it says, click to browse for your zip file. Once selected, the import will start automatically:

What Retool does during import

The simple answer is Retool reads your project structure, installs the dependencies from package.json, and renders your app inside the Retool editor.

The longer answer is that Retool goes through every file in the Replit export, mapping the project's React component tree, the layout and routing, the state and any hooks that drive it, and the scripts that build and run it. It works out the shape of the data your app expects, the deal records, the contact fields, and the stage each deal sits in, so it knows what the pipeline needs to display once it's connected to a real source.

Then it handles the step that turns a React project into a Retool app: wiring the project into Retool itself. It generates the functions your app will call to read and write data, sets up a Retool database if the project needs somewhere to store records, and seeds it with sample data so the imported app has something to render on first load.

You'll see this happen in the editor. Retool proposes the schema and the seed step for review before running anything.

Then, it generates a full set of data functions against that database, the CRUD operations, the pipeline runs on deals, and contacts.

Retool also reconciles your project with what its environment supports, swapping libraries and infrastructure for equivalents that run within Retool. For the pipeline, that meant a handful of substitutions, all part of the import plan:

Data fetching: TanStack Query and the generated API client became the sandbox's auto-generated hooks
Routing: wouter swapped for react-router-dom
Backend: the Express and Drizzle backend was replaced by Retool serverless functions running on retoolDb
Styling: Tailwind 4 with a custom theme mapped to the sandbox's Tailwind 3 plus orgTheme.css; semantic tokens render correctly, and the dashboard card colors already ship with dark: pairs
Components: the source shadcn ui/* components and the toast system moved to the sandbox's shadcn plus sonner

None of this changes what the app does. The board, the cards, and the stage logic all behave the same; they're just running on Retool-supported versions instead of the originals from Replit.

Step 3: Reconnect your app to data sources

During our sales pipeline import, Retool set up and seeded a database, so the pipeline already has data flowing and the generated functions point to it. That's enough to see the app working.

But the seeded sample data isn't your real pipeline, and most apps you migrate will already have a data source you need to connect, a production Postgres, a REST API, and the database your team's deals actually live in. This step points the app at that real source, which is also where governance starts to matter.

If your app's data already lives somewhere, here's how you connect it.

Add a database or API connection in Retool Resources

Go to Resources in your Retool workspace and create a new resource. Pick your type, PostgreSQL for the pipeline's deal database, enter the connection details, and test the connection before saving. Retool now holds a managed connection to your real data, separate from the seeded database the import created.

Wire the imported app's queries to the Retool resource

You don't have to repoint each function by hand. In the editor, @mention the resource you just created and ask the agent to point the app's data functions at it. The read function now queries your production PostgreSQL resource instead of the seeded table, and create, update, and delete follow. The agent does the wiring—but the governance comes from the resource, not from anything the agent wrote.

Test the data connection

Run each function and confirm your real data lands in the UI. The board should populate with your actual deals, and moving a deal between stages or editing a card should write back to the real database. Once data flows end-to-end against your own source, you're ready for governance.

The resource connection you just created is also where Retool enforces permissions.

Step 4: What governance you get automatically

Here's the part you didn't need to write code for. Retool enforces governance at the resource layer, not inside your app, which is the whole point: the controls below attach to the connection you just made. Hence, the pipeline inherits exactly what every other app touching that resource gets.

Because all of this lives on the resource, the pipeline is governed the same way as every app that touches that resource. You configured the connection once in Step 3, and the controls came with it.

Step 5: Configure role-based access (Optional)

If you're evaluating Retool for broader adoption, this is the section that shows how access scales. It's optional for a single tool, but it's the mechanism enterprise teams rely on.

Permission settings are located under Settings → Permissions in the Retool UI, where you create a group and grant it access to the deal database resource.

A common setup for the pipeline: reps get read-only access to view deals, while sales managers get read-write access to reassign owners and move deals between stages. You define these permissions once on the resource.

That grant applies to every app connected to the resource, not just the pipeline. Connect a forecasting dashboard to the same database tomorrow, and it inherits the same access rules automatically, with no separate configuration.

Step 6: Deploy and share your app

Share internally

Hit Publish, then share the app with your team in Retool. Sharing is permissions-aware, so each person sees only what their role allows. Reps open the pipeline and work their deals; managers get the full set of actions, reassigning owners and moving deals between stages.

Broader deployment options

If you need the app available beyond your immediate team, Retool supports wider deployment through workspace and organization-level access, all still governed by the same resource permissions as above.

The Replit pipeline is now a governed, production-deployed internal tool. Same board your team already knew, the same deals moving through the same stages, with an enterprise access layer added underneath it.

Now, go see what else you can do in Retool.