Hace unos días vi que Google había lanzado esta herramienta para desarrollar aplicaciones sin saber código, algo muy similar a otras ya existentes como Lovable, así que coincidiendo con que hace unos días había tenido una idea de aplicación bastante sencilla, me he puesto a probar que tal funciona y os comparto que he hecho y mi conclusión, por si alguien se plantea usar esto para montar algo....
SPOILER: ¡sale mal!
Como contexto, decir que aunque tengo algo de conocimiento de programación, en web estoy ya muy oxidado.... vamos que entiendo los conceptos, pero de react, typescript y similares que es lo que utilizan este tipo de herramientas no tengo ni idea.
Ahora, ahí va mi primer prompt:
Necesito una web para que los usuarios intercambien enlaces de afiliado. Funcionará mediante la gestión de campañas y reportes.
- Cada campaña representa una webs, producto o servicios que ofrece enlaces o códigos de afiliado.
- Cada reporte representa una queja sobre un enlace de una campaña publicado por un usuario.
- Para cada campaña tendremos un título, una descripción, una imagen o logo, la fecha de caducidad, y un listado de enlaces o códigos de afiliado que posteriormente irán registrando los usuarios.
- El panel de administración tendrá un enlace a un formulario para crear nuevas campañas, un listado de campañas con los correspondientes enlaces para modificarlas o borrarlas, y un listado de usuarios que han sido reportados con el total de reportes que han tenido.
- El formulario para publicar nuevas campañas pedirá el título, la descripción, una imagen o logo, la fecha de caducidad y el número de veces que se tiene que mostrar cada enlace de los que registren posteriormente los usuarios en esa campaña.
- En la parte pública de la web, habrá un listado con las campañas publicadas y un buscador de campañas por título, además habrá un botón para iniciar sesión con la cuenta de Google.
- En cada campaña, debajo de su imagen o logo y su descripción, aparecerá el botón para mostrar el enlace de afiliado
- Para poder pulsar el botón de copiar enlace, el usuario tendrá que haber iniciado sesión previamente.
- Cuando el usuario pulse el botón de mostrar enlace de afiliado, se mostrará el siguiente enlace que haya disponible para esa campaña, junto al enlace aparecerá un pequeño icono que permitirá copiar el enlace al porta papeles, y un botón para generar un reporte en caso que el enlace no funcione.
- El botón de reporte guardará en la base de datos el enlace de afiliado, el usuario que lo publicó, el usuario que lo reporta, y la fecha y hora en que se ha generado el reporte.
- Al haberse mostrado ese enlace a un usuario ya dejará de estar disponible por lo que tiene que ser borrado de la base de datos, la próxima vez que un usuario pulse sobre el botón de mostrar enlace de afiliado, se le mostrará el siguiente enlace que haya registrado para esa campaña.
- Si no hay más enlaces para esa campaña, se le mostrará un mensaje informativo indicando que no hay enlaces disponibles.
¿En qué tecnologías me propones crear este proyecto?
Como podéis ver, ignorante de mi, le pregunté con que iba a hacer la web, por el momento ha obviado la pregunta, pero por el resto, me generó algo bastante potable, dejo aquí un par de capturas de pantalla, pero voy a empezar a pedirle cambios:


La web tiene que estar en Español de España.
En tablet y PC la caja de texto del buscador es demasiado grande, quiero que sea proporcional al botón de login con la cuenta de Google.
En las campañas no muestres los días restantes si no faltan menos de 7 días para que termine.
Debajo del botón de Show affiliate Link, si el usuario no ha iniciado sesión, muestra un mensaje indicando que tiene que iniciar sesión para poder mostrar el enlace.
Con este 2o prompt, me tradujo la web correctamente al español, ahora sí, me contestó sobre la pregunta del stack que ignoró en el primer prompt (no he entendido porqué me lo ha respondido ahora sin habérselo recordado yo), aquí la respuesta:
Mi propuesta tecnológica es la siguiente:- Frontend (lo que ve el usuario): React con TypeScript.
- React es una librería líder para construir interfaces de usuario dinámicas y eficientes. Su sistema de componentes hace que el código sea reutilizable y fácil de mantener.
- TypeScript añade tipado estático a JavaScript, lo que ayuda a prevenir errores comunes durante el desarrollo y mejora la calidad del código, especialmente en proyectos que crecen.
- Para los estilos, Tailwind CSS es una opción fantástica. Permite crear diseños modernos y personalizados directamente en el HTML de forma muy rápida, sin tener que escribir CSS tradicional.
- Backend (la lógica del servidor y base deatos): Node.js con Express.
- Node.js permite usar JavaScript en el servidor, lo que simplifica el desarrollo al usar un solo lenguaje en todo el proyecto.
- Express es un framework minimalista para Node.js que facilita la creación de APIs para que el frontend se comunique con el servidor y la base de datos.
- Base de Datos: Firebase (Firestore).
- Firestore es una base de datos NoSQL en tiempo real que se integra perfectamente con aplicaciones web. Es escalable, flexible y fácil de usar.
- Además, Firebase Authentication te solucionaría de forma muy sencilla y segura el inicio de sesión con Google que necesitas.
- Alojamiento (Deployment): Vercel o Netlify.
- Ambas plataformas ofrecen un despliegue continuo muy sencillo desde un repositorio de Git (como GitHub), con generosos planes gratuitos para empezar. Son ideales para aplicaciones basadas en React.
Ahora bien, la caja de buscar sigue siendo enorme, vamos a ver si el 3er prompt lo arregla:
Ese buscador de campañas sigue siendo enorme, hazlo más pequeño
sigue el puto buscador enorme.... vamos con otro intento, y se me olvidó también decirle que cambie el título ese Affili-Link que ha decidido poner, como he dicho que es un proyecto chorra, le voy a poner un dominio .com.es, concretamente afiliados.com.es, así que le diré que simplemente ponga algo genérico como "Comparte enlaces de afiliado"
no se trata de hacerlo más estrecho, sino de reducir la altura, necesito que tenga la misma altura que el botón de iniciar sesión.
además, el título de "Affili-Link" Quiero que lo cambies por: "Comparte enlaces de afiliado"
Esta vez (más o menos) sí, ha reducido el buscador, pero me ha mantenido la imagen de la lupa enorme detrás, le he pedido que la quite por completo:
Ahora quita la imagen de la lupa que has puesto en el buscador
Vuelve a atrancarse con el puñetero buscador... me dice que ha quitado la lupa, pero sigue ahí, así que sigo intentandolo:
no lo has eliminado, quita por completo la lupa del buscador
otro intento
detrás del buscador sigo viendo una lupa gris, quítala

