7 Lecciones aprendidas sobre cómo crear un producto completo utilizando ChatGPT
7 lecciones sobre crear un producto con ChatGPT
Las habilidades de programación de ChatGPT hacen que sea muy fácil programar productos completos en poco tiempo, si sabes cómo usarlo correctamente
No hace mucho compartí contigo cómo creé mi propio tutor de francés usando ChatGPT (por cierto, es de código abierto). Describí cómo diseñé la aplicación (específicamente su backend) y cómo conecté y configuré los diferentes servicios basados en inteligencia artificial. Pero hubo una cosa que omití en gran medida, que es cómo creé el frontend de la aplicación. Verás, no soy un programador frontend y mi conocimiento de JavaScript se resume en el hecho de que sé que necesito colocarlo entre las etiquetas <script></script>.
Pero la aplicación que tenía en mente requería una interfaz de usuario, y una bastante dinámica. Eso significa HTML, JavaScript y CSS, pero no tenía ni idea de cómo empezar a codificar esto.
Lo que sí sabía era cómo quería que se viera. Tenía el diseño en mi mente y sabía cómo lo haría si supiera cómo codificar esto. Así que decidí probar un enfoque nuevo y bastante radical: le pediré a ChatGPT que escriba el código por mí. En ese momento ya tenía experiencia en hacer solicitudes relacionadas con el código a ChatGPT, pero nunca había intentado algo tan complejo.
Bueno, mientras lees estas líneas, sabes que funcionó: he creado una aplicación completa simplemente instruyendo a un modelo de lenguaje grande (LLM) sobre lo que me gustaría ver. Realmente quiero escribir esto una vez más, solo para asegurarme de que todos entendamos lo que acaba de suceder: un algoritmo codificó una aplicación entera solo explicándolo en inglés claro. 😲
Aun así, tan sorprendente como fue, este proceso no fue tan trivial como podría parecer, y por eso me gustaría aprovechar la oportunidad y compartir algunos consejos que aprendí sobre cómo generar código complejo utilizando ChatGPT.
- Estimación dinámica de proyectos de IA
- Protege tu aplicación de LLM. ¡Lectura obligada!
- Esta investigación de IA evalúa la corrección y fidelidad de los mo...
1. Diseña tú mismo
Los LLM son herramientas poderosas para crear código y contenido, pero no piensan, solo pueden cumplir solicitudes (o al menos lo intentan). Eso significa que depende de ti hacer el pensamiento y, específicamente, el diseño. Asegúrate de saber cómo debería verse el producto final antes de comenzar a enviar solicitudes al modelo generativo.
Más sobre esto: depende de ti investigar cuál es la mejor tecnología para ti. Como deberás descomponer tu aplicación compleja en pasos (ver punto #2 a continuación), el LLM no puede prever cómo se verá el producto final y podría utilizar bibliotecas o servicios subóptimos.
Por ejemplo, la primera interfaz de usuario (UI) que ChatGPT generó para mí se basaba en tkinter, que crea una aplicación real y no una interfaz web. Esto hace que la creación de una UI dinámica sea mucho más complicada (y menos estándar en estos días). Otro intento se basó en steamlit, que facilita la creación de UI no complejas, pero nuevamente no estaba diseñado para solicitudes complejas (por ejemplo: “agregar un botón de reproducción de grabación solo junto a los mensajes del usuario, pero solo si el usuario grabó un audio”). En mi caso, dependía de mí entender que usar Flask sería la mejor opción.
2. Descompón en tareas y comienza con algo simple
Si le pides a ChatGPT que codifique todo el producto de una vez, es muy probable que obtengas un código con errores. Por “inteligente” que sea, no esperes que pueda prestar atención a todos los detalles proporcionados de una vez. Descompón tu diseño en tareas y fases, comenzando con algo bastante simple y agregando más capas encima.
Por ejemplo, aquí está mi UI de chat final, la que diseñé e planeé inicialmente:
Puedes ver que hay todo tipo de botones y funcionalidades en la interfaz, y sin embargo, mi primera instrucción a ChatGPT fue:
Escribe una interfaz de usuario web en Python para una aplicación de chatbot. El cuadro de texto donde el usuario ingresa su mensaje está ubicado en la parte inferior de la pantalla, y todos los mensajes anteriores se mantienen en pantallaSin botones especiales, sin imágenes de perfil junto a los mensajes, nada especial. Solo una interfaz de chat simple, que será el núcleo sobre el cual construiré. Esta solicitud generó 4 archivos:
- Un archivo Python que funciona como backend (usando Flask)
- Un archivo HTML
- Un archivo JavaScript (usando jQuery)
- Un archivo CSS
Una vez que tuve esto, pude comenzar a hacer el producto más complejo.
Puede que pienses que me contradigo al decirte que descompongas tu aplicación en pequeños pasos, pero confieso que mi primera solicitud generó cuatro archivos. Por cada solicitud de ChatGPT, hay un compromiso entre la cantidad de código requerido para completar la tarea y cuán no estándar y específica es. Pedir una interfaz de chat completa generará algo bastante general, pero requerirá mucho código. Pedir “agregar un botón de traducción junto a los mensajes del tutor” y asegurarse de que esté ubicado en el lado derecho del globo de mensajes, siempre en el centro vertical y por encima del botón de reproducción de sonido, es algo muy específico, por lo que será una solicitud aparte.
3. Explica detalladamente lo que realmente quieres
Cada solicitud y adición que hagas a tu producto puede implicar cambios en más de un archivo (y más de un cambio por archivo). Eso significa que se crearán nuevas variables, funciones y puntos finales en cada una de estas solicitudes, y se harán referencia desde diferentes ubicaciones. Los nombres proporcionados para ellos serán dados por ChatGPT, y hará todo lo posible para proporcionar nombres significativos, pero solo puede hacerlo si explicas bien el contexto.
Por ejemplo, si deseas agregar un botón “Guardar” a tu producto, es preferible pedirlo de la siguiente manera:
Agrega un botón "Guardar sesión" a la izquierda del cuadro de texto. Debería tener un ícono de disquete. Una vez hecho clic, todos los mensajes en la interfaz de usuario se guardarán en un archivo JSON llamado "saved_session.json"en lugar de una solicitud sin contexto como esta:
Agrega un botón a la izquierda del cuadro de texto con un ícono de disquete. Una vez hecho clic, todos los mensajes en la interfaz de usuario se guardarán en un archivo JSON.Preferir solicitudes con contexto rico generará mejores convenciones de nombres.
4. Ten mucho cuidado con lo que pides exactamente
Aquí hay un problema real que tuve que resolver y no anticipé: quería que la interfaz de usuario mostrara el texto generado por mi tutor de francés a medida que se transmitía, de manera similar al efecto en ChatGPT. La API de Python que estaba usando para crear la respuesta del tutor (OpenAI ChatCompletion API) devuelve un generador de Python, que luego se necesita consumir e imprimir en la pantalla. Y así le pregunté a ChatGPT:
Escribe una función de JavaScript que consuma el generador y actualice el texto del mensaje uno por unoLo que no sabía, ya que nunca había escrito nada en serio en JavaScript en mi vida, era que estaba pidiendo algo imposible; JavaScript no tiene forma de manejar un generador de Python. Lo que sucedió fue que ChatGPT me dio todo tipo de soluciones extrañas y completamente inútiles, ya que intentaba hacer exactamente lo que le pedí: alterar el código de JavaScript.
Debes recordar que ChatGPT intenta cumplir tus solicitudes exactamente como las pediste, siempre y cuando no violen sus pautas. Lo que realmente necesitaba en ese momento era que me dijera que estaba pidiendo algo tonto, pero así no funciona.
Este problema solo se solucionó cuando me di cuenta de que estaba pidiendo lo imposible (a la antigua, con Google y StackOverflow) y cambié mi solicitud a algo como esto:
Dado el generador de respuestas, agrega funcionalidad para consumir el generador y actualizar el texto del mensaje uno por unolo cual resultó en modificaciones tanto en el archivo JavaScript como en el archivo Python, lo que permitió obtener el resultado deseado.
5. Los LLM no pueden revertir su código (y cómo revertirlo)
Aunque ChatGPT es excepcional para escribir código, sigue siendo solo un modelo de lenguaje y no se desempeña bien revirtiendo sus propios cambios, especialmente si le pides que revierta dos o tres pasos anteriores. Cuando trabajas con LLMs para generar código en fases, te recomiendo encarecidamente que siempre guardes una copia de la última versión funcional del código con el que estás satisfecho; así, si el nuevo código que agregó ChatGPT está roto y no se puede reparar, puedes revertir fácilmente tu código a cuando funcionaba correctamente.
Pero hay un detalle importante: si reviertes tu código, también debes revertir a ChatGPT para asegurarte de que conozca exactamente cómo se ve tu código ahora. La mejor manera de hacerlo es iniciar una nueva sesión y comenzar con una indicación como esta:
Estoy construyendo una aplicación de chatbot. Aquí está mi código hasta ahora:HTML:```tu código HTML```JavaScript:```tu código JavaScript```CSS:```tu código CSS```Python:```tu código Python```Agrega un botón "Guardar sesión" a la izquierda del cuadro de texto. Debería tener un ícono de disquete. Una vez que se hace clic, todos los mensajes en la interfaz de usuario se guardarán en un archivo JSON llamado "saved_session.json"(También puedes cargar los archivos en el Intérprete de Código de ChatGPT, que no estaba disponible en ese momento). Si la indicación es demasiado larga para enviarla en un solo mensaje, divídela en dos. Haz clic en “Detener Generación” entre estos mensajes para evitar que el bot inserte texto innecesario en el medio.
6. No luches demasiado tiempo
Una de las cosas geniales de programar con ChatGPT es que si escribe código incorrecto o el código no funciona como se desea, simplemente puedes enviarle el mensaje de error y él corregirá el código en consecuencia.
Pero eso no siempre sucede. A veces ChatGPT no logra corregir el error o crea otro error en su lugar. Luego le enviamos el nuevo error y le pedimos nuevamente que lo corrija. Si eso sucede más de dos o tres veces, hay una buena posibilidad de que el código esté tan roto o modificado en exceso que simplemente no funcionará. Si has llegado a ese punto, detente, revierte (ver arriba) y reformula tu solicitud.
7. Aprende cómo hacer la solicitud
Aunque la idea principal de ChatGPT es que puedes interactuar con él usando lenguaje cotidiano, saber cómo redactar correctamente tus solicitudes puede tener un efecto inmenso en el resultado. Recomiendo encarecidamente tomarse el tiempo para aprender cómo hacerlo. Por ejemplo, este curso gratuito de OpenAI y DeepLearning.AI sobre ingeniería de solicitudes es imprescindible, especialmente la lección sobre cómo combinar instrucciones, código y ejemplos en una sola solicitud.
Una de las cosas más importantes que puedes aprender sobre hacer solicitudes es asegurarte de que haya una diferencia distinguible entre el texto libre y el código en tu solicitud. Así que en lugar de esto:
Aquí hay una función de Python: def func(x): return x*2Cámbialo para que devuelva la raíz del valor absoluto de la entrada si es negativa.escríbelo así:
Aquí hay una función de Python: ```def func(x): return x*2```Cámbialo para que devuelva la raíz del valor absoluto de la entrada si es negativa.También, si es posible, proporciónale ejemplos de entrada y salida. Ese es el mejor método para explicarle a un LLM lo que debe hacer, ya que elimina cualquier ambigüedad en tu solicitud (¿qué debería devolver el modelo si la entrada es positiva? ¿mantenerla x*2 o tal vez nada?):
Aquí hay una función de Python: ```def func(x): return x*2```Cámbialo para que devuelva la raíz del valor absoluto de la entrada si es negativa.Ejemplos:Entrada: 2, Salida: 4Entrada: -9, Salida: 3Bonus: Elige el LLM adecuado
Recuerda que “ChatGPT” es el nombre del producto web, no el modelo en sí. La versión gratuita te brinda acceso a GPT-3.5, mientras que la versión de pago incluye GPT-4, que funciona de manera mucho mejor en tareas de programación. El nuevo Intérprete de Código lo mejora aún más, ya que puede ejecutar y probar su propio código.
Incluso si decides elegir otro LLM para trabajar, asegúrate de que el que elijas tenga un buen rendimiento en tareas de programación. De lo contrario, ninguno de estos consejos te será de ayuda.
A medida que concluyo todo esto, supongo que lo más importante que debes entender al comunicarte con los LLMs es que cada palabra cuenta. Los LLMs no piensan y no pueden comprender realmente lo que queremos sin explicárselo explícitamente de la manera que necesitan, porque —gracias a Dios— no son humanos (¿aún?), solo son una herramienta. Y al igual que cualquier herramienta, si no sabes cómo trabajar con ella, no podrás hacer ningún trabajo. ¡Espero que encuentres útiles estos consejos en tu próximo proyecto!
