De una sesión de mentoría real, anonimizada. Partimos de una landing ya construida con IA (identidad visual, copy y paleta propios) y el reto de convertirla en una app publicable en Google Play. La idea: encadenar piezas gratuitas ya montadas y dejar que la IA haga la fontanería.
Esta píldora sale de una mentoría real, anonimizada. Antes de entrar en el cómo, el marco de la sesión en tres golpes:
Una landing ya construida con IA: identidad visual, paleta de colores y copy propios, elegidos entre varias opciones. Bonita, pero sin conectar a nada todavía.
Publicarla de verdad, guardar quién se registra, avisar por email, y además tener una app instalable en el móvil. Todo sin escribir una línea de código.
Encadenar herramientas gratuitas ya montadas (hosting, base de datos, email) y, para la app, ir directo a nativo con React Native. La IA hace la fontanería; tú decides el criterio.
El punto de partida ya es notable: una landing con identidad visual propia (paleta de colores, logo) y un copy escrito por IA entre varias opciones, eligiendo el que más convencía en cada caso. Nada de plantilla genérica: decisiones tomadas a mano sobre propuestas generadas.
Y algo más interesante todavía: al retomar el trabajo previo de definición (hecho en una pizarra colaborativa, con casos de uso escritos en formato Gherkin), bastó con pasarle una captura de pantalla a la IA para que lo reconociera y lo tuviera en cuenta. Ese trabajo de diseño no se pierde: se traslada.
Cuanto mejor definido está el problema antes de picar nada (aunque sea en una pizarra, con post-its o con casos de uso escritos a mano), mejor parte la IA. No hace falta que ese trabajo esté digitalizado en un formato especial: una simple foto o captura ya le da contexto suficiente para no repetir decisiones ya tomadas.
Una landing hecha con IA solo existe de verdad cuando está publicada. Vercel da hosting gratuito, con muy poca fricción, y se maneja desde el terminal sin tocar código: es la propia IA la que ejecuta los comandos.
De todo el stack, es la pieza más sencilla: instalar el CLI, hacer login una vez y pedirle a la IA que despliegue. No hay servidores que configurar ni certificados que gestionar a mano.
Para que la web deje de ser solo un escaparate, necesita base de datos. Supabase da una base de datos Postgres gratuita: guarda ahí a cada persona que deje su email al apuntarse.
supabase.com.Falta cerrar el círculo: que cada registro dispare un aviso. Con Resend, cuando alguien se registre en la web, se envían dos emails: uno de confirmación a esa persona y otro de notificación para ti, avisando de que hay un nuevo interesado.
Mismo patrón que Supabase: crear cuenta, generar token, pasárselo a la IA para que configure el envío. Plan gratuito con un límite bastante alto, de sobra para empezar a validar.
Quiero conectar mi web con Supabase y Resend.
Contexto: ya tengo cuenta y token de acceso de ambos servicios.
Pídeme los tokens y guárdalos en variables de entorno, nunca en el código.
Con Supabase: crea una tabla de "registros" (nombre, email, fecha) y guarda ahí
cada persona que rellene el formulario de la landing.
Con Resend: cuando se guarde un registro nuevo, envía un email de bienvenida
a esa persona y otro de aviso a mi correo, con su nombre y email.
Explícame en dos frases qué has hecho, sin tecnicismos.El reto: tener una app instalable en el móvil sin escribir una línea de código. Como el objetivo final es publicarla en Google Play, conviene ir directo a la opción nativa en vez de envolver la web.
Para probar la app localmente hace falta el emulador de Android, que la IA puede instalar y configurar. La licencia de desarrollador de Google Play ronda los 25 $ (cifra aproximada, se confirma al darte de alta en Play Console). La monetización (anuncios, versión de pago, o dejarla gratis) queda pendiente: no es la prioridad ahora, lo importante es aprender el proceso completo.
La forma de no repetir trabajo: cada vez que la IA acierte con algo (una paleta de colores, un estilo, una estructura), que quede guardado y reutilizable, en vez de tener que volver a explicarlo desde cero en el siguiente proyecto.
Pídele a la IA que cree una skill: un archivo Markdown con esa habilidad guardada. Así, en otro proyecto, le dices que haga algo parecido y ella ya sabe reutilizarla, sin que tengas que repetir la explicación completa.
Un proyecto que empieza de cero, como este, se llama greenfield. Sin código previo que respetar, la IA propone y construye con mucha libertad, y por eso avanza tan rápido: una idea se convierte en algo real en minutos.
La trampa está en no sentar buenas prácticas de arquitectura desde el principio: si el proyecto crece y acumula historia (se convierte en legacy), sin esa base se acaba gastando mucho más tiempo en refactorizar que si se hubiera cuidado desde el inicio.
El orden por el que yo empezaría. Márcalo a medida que lo completes: se guarda en tu navegador, así que puedes volver y seguir por donde ibas.
Marca lo que vayas completando. Se guarda en tu navegador, así que al volver sigue aquí.
Tres preguntas para fijar lo esencial. No hay nota ni castigo: si fallas, te explico el porqué.
Repaso · Pregunta 1/3
Glosario · toca para ampliar
Crear software sin escribir código, con herramientas visuales o, cada vez más, con lenguaje natural que la IA convierte en producto. Es lo que ha permitido montar la landing entera sin tocar una línea.
Ver en el diccionarioPublicar una versión del proyecto para que esté disponible de verdad, no solo en tu ordenador. Con Vercel es prácticamente un único comando.
Ver en el diccionarioUna clave secreta que un servicio (Supabase, Resend) te genera para que la IA pueda usar tu cuenta sin compartir tu contraseña. Se guarda en variables de entorno, nunca en el código.
Ver en el diccionarioUn servicio que te da base de datos y servidor ya montados (como Supabase), para no tener que programar ni mantener tu propio backend.
Ver en el diccionarioUn archivo aparte del código donde se guardan claves y tokens, para que nunca queden escritos a la vista ni se suban por error a un repositorio.
Ver en el diccionarioUn correo automático que dispara una acción del usuario (registrarse, comprar), no una campaña de marketing. Con Resend, cada registro puede avisar al usuario y a ti a la vez.
Ver en el diccionarioFramework para construir apps nativas de Android e iOS desde un mismo proyecto. La alternativa recomendada frente a envolver la web cuando el objetivo es una tienda de apps.
Ver en el diccionarioGreenfield es un proyecto que arranca de cero, sin nada que respetar todavía; legacy es uno con historia, donde hay que cuidar más la arquitectura para no perder tiempo refactorizando.
Ver en el diccionarioEstas dos ideas son las que más impacto tienen. Si te llevaras únicamente dos cosas de toda esta página, que sean éstas:
¿Quieres que lo montemos juntos sobre tu proyecto? Puedes reservar una mentoría conmigo o escribirme a hi@alci.dev. Las herramientas cambian cada semana, pero encadenar piezas simples no pasa de moda.