Base44 a Aplicaciones Móviles Nativas con Capacitor

Introducción

Base44 es un constructor de aplicaciones móviles impulsado por inteligencia artificial que genera aplicaciones React completas a partir de promps. Puedes enviar un producto funcionante en el navegador rápido — pero ¿qué pasa si quieres que esté en iOS y Android? En este tutorial, mostramos cómo exportar tu proyecto Base44 y convertirlo en aplicaciones móviles nativas con Capacitor, luego envíe los binarios de tienda firmados con Capgo Constructor — no se requiere Mac para iOS.

Al final de esta guía, su aplicación Base44 corre nativamente en iOS y Android con acceso a características de dispositivo como cámara, almacenamiento y notificaciones de push.

Requisitos previos & Estimación de tiempo

Tiempo requerido: 2-4 horas para la configuración inicial

Requisitos del sistema:

Para las compilaciones de nube de iOS: Cualquier sistema operativo (Windows, Mac o Linux) con Capgo Constructor
Para las compilaciones de nube de Android: Cualquier sistema operativo
Almacenamiento: 10GB de espacio gratuito para dependencias y artefactos de compilación
RAM: 8GB mínimo

Gastos:

Exportación Base44: Plan Builder o superior (para GitHub exportación y descarga ZIP)
Tienda de Aplicaciones de iOS: $99/año (Cuenta de Desarrollador de Apple)
Tienda de Aplicaciones de Android: $25 una vez (Desarrollador de Google Play)
Cursor Pro: $20/mes (opcional pero recomendado)

Requerido Software:

Node.js 18+
Un code editor como Cursor

¿Por qué transformar tu Base44 App a móvil?

Alcance ampliado: Conoce a los usuarios donde esperan un icono de aplicación nativa, no una pestaña de navegador
Características nativas: Cámara, GPS, biométricas y almacenamiento en caché a través de Capacitor plugins
Distribución en la Tienda de Aplicaciones: Publica en Google Play y la Tienda de Aplicaciones de Apple
Iteración más rápida: Pair Capgo Actualizaciones en vivo con Capgo Constructor para reparaciones de layer web sin tener que reconstruir binarios nativos cada vez

Paso 1: Exportar su proyecto Base44

Base44 le permite exportar code una vez que esté en el plan de construcción o superior . Tiene dos opciones principalesOpción A: Exportar a __CAPGO_KEEP_0__ (Recomendado)

Option A: Export to GitHub (Recommended)

Haga clic en el icono
__CAPGO_KEEP_0__ GitHub Autorice
Opción B: Exportar a __CAPGO_KEEP_0__ Base44 Builder y crea o conecta un repositorio
Base44 sincroniza automáticamente tu aplicación code con GitHub (sincronización bidireccional en planes soportados)

Ver documentación de integración de Base44 GitHub para detalles.

Opción B: Descargar como ZIP

Hacer clic Code en la barra superior para abrir el navegador de archivos
Hacer clic Exportar proyecto como ZIP In la parte superior derecha de la vista de code
Extraiga el archivo en su computadora

Abra el Proyecto en Cursor

Visite cursor.sh y instale Cursor
Clone su repositorio de GitHub (Git: Clone desde la paleta de comandos) o abra la carpeta ZIP extraída con Archivo > Abrir Carpeta

Inicie Cursor

Para el mejor flujo de trabajo con asistencia de inteligencia artificial, active su modelo preferido y permita la ejecución de comandos en las configuraciones de Cursor — el mismo setup descrito en nuestra Guía amable a móvil.

Paso 2: Configura tu entorno de desarrollo

Base44 exporta un proyecto de React estándar. Instala dependencias y confirma que el servidor de desarrollo funciona.

Usar Cursor AI (Recomendado)

Presiona Command+K (Mac) o Ctrl+K (Windows) y pregunta:

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

Configuración manual

cd your-base44-project
npm install
npm run dev

La aplicación Base44 está funcionando localmente

Tu aplicación Base44 debería cargar en http://localhost:5173 (Vite) o el puerto mostrado en la terminal

Paso 3: Prepara la compilación de producción

Capacitor necesita activos web estáticos. Las aplicaciones de React de Base44 suelen utilizar Vite y enviar a dist/.

Configure Vite para móviles

Pregúntale a Cursor:

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

O actualiza vite.config.ts manualmente:

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

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

Prueba la compilación de producción

npm run build

Verifica que un dist/ carpeta exista con index.html y activos empaquetados.

Salida de compilación Base44

Paso 4: Agrega Capacitor a tu proyecto Base44

Usando Cursor AI (Recomendado)

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

Instalación manual

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

Capacitor inicialización para una aplicación Base44

Comite los ios/ y android/ carpetas a git. Capgo Constructor compila lo que hay en esas carpetas.

Paso 5: Configura Capacitor

Actualiza 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

Considera agregar @capgo/capacitor-updater antes para que puedas enviar actualizaciones OTA después del lanzamiento. Consulta Capgo Documentación de actualizaciones en vivo.

