Passez de Base44 à des apps mobiles natives avec Capacitor

Introduction

Base44 est un outil de création d'apps propulsé par l'IA qui génère des applications React complètes à partir de prompts. Vous pouvez livrer rapidement un produit fonctionnel dans le navigateur — mais comment faire pour l'avoir sur iOS et Android ? Dans ce tutoriel, nous montrons comment exporter votre projet Base44 et le transformer en apps mobiles natives avec Capacitor, puis déployez des binaires signés pour les stores avec Builder Capgo — sans avoir besoin de Mac pour iOS.

Version courte : la Passer de Base44 à iOS et Android résume tout le parcours sur un seul écran : l'export, Capacitor, les builds cloud sans Mac et les live updates.

À la fin de ce guide, votre application Base44 fonctionnera nativement sur iOS et Android avec un accès aux fonctionnalités de l'appareil comme la caméra, le stockage et les notifications push.

Prérequis et estimation de temps

Temps requis: 2 à 4 heures pour la configuration initiale

Configuration requise:

Pour les builds cloud iOS: N'importe quel OS (Windows, Mac ou Linux) avec Capgo Builder
Pour les builds cloud Android: Any OS
Stockage: 10 Go d'espace libre pour les dépendances et les artefacts de build
RAM: 8 Go minimum

Coûts:

