Vimos el lanzamiento de GitHub Copilot en octubre de 2021 y toda la comunidad de desarrolladores se volvió loca.
Algunos afirmaban que pronto nos quedaríamos sin trabajo, y otras, como yo, pensaban que aunque la herramienta era interesante, estaba realmente lejos de ser un sustituto. Podía proporcionar un mejor autocompletado, sí, pero no era capaz de crear una aplicación entera por ti.
Así que estábamos a salvo. O eso creíamos.
Hace unas semanas vimos el lanzamiento de Chat GPT y toda la comunidad de desarrolladores volvió a enloquecer. Pero, ¿esta vez tienen razón?
Probé la IA y le pedí que construyera el equivalente para desarrolladores web de un "Hola mundo": una aplicación de Tareas.
Veamos cómo lo hizo 🫣
Si tu aún no sabes de que va el tema de Chat GPT, te invito a que puedas entrar y escuchar uno de los twitter space donde se habló acerca de esté tema.
La petición
Estas son mis preguntas para el chatbot y las respuestas que obtuve:
¿Puedes darme el código para crear una aplicación de tareas pendientes que me permita editar los elementos y almacenarlos en una base de datos? Por favor, utiliza React para el frontend y next js para el backend.
Esa fue mi pregunta inicial, y las preguntas clave están en negrita allí:
- Una aplicación de tareas pendientes
- Capacidad para editar elementos
- Almacenar datos en una base de datos
- Usar React y Next
Esto es lo que obtuve:
import React, { useState } from 'react'
import { useRouter } from 'next/router'
function ToDoApp() {
const [items, setItems] = useState([]) // useState to store the to-do items
const router = useRouter()
// handle form submission
const handleSubmit = (event) => {
event.preventDefault()
const form = event.target
const input = form.querySelector('input')
// add the new to-do item to the array of items
setItems([...items, input.value])
input.value = ''
}
// handle item removal
const handleRemove = (index) => {
// create a new array without the item at the specified index
const newItems = items.filter((item, i) => i !== index)
setItems(newItems)
}
return (
<div>
<h1>To-Do App</h1>
<form onSubmit={handleSubmit}>
<input type="text" placeholder="Add a new item" />
<button type="submit">Add</button>
</form>
<ul>
{items.map((item, index) => (
<li key={index}>
{item}
<button type="button" onClick={() => handleRemove(index)}>
Remove
</button>
</li>
))}
</ul>
</div>
)
}
export default ToDoAppOk, eso no era EXACTAMENTE lo que pedí.
Sí, tengo una aplicación de tareas, usando React y Next, PERO, no está usando una base de datos, de hecho, está usando almacenamiento en memoria. Y no me permite editar los elementos. Así que vamos a preguntar de nuevo.
¿Puedes modificar ese código para añadir soporte para una base de datos en la nube?
OK, ahora acabo de hacer referencia a "ese código", y he añadido soporte para "base de datos en la nube". Específicamente estaba tratando de ser vago, porque un humano entendería esto fácilmente, pero la IA necesita mantener una referencia a la conversación actual y recordar de qué estamos hablando.
Y he aquí, el código que pedí:
import React, { useState } from 'react'
import { useRouter } from 'next/router'
import firebase from 'firebase/app'
import 'firebase/database'
function ToDoApp() {
const [items, setItems] = useState([]) // useState to store the to-do items
const router = useRouter()
// initialize Firebase
if (!firebase.apps.length) {
firebase.initializeApp({
apiKey: '<YOUR_API_KEY>',
databaseURL: '<YOUR_DATABASE_URL>'
})
}
// get a reference to the Firebase database
const database = firebase.database()
const itemsRef = database.ref('items')
// handle form submission
const handleSubmit = (event) => {
event.preventDefault()
const form = event.target
const input = form.querySelector('input')
// add the new to-do item to the Firebase database
itemsRef.push({
text: input.value
})
input.value = ''
}
// handle item removal
const handleRemove = (itemId) => {
// remove the item from the Firebase database
itemsRef.child(itemId).remove()
}
// useEffect to fetch the to-do items from the Firebase database
useEffect(() => {
itemsRef.on('value', (snapshot) => {
const items = snapshot.val()
const newItems = []
for (let item in items) {
newItems.push({
id: item,
text: items[item].text
})
}
setItems(newItems)
})
}, [])
return (
<div>
<h1>To-Do App</h1>
<form onSubmit={handleSubmit}>
<input type="text" placeholder="Add a new item" />
<button type="submit">Add</button>
</form>
<ul>
{items.map((item) => (
<li key={item.id}>
{item.text}
<button type="button" onClick={() => handleRemove(item.id)}>
Remove
</button>
</li>
))}
</ul>
</div>
)
}
export default ToDoAppEligió Firebase por mí, e incluso escribió los marcadores de posición para que yo introdujera mis credenciales.
¿O no?
¿Funciona este código?
Hasta ahora, estoy bastante impresionada con los resultados, realmente no esperaba este nivel de detalle.
Pero a la hora de probar el código, encontré un par de problemas que ponen claramente de manifiesto las carencias de este bot.
Problema nº 1: Faltaba una importación. Error tonto, lo sé, los humanos los cometemos todo el tiempo, pero al código le faltaba la importación del hook useEffect. 🫢
Problema nº 2: Nunca se especificó la versión del paquete npm firebase a utilizar. Puede que fuera culpa mía, pero un simple npm install firebase daba una versión que no era compatible con el código. Así que le pregunté al bot: ¿qué versión del paquete npm firebase debo usar para ese ejemplo?
Y obtuve una respuesta interesante:
Quiero decir, felicitaciones al bot, fue capaz de entender el contexto de mi pregunta, y proporcionó una respuesta válida (casi). El código era, de hecho, compatible con esa versión de firebase, así que pude probarlo.
Pero la versión actual de Firebase es la 9, no la 7, eso es un problema.
Con esos problemas resueltos, pude probar la aplicación y hacerla funcionar.
Ah, sí, todavía me falta el botón Editar. Es algo que pedí, porque no hay muchos tutoriales que cubran esa parte de la aplicación. Normalmente se limitan a añadir y eliminar elementos.
¿Qué falla aquí? 🕵🏻
Los defectos de Chat GPT
No me malinterpretes, Chat GPT es increíble.
Junto con Dalle-2 y MidJourney, es la pieza de software de IA más interesante y avanzada que he probado nunca.
Pero NO va a sustituir a los desarrolladores.
¿Por qué? Por los dos problemas que he señalado antes. Si aún no te has dado cuenta, el bot simplemente escupe contenido de los artículos utilizados para entrenarlo.
Así que en lugar de crear el código por sí mismo, que debería ser impecable, simplemente me muestra lo que otros autores han escrito. No sólo eso, sino que también me muestra contenido obsoleto con errores.
Esto se debe a que no es capaz de validar si me está dando o no lo que le he pedido. En lugar de eso, está adivinando (con una enorme tasa de éxito) lo que estoy buscando, y dándome algo que se le parece.
En otras palabras, en su estado actual, Chat GPT sólo será útil mientras el contenido utilizado para entrenarlo sea verificado y actualizado por otra persona.
¿Qué implicaciones tiene para nosotros, los desarrolladores, la existencia de Chat GPT?
Simplemente estamos ante una herramienta más que puede resultar útil para nuestro trabajo diario.
¿Cómo?
Ahora mismo cuando tienes un problema lo introduces en Google y 8 de cada 10 veces llegas a StackOverflow.
Ahora, podrás introducir la pregunta directamente en Chat GPT y lo más probable es que te dé la respuesta mejor clasificada de SO o algún artículo de alto rango.
¿Debes confiar ciegamente en el código devuelto por Chat GPT?
No, todavía tienes que usar tu cerebro. Lo siento, no lo siento.
Pero te dará una rápida ventaja.
En otras palabras, lo único que puede hacer Chat GPT (al menos ahora mismo) es realizar una búsqueda en Google más rápida.
Lo cual, no me malinterpretes, con la cantidad de veces que realizamos búsquedas en Google cada día, es muy probable que nos resulte útil.
Dicho esto, también es cierto que Chat GPT te dará una única respuesta, que según su algoritmo, es la mejor para ti. Pero, ¿qué pasa con el resto? ¿Qué pasa con tus propias preferencias?
Chat GPT ocultará el resto de opciones, potenciando las pocas que considera válidas para sus usuarios.
¿Qué significa esto para la comunidad de desarrolladores?
ChatGPT no nos robará el trabajo, al menos de momento.
Sin embargo, estamos ante la posibilidad de que en el futuro se potenciará una nueva clase de desarrolladores: los desarrolladores asistidos por IA.
Por el momento, el bot no puede generar código perfecto (lo cual es irónico si lo piensas), ni puede compilar y ejecutar aplicaciones por ti. Pero puede darte el punto de partida de la solución que buscas.
Puede darte el prototipo de tu idea, o un algoritmo funcional que resuelva un problema que no has sido capaz de resolver.
En definitiva, es una herramienta que puede ayudarte a desarrollar una solución como si estuvieras intercambiando ideas con un colega, sólo que puede hacerlo mucho más rápido.
