Capstart

Base44 to Native Mobile Apps

Export a Base44 React app, add Capacitor with Capstart, then build signed iOS and Android apps with Capgo.

Base44toCapgo

A practical path from a Base44 web app to native iOS and Android builds.

Base44 is useful because it gets you to a real React application quickly. You describe the product, iterate in the browser, connect data, and end up with something people can use without starting from a blank repository.

Shipping that same product to the App Store or Google Play is a different step. The web app needs to be exported, built as static assets, wrapped in a native Capacitor project, tested inside a WebView, then signed for each store.

This guide shows the Capstart path: export the Base44 project, add Capacitor with one setup command, then use Capgo Builder when you want signed iOS or Android builds without maintaining the full native toolchain locally.

Prerequisites and time estimate

Plan 2 to 4 hours for a first setup if your Base44 app already works well on mobile web.

You will need:

  • a Base44 plan that lets you export code through GitHub or ZIP;
  • Node.js 18 or newer;
  • a code editor, such as Cursor or VS Code;
  • 8 GB RAM and roughly 10 GB of free disk space;
  • an Apple Developer account for iOS distribution;
  • a Google Play Developer account for Android distribution;
  • a Mac with Xcode only if you want local iOS builds.

If you use Capgo Builder for iOS, the build can run in the cloud from macOS, Windows, or Linux. You still need your Apple Developer account because Apple controls signing, TestFlight, and App Store review.

Why turn a Base44 app into a mobile app?

A Base44 app can already run in a mobile browser. Native packaging is useful when the product needs more than a browser tab:

  • users expect an installed app icon and store distribution;
  • you need camera, push notifications, share sheets, biometrics, files, or offline storage;
  • you want one codebase for web, iOS, and Android;
  • you want a stable native project you control outside the Base44 editor;
  • you want cloud builds and live-update workflows through Capgo.

If your app is a simple mobile web experience and Base44's own mobile publishing flow covers your needs, start there. Choose Capstart and Capgo when you want to own the Capacitor project, add native features over time, or make the release process repeatable.

Step 1: Export the Base44 project

Capstart works on the project files, so the first job is to get the Base44 code onto your machine or into GitHub.

Option A: Sync to GitHub

Use this route if you want a clean release workflow.

  1. Open the app in Base44.
  2. Connect the project to GitHub from the Base44 code or export controls.
  3. Create a new repository or link an existing one.
  4. Clone the repository locally.

This is usually the best option for Capgo Builder because the native iOS and Android projects can live in the same repository as the web app.

Option B: Download a ZIP

Use ZIP export when you just want to try the conversion locally.

  1. Open the project code view in Base44.
  2. Export the project archive.
  3. Extract it on your computer.
  4. Open the extracted folder in your editor.

Do not add Capacitor inside a random parent folder. Open the folder that contains the Base44 app's package.json.

Step 2: Run the Base44 app locally

Before adding a native layer, prove that the exported web project still works.

With Cursor, you can ask:

Install the project dependencies, check that Node.js is available, and start the local dev server for this Base44 app.

Or run the commands manually:

npm install
npm run dev

Open the local URL shown in the terminal. Base44 React projects commonly run through Vite, often at http://localhost:5173, but use the port printed by your dev server.

Fix web issues now: missing environment variables, broken imports, API calls pointing at localhost, auth redirects that only work in the Base44 preview, or routes that fail after a refresh.

Step 3: Prepare the production build

Capacitor does not package your dev server. It packages the production web output, usually a dist/ folder for a React + Vite project.

Capstart can configure the common pieces for you, but it helps to know what it is aiming for. A typical Vite setup for a Capacitor app looks like this:

vite.config.ts
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';

export default defineConfig({
  plugins: [react()],
  base: './',
  build: {
    outDir: 'dist',
  },
});

Then build the app:

npm run build

Check that dist/index.html exists and that the build finishes without errors. If the production build fails, the native build will fail too.

Step 4: Add Capacitor with Capstart

From the root of the exported Base44 project, run:

npx capstart init . --framework react-vite --setup recommended --safe-area

If your exported project is not React + Vite, let Capstart detect the framework:

npx capstart init . --setup recommended --safe-area

Capstart adds the Capacitor setup around the existing app. Depending on the project, it can:

  • install the Capacitor packages;
  • create or update capacitor.config.*;
  • add iOS and Android native projects;
  • add build and sync scripts to package.json;
  • configure the web output directory;
  • add safe-area handling for notches, status bars, and home indicators;
  • include common plugins such as Keyboard, Network, Device, Status Bar, and Splash Screen.

The important value to choose carefully is the native app id:

com.company.product

Treat it as permanent. Changing it later can affect store listings, certificates, push notifications, deep links, and in-app purchases.

Step 5: Review the Capacitor config

After Capstart finishes, review capacitor.config.ts or capacitor.config.json.

For a Base44 React + Vite app, the config should be close to this:

capacitor.config.ts
import type { CapacitorConfig } from '@capacitor/cli';

const config: CapacitorConfig = {
  appId: 'com.company.product',
  appName: 'Product',
  webDir: 'dist',
  server: {
    androidScheme: 'https',
  },
};

export default config;

Replace the placeholder app id and name before your first serious build. Also confirm that webDir matches the folder created by npm run build.

Step 6: Build and sync

