> ## Documentation Index
> Fetch the complete documentation index at: https://docs.superblocks.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Other app import

> Import any app into Superblocks with Clark using a zip upload

Import any app into Superblocks by uploading a zip of your project. This works for apps built with any tool — Bolt, Cursor, Windsurf, or your own codebase.

## Before you begin

Make sure you have:

* A project zip ready to upload
* Access to the Superblocks workspace where the app will live
* The integrations (databases, APIs) you plan to connect already configured in Superblocks

## How to import

<Steps>
  <Step title="Start the import">
    From the Superblocks home screen, click **Import** in the prompt bar, or click the **Import an app** link below it.
  </Step>

  <Step title="Prepare your zip">
    Zip your project's root folder. Before zipping, remove the following to keep the file size small:

    * `node_modules/`
    * `.git/`
    * Build output directories (`dist/`, `build/`, `.next/`, etc.)
  </Step>

  <Step title="Upload the zip">
    On the Superblocks import screen, select the **Other** option when prompted for a source.

    <img src="https://mintcdn.com/superblocks/U5RkhXSSu8k-JEr-/images/import-apps/general-app-export.png?fit=max&auto=format&n=U5RkhXSSu8k-JEr-&q=85&s=c2fb8b3ea4d64becf86cf3fddff839b9" alt="Superblocks migration Export step for a generic or custom source: package the project before continuing" style={{ width: "100%", maxWidth: "720px" }} width="1998" height="1048" data-path="images/import-apps/general-app-export.png" />

    Drop your zip file into the upload area and click **Import**.

    <img src="https://mintcdn.com/superblocks/U5RkhXSSu8k-JEr-/images/import-apps/upload-project.png?fit=max&auto=format&n=U5RkhXSSu8k-JEr-&q=85&s=4a69e8878e34f02320c597e930dbd593" alt="Migration Upload step: drag-and-drop zone for .zip, .tgz, or .gz archives with Import app button" style={{ width: "100%", maxWidth: "720px" }} width="1996" height="1052" data-path="images/import-apps/upload-project.png" />
  </Step>

  <Step title="Clark migrates the app">
    Clark inspects your project structure, identifies frameworks, data sources, and pages, then rewrites the code to run on Superblocks:

    | Source app                                        | Superblocks                                                                   |
    | ------------------------------------------------- | ----------------------------------------------------------------------------- |
    | Database clients (`pg`, `knex`, Prisma, Supabase) | [Integrations](/integrations/overview) connected to your enterprise databases |
    | Hardcoded API keys and secrets                    | Credentials managed by the platform                                           |
    | Custom auth (Passport, JWT, Supabase Auth)        | Platform-managed [authentication and RBAC](/admin/org-administration/rbac)    |
    | Express routes, Deno functions                    | [Backend APIs](/building-with-clark/backend-apis)                             |
    | Frontend pages and components                     | React pages hosted on the platform, preserving your design and styles         |

    You'll be prompted to connect your integrations — pick the databases, APIs, and services the app should use in your environment.
  </Step>
</Steps>

## What gets migrated

Clark analyzes your source code and replaces external dependencies with Superblocks platform features. Frameworks Clark works well with include React, Next.js, Vue, and plain HTML/JS. Backend logic written as Express or Deno routes is rewritten as Superblocks Backend APIs.

## Troubleshooting

**The zip is too large** — Remove `node_modules/`, `.git/`, and any build output before zipping. These directories are not needed for the import.

**Clark can't identify the framework** — Make sure your project has a `package.json` at the root and that framework dependencies (e.g. `react`, `next`, `vue`) are listed. Add a brief `README` describing the project structure if the layout is non-standard.

**Some components look different after migration** — Clark preserves styles where possible, but some UI libraries may not have a direct equivalent in Superblocks. You can edit any component directly after the import completes.

**Integrations aren't connecting** — Verify that the integration is configured in your Superblocks workspace before importing. You can add integrations from the [Integrations page](/integrations/overview) and then reconnect them from within the imported app.