¡Ahora sí!, visualmente ya tengo la web en condiciones, en este punto paso a probarla y casi todo funciona bien, el principal problema que veo y que no estoy seguro si es un tema de la preview o que, es que con el usuario que me ha iniciado sesión (te pone uno inventado), ya me sale el panel de admin, quiero asegurarme que solo lo vea el admin, y luego al reportar que un enlace no funciona, también quiero que ponga un mensaje de reporte OK, así que este es mi siguiente prompt:
He iniciado sesión y me ha aparecido un botón al panel de administración, eso solo tiene que aparecerle al administrador, no a todos los usuarios
he reportado un enlace y el reporte se ha guardado correctamente, pero necesito que se muestre un mensaje al usuario que hace el reporte indicando que el reporte se ha realizado correctamente.
Después de este prompt, me dice que ha modificado la simulación para al volver a iniciar sesión ya sea un usuario no admin, pero me sigue apareciendo el botón para ir al panel de admin, es verdad que si le doy no hace nada, pero no tendría ni que aparecer. Y el mensaje de reporte OK nada...dice que lo ha hecho, pero no.
He vuelto a iniciar sesión y al pulsar el botón de panel de administración ya no accedo, pero si no soy administrador, no tiene que aparecer en ningún momento.
También te pedí que al reportar un enlace apareciese un mensaje informando al usuario que el reporte se había hecho correctamente, pero sigue sin aparecer ese mensaje
Con esto parece que ¡lo tenemos!, sigo con la duda de como podré seleccionar que usuario será admin, le pregunto...
necesito saber como podré elegir que usuario es administrador y cuál no
Me dice que para la demo ha hardcodeado en un archivo el admin, pero que lo suyo es tenerlo en la base de datos, y me propone construir un panel de gestión de usuarios, por ahora no voy a pedírselo, ya lo que voy a hacer es ver como despliego esto....
Para desplegar en la parte superior de la preview, hay un botón con un icono que pone "Implementar App" le doy ahí, me pide elegir un proyecto (hablamos de proyectos de la google cloud console) le dejo que use el que te crea por defecto y me pide también habilitar la facturación... $$$$$, le pongo mis datos y mi tarjeta (no se va a comer revoluts ni mierdas, hay que poner la del banco de verdad), te mandan la notificación para autorizar pagos, y si no os habíais registrado antes, os dan 300$ de prueba.
Vuelvo al proyecto de AI Studio, le doy a refresh y ya me se habilita el botón de "Deploy App"
Una vez acaba de deployar la app, me lleva a la página del proyecto en la consola de Google y me da un link a la aplicación, aquí me tocaría mirar como conectar un dominio y tal, pero....entro con el link que me dan y oh sorpresa, tremendo mojón, el login no funciona, me lo hace automáticamente con cuentas fake.
Llegado a este punto, voy a deshacer tremendo mojón, por lo que he visto lo ha deployado sobre un componente de Google Cloud que llama Cloud Run, lo borro y en principio ya está, entiendo que no me cobrarán nada, ahora... bien es verdad que igual alguien aquí ya se ha perdido y no sabe como cojones apagar esto...
CONCLUSIONES
Estas conclusiones son a finales de 2025, no digo que esto en un año o en X tiempo pueda ser otra cosa, dicho esto:
Me parece una solución que NO está madura, como habéis visto hay cosas simples en las que se atranca de mala manera... (como ejemplo el buscador)
Si no tienes conocimiento de lo que hay por debajo (código) es casi imposible de mantener, arreglar errores o hacer cualquier cambio.
Siguiendo con el punto anterior, la escalabilidad es 0, a menos que tengas conocimientos de los componentes del cloud de google, no vas a poder tocar nada.
Alguien me puede decir que si es que se lo he puesto dificil con el login y tal y cuál.... para hacer una web informativa te montas un wordpress y tienes muchisimo más control de la página y puedes cambiar lo que quieras, no estás atado al cloud de Google...
En definitiva, a día de hoy por lo menos la solución de AI Studio me parece un engaña bobos, no acabo de entender cuál es su público objetivo... alguien que sepa programar no va a estar perdiendo el tiempo en ver de que forma tiene que pedir las cosas para que le hagan caso, y el que no es programador, pues lo que ya he dicho arriba, no tiene por donde cogerlo.
Espero que sirva para desmentir el montón de mierda de videos que hay en youtube diciendo que te puedes hacer pajas con el vibe coding y tal y que cuál, y si alguien ha hecho algo que le funcione bien, pues estaría bien que lo comparta abajo.
|