Every time the web app changes, rebuild the web assets and sync them into the native projects:

npm run build
npm run cap:sync

If your project does not have Capstart's scripts yet, use Capacitor directly:

npx cap sync

Commit the generated ios/ and android/ folders. Capgo Builder and CI systems need the native projects, not only the React source files.

Step 7: Build signed apps with Capgo Builder

Local simulator testing is useful, but release builds need signing. On iOS, that usually means Xcode, certificates, provisioning profiles, and App Store Connect setup. Capgo Builder can run that build process in the cloud for Capacitor projects.

This is especially useful for Base44 projects because the workflow stays close to the AI-assisted development loop:

  • Base44 generates the product;
  • GitHub stores the exported code;
  • Capstart adds the mobile shell;
  • Capgo Builder produces signed iOS and Android builds;
  • App Store Connect and Google Play handle review and distribution.

Set up Capgo once:

npx @capgo/cli@latest login
npx @capgo/cli@latest init
npx @capgo/cli@latest build init --platform ios
npx @capgo/cli@latest build init --platform android

Then request release builds:

npm run build
npm run cap:sync
npx @capgo/cli@latest build com.company.product --platform ios --build-mode release
npx @capgo/cli@latest build com.company.product --platform android --build-mode release

Capgo creates the native build. It does not replace your Apple or Google developer accounts, and it does not bypass store review.

If your app uses Capgo live updates, you can also upload the web bundle after a web-only change:

npx @capgo/cli@latest bundle upload --channel production

Use live updates for web-layer fixes. Use a new native build when permissions, plugins, icons, signing, or store-reviewed behavior changes.

Step 8: Optional local testing

If you have the native IDEs installed, open the generated projects:

npm run cap:ios
npm run cap:android

Or use Capacitor directly:

npx cap open ios
npx cap open android

Test the app as an installed app, not only in the browser. Check the keyboard, safe areas, login, redirects, deep links, loading states, and slow network behavior. A Base44 screen that looks fine in the editor can still need spacing and interaction fixes once it runs inside a WebView.

Step 9: Add native features

Once the base app works, add device features incrementally.

For example:

npm install @capacitor/share @capacitor/camera @capacitor/push-notifications
npm run cap:sync

Then wire the plugins into your React components. For each new plugin, check the native setup it requires: permissions, entitlements, Android manifest entries, iOS usage descriptions, or App Store privacy answers.

Plugin changes normally require a fresh native build. Web copy and UI fixes may be eligible for Capgo live updates if the native shell stays the same.

Step 10: Polish for production

App icons and splash screens

Create the store-ready assets before release:

npm install -D @capacitor/assets

Add:

  • assets/icon.png at 1024 x 1024;
  • assets/splash.png at 2732 x 2732.

Then generate platform assets:

npx capacitor-assets generate
npm run cap:sync

Base44 backend and auth

Exported Base44 apps may still call Base44-hosted services. That can work in Capacitor, but test it on a real device.

Check that:

  • all API calls use HTTPS;
  • no production request points to localhost;
  • login and logout work inside the WebView;
  • OAuth or magic-link redirects return to the installed app when needed;
  • deep links are configured for any external auth flow;
  • privacy policy and terms links are reachable before account creation.

If you later move away from Base44's backend, plan a separate migration. The React UI can often stay, but calls such as base44.entities.* and Base44 SDK helpers need to be replaced with your own API.

Payments

Review payments before submitting to Apple or Google.

Web checkout is usually acceptable for physical goods or real-world services. Digital features, subscriptions, credits, premium content, or in-app capabilities often require Apple and Google in-app purchase systems. Fixing this after rejection is slower than deciding the payment model early.

Troubleshooting

White screen on launch

  • Confirm Vite uses base: './'.
  • Run npm run build before npm run cap:sync.
  • Make sure webDir points to the actual build output.
  • Inspect device logs in Xcode, Android Studio, or the browser inspector.

Capgo Builder fails

  • Commit ios/ and android/ to git.
  • Run npm run cap:sync locally before starting the cloud build.
  • Check that signing credentials are configured for the right app id.
  • Rebuild natively after adding or removing Capacitor plugins.

Auth works on web but not in the app

  • Avoid browser-only redirect URLs.
  • Configure deep links or universal links for OAuth and magic links.
  • Test on a physical device, not only a desktop browser.
  • Confirm cookies, storage, and session refresh work inside the WebView.

Export is not available

GitHub sync and ZIP export depend on the Base44 plan and current project settings. If export is not available, upgrade the project plan or copy the code through the available Base44 code view before trying to initialize Capacitor.

Launch checklist

  • The Base44 app builds locally with npm run build.
  • The production web output exists in dist/ or the configured webDir.
  • Capstart created the Capacitor config and native projects.
  • The app id and app name are final.
  • Login, signup, logout, and password recovery work on a real device.
  • API calls use reachable HTTPS URLs.
  • Payments match Apple and Google rules.
  • App icons, splash screens, privacy policy, and terms are ready.
  • Capgo Builder can produce signed iOS and Android builds.
  • App Store Connect and Google Play listing details are prepared.

The short version:

Base44 builds the product. Capstart turns it into a Capacitor app. Capgo Builder signs and builds it. Apple and Google review it for store distribution.

Useful sources

On this page