Paso 6: Construye y sincroniza

Cada vez que cambies la aplicación web:

npm run build
npx cap sync

Capacitor sincronización completa para una aplicación Base44

Paso 7: Construye Binarios Listos para la Tienda con Capgo Constructor (Recomendado)

La prueba de simulador es opcional. Para TestFlight, pruebas internas y presentación en la tienda, utilice Capgo Constructor para compilar y firmar binarios nativos en la nube.

¿Por qué Capgo Constructor para aplicaciones Base44?

No se requiere Mac para iOS — construye desde Windows o Linux
Mismo CLI que puede ejecutar su agente de inteligencia artificial — se adapta a flujos de trabajo de codificación en vivo de Base44 → GitHub → Cursor
Funciona con Actualizaciones en Vivo — corrige la interfaz de usuario y copia en el aire; reconstruye nativo solo cuando cambien plugins o permisos

Configura Capgo Constructor

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

Almacena las credenciales de firma una vez. Consulte Gestión de credenciales y Construya iOS desde Windows.

Solicite una construcción en la nube

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

Los registros de construcción fluyen en su terminal. Con la configuración de App Store Connect, las construcciones de iOS pueden subir a TestFlight automáticamente.

Suba su paquete web para actualizaciones OTA:

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

Paso 8: Opcional — Pruebe localmente en Xcode o Android Studio

Si tiene un Mac o quiere pruebas de emulador antes de las construcciones en la nube:

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

Xcode abriendo un proyecto Base44 Capacitor

Use IDEs locales para depuración diaria. Use Capgo Builder cuando necesites binarios de lanzamiento firmados.

Paso 9: Agregar Características Nativas

Mejora tu aplicación Base44 con capacidades de dispositivo:

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

Pide a Cursor que conecte Compartir, Cámara o Push en tus componentes de React. Después de agregar plugins, ejecuta un nuevo Capgo Constructor construye antes de la presentación en tiendas.

Características nativas agregadas a una aplicación Base44 Capacitor

Paso 10: Optimizar para Producción

Íconos de Aplicación y Pantallas de Inicio

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

Consideraciones del Backend Base44

Las aplicaciones Base44 exportadas pueden llamar al backend de Base44 hospedado y SDK. Eso suele funcionar en Capacitor siempre que:

API las llamadas utilicen HTTPS
Funcionan las redirecciones de autenticación dentro de la WebView (prueba de inicio de sesión en un dispositivo real)
Se configuran los enlaces profundos si utiliza flujos de enlace mágico o OAuth

Si más adelante migra de la base de datos de Base44, planifique reemplazar base44.entities.* y llamadas relacionadas SDK con sus propias API — la capa de interfaz de usuario de React suele sobrevivir

Resolución de Problemas Comunes

Pantalla blanca al iniciar

Confirmar base: './' se establece en la configuración de Vite
Ejecutar npm run build y verificar que dist/index.html carga activos con rutas relativas
Ejecutar npx cap sync después de cada construcción web

Errores de construcción en Capgo Builder

Commit ios/ y android/ antes de solicitar una construcción en la nube, sube a git
Ejecutar npx cap sync localmente para que los activos web se copien en los proyectos nativos
Los nuevos plugins de Capacitor requieren una construcción nativa fresca

No disponible la exportación en Base44

GitHub export y descarga ZIP requieren el plan Builder o superior Actualiza en Base44 o copia los archivos manualmente desde la vista de __CAPGO_KEEP_0__ en niveles inferioresActualiza en Base44 o copia los archivos manualmente desde la vista de Code en niveles inferiores

Conclusión

Has exportado una aplicación de React generada por Base44, la has envuelto con Capacitor, y tienes un claro camino hacia binarios firmados de iOS y Android a través de Capgo Builder — sin mantener una granja local de Xcode.

Pasos siguientes

Capgo Live Updates: Envía correcciones de UI y de copia sin esperar la revisión de la tienda
Capgo Builder: Automatiza la creación de versiones de lanzamiento en CI
Notificaciones push: Agrega @capacitor/push-notifications y reconstruye con Capgo Builder
Guías relacionadas: Amable a móvil · Bolt.new a móvil

Regístrate en una cuenta gratuita de Capgo para habilitar Actualizaciones en vivo y compilaciones nativas en la nube. Recursos

Documentación de Base44

Keep going from Base44 to Native Mobile Apps with Capacitor

Si estás utilizando Aplicaciones móviles nativas con Capacitor para planificar el trabajo de plugins nativos, conecta con Capgo Directorio de Plugins para el flujo de trabajo del producto en Capgo Directorio de Plugins, Capacitor Plugins por Capgo para los detalles de implementación en Capacitor Plugins por Capgo, Capgo Compilaciones nativas para el flujo de trabajo del producto en Capgo Compilaciones nativas, y Compilar iOS desde Windows para compilaciones de iOS en la nube sin un Mac.

Aplicaciones móviles nativas con Capacitor