Export Base44: Plan Builder ou supérieur (pour l'export GitHub et le téléchargement ZIP)
App Store iOS : 99 $/an (compte Apple Developer)
Play Store d'Android : 25 $ (frais unique, Google Play Developer)
Cursor Pro : 20 $/mois (optionnel mais recommandé)

Logiciels requis:

Node.js 18+
Un éditeur code comme Cursor

Pourquoi transformer votre app Base44 en mobile ?

Une portée élargie: Meet users where they expect a native app icon, not a browser tab
Fonctionnalités natives: Caméra, GPS, biométrie et stockage hors ligne via les plugins Capacitor
Distribution sur les stores: Publiez sur Google Play et l'App Store d'Apple
Itérations plus rapides: Associez Capgo Live Updates à Capgo Builder pour corriger la couche web sans recompiler les binaires natifs à chaque fois

Étape 1 : exportez votre projet Base44

Base44 vous permet d'exporter code une fois que vous êtes sur le plan Builder ou supérieur. Vous avez deux options principales.

Option A : exporter vers GitHub (recommandé)

Ouvrez votre application dans l'éditeur Base44
Cliquez sur les GitHub icône dans la barre supérieure
Autoriser Base44 Builder et créez ou connectez un dépôt
Base44 synchronise automatiquement votre app code vers GitHub (synchronisation bidirectionnelle sur les plans compatibles)

Consultez Docs d'intégration Base44 GitHub pour plus de détails.

Option B : Télécharger en ZIP

Cliquez Code in the top bar to open the file browser
Cliquez Exporter le projet en ZIP en haut à droite de la vue code
Extrayez l'archive sur votre ordinateur

Ouvrir le projet dans Cursor

Visitez cursor.sh et installez Cursor
Clonez votre repo GitHub (Git: Clone depuis la palette de commandes) ou ouvrez le dossier ZIP extrait avec Fichier > Ouvrir le dossier

Lancez Cursor

Pour un workflow optimal assisté par IA, activez votre modèle préféré et autorisez l'exécution de commandes dans les paramètres de Cursor — la même configuration décrite dans notre guide « De Lovable au mobile ».

Étape 2 : Configurez votre environnement de développement

Base44 exporte un projet React standard. Installez les dépendances et confirmez que le serveur de dev fonctionne.

Utiliser Cursor AI (recommandé)

Appuyez sur Command+K (Mac) ou Ctrl+K (Windows) et demandez :

Install Node.js if needed, install project dependencies, and start the dev server

Configuration manuelle

cd your-base44-project
npm install
npm run dev

L'application Base44 tourne en local

Votre application Base44 devrait se charger sur http://localhost:5173 (Vite) ou sur le port affiché dans le terminal.

Étape 3 : Préparer le build de production

Capacitor nécessite des assets web statiques. Les apps React Base44 utilisent généralement Vite et exportent vers dist/.

Configurer Vite pour le mobile

Demander à Cursor :

Configure vite.config for Capacitor mobile deployment with base './' and production build to dist

Ou mettre à jour vite.config.ts manuellement :

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

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

Tester le build de production

npm run build

Vérifiez qu'un dist/ dossier existe avec index.html et les assets du bundle.

Sortie du build Base44

Étape 4 : Ajoutez Capacitor à votre projet Base44

Utiliser Cursor AI (recommandé)

Install Capacitor CLI, initialize it for my Base44 app with webDir dist, and add iOS and Android platforms

Installation manuelle

npm install -D @capacitor/cli
npm install @capacitor/core @capacitor/ios @capacitor/android

npx cap init "Your Base44 App" com.yourcompany.yourapp --web-dir dist
npx cap add ios
npx cap add android

Initialisation de Capacitor pour une app Base44

Commitez les ios/ et android/ dossiers vers git. Capgo Builder compile le contenu de ces répertoires.

Étape 5 : Configurez Capacitor

Mise à jour capacitor.config.ts:

import type { CapacitorConfig } from '@capacitor/cli'

const config: CapacitorConfig = {
  appId: 'com.yourcompany.yourapp',
  appName: 'Your Base44 App',
  webDir: 'dist',
  server: {
    androidScheme: 'https',
  },
}

export default config

Pensez à ajouter @capgo/capacitor-updater tôt pour pouvoir déployer des mises à jour OTA après le lancement. Voir Docs Capgo Live Updates.

Étape 6 : Build et sync

Chaque fois que vous modifiez l'application web :

npm run build
npx cap sync

Capacitor sync terminée pour une app Base44

Étape 7 : Build de binaires prêts pour les stores avec Capgo Builder (recommandé)

Les tests sur simulateur sont optionnels. Pour TestFlight, les tests internes et la publication sur les stores, utilisez Builder Capgo pour compiler et signer les binaires natifs dans le cloud.

Why Capgo Builder for Base44 apps?

Aucun Mac requis pour iOS — build depuis Windows ou Linux
Le même CLI que votre agent IA peut exécuter — s'adapte aux workflows de vibe-coding de Base44 → GitHub → Cursor
Compatible avec les Live Updates — corrigez l'UI et le texte via OTA ; ne recompilez le build natif qu'en cas de changement de plugins ou de permissions

Configurer Capgo Builder

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

Save signing credentials once. See Gestion des identifiants et Compiler pour iOS depuis Windows.

Demander un build cloud

npm run build
npx cap sync
npx @capgo/cli@latest build com.yourcompany.yourapp --platform ios --build-mode release
npx @capgo/cli@latest build com.yourcompany.yourapp --platform android --build-mode release

Les logs de build défilent dans votre terminal. Avec App Store Connect configuré, les builds iOS peuvent être envoyés automatiquement vers TestFlight.

Envoyez votre bundle web pour les mises à jour OTA :

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

Étape 8 : Optionnel — Tester localement dans Xcode ou Android Studio

Si vous avez un Mac ou si vous voulez tester sur émulateur avant les builds cloud :

npx cap open ios      # Xcode + iOS Simulator
npx cap open android  # Android Studio + emulator

Xcode ouvrant un projet Base44 Capacitor

Utilisez des IDE locaux pour le débogage quotidien. Utilisez Builder Capgo lorsque vous avez besoin de binaires de release signés.

Étape 9 : Ajouter des fonctionnalités natives

Améliorez votre application Base44 avec les capacités de l'appareil :

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

Demandez à Cursor d'intégrer Share, Camera ou Push dans vos composants React. Après avoir ajouté les plugins, lancez un nouveau Builder Capgo build avant la publication sur les stores.

Fonctionnalités natives ajoutées à une application Base44 Capacitor

Étape 10 : Optimiser pour la production

Icônes d'app et splash screens

npm install -D @capacitor/assets
# Add assets/icon.png (1024x1024) and assets/splash.png (2732x2732)
npx capacitor-assets generate
npx cap sync

Considérations sur le backend de Base44

Les apps Base44 exportées peuvent appeler le backend hébergé de Base44 et SDK. Cela fonctionne généralement dans Capacitor tant que :

Les appels API utilisent HTTPS
Les redirections d'auth fonctionnent dans la WebView (testez la connexion sur un appareil réel)
Les deep links sont configurés si vous utilisez des flux magic link ou OAuth

Si vous migrez plus tard hors du backend de Base44, prévoyez de remplacer base44.entities.* et les appels SDK associés par votre propre API — la couche UI React est généralement conservée.

Dépannage des problèmes courants

Écran blanc au lancement

Confirmer base: './' est défini dans la config Vite
Exécutez npm run build et vérifiez que dist/index.html charge les assets avec des chemins relatifs
Exécutez npx cap sync après chaque build web

Erreurs de build dans le Capgo Builder

Commit ios/ et android/ sur git avant de demander un cloud build
Exécutez npx cap sync en local pour que les assets web soient copiés dans les projets natifs
Les nouveaux plugins Capacitor nécessitent un nouveau Native Build

Export non disponible dans Base44

L'export GitHub et le téléchargement ZIP nécessitent le plan Builder ou supérieur. Passez à Base44 ou copiez les fichiers manuellement depuis la vue Code sur les plans inférieurs.

Conclusion

Vous avez exporté une application React générée par l'IA de Base44, l'avez encapsulée avec Capacitor, et disposez d'un chemin clair vers des binaires iOS et Android signés via Builder Capgo — sans avoir à gérer une ferme Xcode locale.

Étapes suivantes

Live Updates Capgo: Déployez des correctifs d'UI et de texte sans attendre la validation des stores
Builder Capgo: Automatisez les builds de release en CI
Notifications push: Ajouter @capacitor/push-notifications et reconstruisez avec le Builder Capgo
Guides associés: Lovable vers le mobile · Bolt.new vers le mobile

Créez un compte Capgo gratuit pour activer les Live Updates et les builds natifs cloud.

Ressources

Passez de Base44 aux applications mobiles natives avec Capacitor

Si vous utilisez Passez de Base44 à des apps mobiles natives avec Capacitor pour planifier le travail sur les plugins natifs, connectez-l’à Capgo Répertoire des plugins pour le workflow produit dans Capgo Plugin Directory, Plugins Capacitor par Capgo pour les détails d'implémentation dans Plugins Capacitor par Capgo, Capgo Native Build pour le workflow produit dans les Capgo Native Builds, et Compiler pour iOS depuis Windows pour les builds iOS cloud sans Mac.