Transcripciones
1. INTRODUCCIÓN: Hola, mi nombre es Peter. Soy
ingeniero de software, actualmente trabajo en IA, investigación
y desarrollo. Entonces en esta clase en particular, te
voy a enseñar cómo podemos construir aplicaciones usando IA. Entonces, si eres un principiante
abstracto y quieres construir aplicaciones
completamente usando IA, este es el mejor lugar
para que comiences. Y en esta clase en particular, estaremos usando Cursor para
construir una aplicación. Y a través de toda esta clase en
particular, te
voy a enseñar cómo
podemos configurar las reglas de Cursor, cómo podemos administrar tu contexto, cómo utilizar la estrategia Lego
Prompting para construir efectivamente
una aplicación Entonces, si esta es la
primera vez que
construyes una aplicación de IA
y quieres
tener una idea
fundamental realmente buena con respecto a cómo funcionan las cosas, este es el mejor lugar para comenzar. Así que prepárate para construir
tu aplicación, y no habrá
ninguna codificación involucrada, y los estaré caminando
paso a paso sobre cómo podemos construir un proyecto al final de
esta clase en particular. Entonces espero
verlos en el siguiente video.
2. Introducción a la IA y al cursor: Hola chicos, bienvenidos a la clase. Así que hoy, en esta clase, vamos a estar aprendiendo sobre Cursor. Antes de ensuciarnos las manos
y trabajar en un proyecto, comprendamos básicamente
qué son los Cursores junto con algunas
terminologías básicas relacionadas con la IA para
que podamos establecer una base
para nuestras próximas clases Entonces, sigamos adelante. Ante todo,
entendamos qué es un modelo. Incluso si estás diciendo que
estás usando Cursor, lo que interactúas
internamente con
lo que interactúas
internamente es básicamente un modelo. En otros términos, se
nos llama LLM, modelo de lenguaje grande Por lo que básicamente se puede considerar a
un modelo como asistente, un asistente altamente inteligente
y calificado, que cuenta con una amplia
variedad de conocimientos. Tiene un amplio conocimiento a través de múltiples dominios
diferentes, ya sea literatura, desarrollo de
software,
cualquier cosa que
lo nombre, tiene mucho conocimiento. La razón es que estos modelos, estos LAMs están capacitados sobre miles de millones de datos
que están disponibles públicamente Por lo que tiene un conocimiento sobre diversas
cosas diferentes en Internet. Entonces, en términos simples, uh, estarás interactuando con estos modelos de IA o modelos de lenguaje
grande. Internamente, estas son
extremadamente complejas, redes
neuronales,
transformadores, etcétera Pero para nosotros, son básicamente asistentes con los que
puedes interactuar. Por lo que hay diferentes proveedores de
modelos. Como saben, tenemos ja GBT. Así que ja GBT viene bajo Open AI, y tienen sus
propios modelos como uh, GPT cuatro, GBT 40, GPT cinco,
etcétera, y luego
tenemos antrópico con el Cloud sonit 4.5,
4.6, opus 4.6, 4.6, opus 4.6 Así como así,
tenemos Google y Meta. Y qué aplicaciones
o software, software como Cursor, copiloto, windsurf ofertas adorables
es que proporcionan un entorno tipo ID o
en el caso del copiloto, puedes
integrarlo con código VS, y lo que nos permiten
hacer es cambiar entre estos Puedes usar antrópico, puedes usar abrir ojos, modelos
GPD, etcétera. Entonces hay una flexibilidad que proporcionan
estos programas como SR
etcétera Y tal vez tengas una duda que cuál es la diferencia
entre estos modelos. Ver, estos modelos pueden
considerarse como
diferentes variaciones. Por ejemplo, un modelo puede
ser extremadamente bueno en la codificación, otro modelo puede
ser extremadamente bueno en multimedia, ex etcétera Cada modelo difiere
y cada uno de ellos tiene su propia especialidad y también
hay modelos de
propósito general Por lo tanto, no debe
preocuparse por elegir el modelo correcto porque Cursor por defecto
proporciona un modo automático. Entonces, en base a la tarea
que estás haciendo, Cursor selecciona automáticamente
un modo en segundo plano. Esto no es algo lo
que te quieras
preocupar ahora mismo, pero, es bueno saber que hay proveedores de modelos
y cada proveedor tiene sus propios
modelos diferentes y Cursor. Y como sabes, Cursor es
solo una de las aplicaciones que puedes usar para construir
aplicaciones usando IA, y casi todos estos software en este ecosistema proporcionan un
tipo similar de características. Tenemos terminaciones de tabulación, lo que significa que cada
vez que intentas
codificar por tu cuenta, Cursor
predice automáticamente lo que estás haciendo Entonces, por ejemplo, si
vas a escribir una función
que se suma al número, así como ender la función ad, Cursor
predice automáticamente que quieres crear una función
para agregar números y automáticamente
sugiere que
simplemente puedes presionar la
tecla tabulador para completar eso Esa es una característica que
ofrece Cursor, no solo Cursor. Como dije, todas
las aplicaciones
en las oficinas del ecosistema. Entonces tenemos obviamente la interfaz de chat,
tenemos al compositor. Composor no es nada,
pero puede considerarse como una función de múltiples agentes donde se pueden realizar múltiples
tareas al mismo tiempo Entonces estas son algunas de las
características principales que ofrece Cursor, y estaremos explorando
esto en los próximos videos. Y si, eso es todo. Esta es una visión general muy rápida y de
alto nivel de la industria
de Cursores e IA y las
terminologías de IA en general Y lo que vamos a hacer a continuación es que vamos a estar construyendo una aplicación desde cero y lo que vas a construir, estaremos construyendo un
símbolo para la aplicación, y lo estaremos haciendo completamente con IA sin siquiera escribir una
sola línea de código. Entonces es un video bastante
interesante, y te veré en la siguiente.
3. Descarga cursor: Chicos, hay un requisito previo
para este video en particular. Entonces, si hasta ahora no has configurado
Cursor, este es el momento en que
vas a descargar Cursor, simplemente
puedes ir a
cursor.com slash Y esta es la
página oficial de Cursor, y solo tómate un poco de tiempo
para entender qué superficial Simplemente puede
desplazarse y leer las diferentes características
que tiene la oficina de Cursor. Y una vez hecho esto,
puedes hacer clic directamente en el
botón de descarga para Macice justo aquí, o bien puedes hacer clic en el botón de
precios aquí mismo en el tablero NAR y esto
nos da los diferentes planes
que ofrece Cursor Y en este video en particular, nos quedaremos
con el plan hobby, que es completamente gratuito, y no requiere tarjeta de crédito, pero tiene solicitudes limitadas de agente y terminaciones de pestañas limitadas, puedes seguir adelante directamente y hacer clic en el botón de
descarga, y también puedes simplemente
leer las diferentes características
que ofrecen otros planes Y en el futuro, si
desea algún tipo de características
adicionales en
esta lista en particular, puede actualizar su
plan en consecuencia. Y una vez que descargues este plan gratuito en
particular, solo instala Cursor, y una vez que abras Cursor
por primera vez, te
pedirán que inicies sesión. Y una vez hecho eso, continuemos a partir de
la siguiente clase.
4. Cómo configurar las reglas del cursor y el proyecto: Todo bien. Espero
que ustedes hayan instalado
correctamente
Cursor en su sistema, y ahora es el momento de
ensuciarnos las manos y escribir algún código usando IA. Entonces lo primero que
voy a hacer es que voy a crear
un nuevo proyecto. Entonces voy a crear una nueva
carpeta en mi escritorio llamada todo app, Cursor. Todo bien. Y una vez
hecho eso, voy a abrir un Cursor en mi sistema. Y aquí, voy a dar
click en Proyecto Abierto. Y voy a ir a trabajo de escritorio, y voy a estar seleccionando
mi carpeta recién creada, que es Studo App Cursor, y hago clic en Abrir Y así, tenemos Cursor abierto sobre
nuestro nuevo proyecto. Y permítanme darles a ustedes una
vista rápida de la interfaz de usuario de Cursor. Y en el lado izquierdo, aquí es donde puedes ver
todos tus archivos. Entonces actualmente, estoy en
la pestaña del explorador de archivos, lo que significa que a medida que Cursor
AI crea nuevos archivos, los
puedo ver justo por aquí. En la segunda sección, puedo buscar archivos. Y en el tercer archivo,
aquí es donde puedo ver mi git, cambios. Así que una vez que configuré git para
este proyecto en particular, puedo ver todos los archivos
que he cambiado. Entonces puedo
entrar directamente y empujar archivos a Github o cualquier tipo de repositorio
remoto desde aquí. Y en el centro,
aquí es donde se puede editar el código. Y en el lado derecho,
esta es la interfaz de IA. Aquí es donde
chateas. Aquí es donde interactúas con la IA. Entonces aquí tenemos un
par de características. Tenemos el
modo agente justo por aquí. Tenemos modo Agente,
tenemos modo planeación, debug ask y diferentes modos. Estaremos pegando
con el modo agente. Y aquí tenemos la sección de conmutación de
modelos. Entonces aquí puedes ver que
he habilitado el autobote. Por lo que selecciona automáticamente el modelo en función de la
tarea que estoy haciendo. Entonces, si lo apago, entonces voy a estar teniendo mi propio, um diligencia para elegir un modelo. Puedo ir con Opus 4.6. Este es el
modelo más potente que ofrece Anthropic. Tenemos a Son al 4.6.
Tenemos GPT 5.2, tenemos Gemini flash y todos estos diferentes
modelos disponibles para nosotros. Pero vamos a estar pegando ahora mismo con el autobot porque
estamos en un plan libre, y eso es todo Y esto es lo básico
que necesitas saber. Aquí tenemos el
ícono más para crear un nuevo chat. Tenemos la opción de ver el historial de chat y
otras cosas aquí también. Entonces esta es una visión general rápida. Antes de seguir adelante,
tenemos que hacer algo de configuración. Uh, así que aquí se puede ver eso. Lo primero que
vamos a hacer es que
vamos a configurar un archivo de regla
Cursor. Entonces, ¿a qué te refieres con regla? Entonces, en términos muy simples, archivo de
reglas es un archivo o se puede llamar como
archivo de instrucciones. Y en ese archivo en particular, definimos lo que estamos construyendo
en términos muy simples. Entonces en nuestro caso, estaremos
construyendo una aplicación de dos do. Entonces lo que
vamos a hacer es que vamos a estar creando
una carpeta Cursor. Y dentro de eso
estaremos creando una carpeta de reglas. Entonces
hagámoslo. Así que voy a hacer click en el nuevo icono de carpeta dt por aquí, y quiero terminar punto Cursor. Y dentro de eso,
voy a estar creando otra carpeta reglas geniales. Y en esta carpeta de
reglas en particular voy a crear otro archivo enfría instrucción punto D. Así que este
archivo de instrucciones es básicamente un contexto para que el LLM o el modelo
tenga siempre presente lo que está construyendo Entonces, la razón para hacer
algo como esto es que a medida que platicas con la modelo, el contexto se llena. Entonces, ¿qué es un contexto? la memoria de un modelo
particular. Cuando
platicas continuamente con un modelo, el contexto, la
memoria se llena. Y como sabes eso,
una charla puede ser larga. Entonces el modelo también necesita
recordar lo que dijiste
al principio, ¿verdad? Pero
a medida que se llena el contexto, lo que
hace internamente el modelo es que elimina contextos que
ya ha almacenado desde arriba. Y el tema que puede surgir
debido a esto es que puede olvidar algunas de estas cosas que se
dice al principio. Entonces para evitar eso, estamos creando un punto de
Instrucción Archivo vacío, y este archivo se pasará como contexto con
cada solicitud que hagas al modelo. Entonces, cada vez que chatees, este archivo de instrucciones
también estará en el contexto de los modelos. Así que nunca olvida
cuál es tu visión, qué es lo
que estás construyendo y cuáles son las cosas básicas que has mencionado en
este archivo de
instrucciones en particular Por lo que el modelo siempre estará
avanzando hacia tu visión. Entonces ese es el propósito principal
de crear un archivo como este. Aquí, ya he creado
un archivo de instrucciones. Entonces esta es mi visión de proyecto que es una aplicación sencilla de
hacer. Y la idea es que estoy
construyendo una aplicación limpia, libre de
distracciones
para hacer, y el objetivo es ayudarnos a mantenernos organizados sin ninguna pelusa
o configuraciones complicadas Esta es mi
tarea de características principales, maan, remo tarea, mantente a salvo, y tengo un par de
instrucciones simples aquí también Entonces este es el archivo de instrucciones, y lo voy a copiar y
voy a
pegarlo justo por aquí. Entonces, cada vez que Cursor haga una solicitud que es cada vez que chatees
con Cursor o con el modelo, tendrá la idea respecto a
este archivo en particular. Entonces esto es lo primero
que debes hacer. Y espero que entiendas
el propósito central de crear un archivo de regla Cursor.
Y aquí se puede ver eso. Cuando hablo,
simplemente puedo presionar la tecla at, y aquí puedes ver que
el archivo de instrucciones aparece
automáticamente justo por aquí. Así que simplemente puedo darle eso
al contexto y a la
consulta que quiero. Por lo que este archivo estará en el
contexto cada vez. Espero que ustedes estén
siguiendo conmigo y hayan creado un punto
Cursor slash Rules folder, y su archivo de instrucciones también
ha sido creado Y a partir de lo siguiente, comencemos con la
construcción para hacer la aplicación.
5. Construcción con IA: Bien, chicos, ha llegado el
momento en que vamos a construir
nuestra aplicación de todo. Y antes de eso, tengo
algo rápido que decir. Entonces, hay dos
formas diferentes de solicitar un LLM. Lo primero o
el primer método es un solo prompt corto donde pones todo lo que quieras
en un solo prompt y luego instruyes a la IA
para que lo construya por ti Esto es realmente posible
para casos de uso muy pequeños. Si quieres hacer
algo muy sencillo, entonces está bien. Pero para construir un software, siempre
se sugiere
seguir una técnica de
incitación de Lego Una
técnica de Lego Prompting
no es más que tienes una idea, y luego
desglosas esta idea en múltiples
pasos accionables o puedes decir que múltiples trozos Tienes un gran prompt
o una gran idea, luego los desgloses en
múltiples indicaciones diferentes que puedes proporcionar al modelo para construir la
aplicación por ti Esta técnica de lego prompt
se considera mucho más efectiva que un intento de aviso de un solo
disparo. Aquí estarás
instruyendo paso a
paso a la IA para construir
lo que quieres Y esto es muy efectivo porque vas a estar
haciendo una cosa a la vez. E incluso si hay algún problema, puedes arreglarlo a nivel
granular en
lugar de hacerlo al final
donde el aire
ya ha terminado de construirse
en su aplicación, y podría tener problemas
con la corrección de errores. Y además, si sigues la técnica de
Lego Prompting, también
estarás ahorrando mucho contexto porque estarás
haciendo una cosa a la vez, arreglando una cosa a la vez, y todo el contexto
será mucho más pequeño porque habría menos cosas de qué preocuparse
en esa etapa en particular Esto es muy importante si estás construyendo una aplicación muy
grande. Entonces estaremos siguiendo eso y comencemos
la primera fase. Entonces aquí voy a estar diciendo que
quiero construir un aspecto básico
de mi aplicación tudo, crear una
página web limpia enviada con un fondo blanco, poner una caja en el medio con un título que diga,
Mis objetivos diarios Dentro de esa caja,
quiero un lugar para escribir una nueva tarea y un botón
que diga una tarea. Por ahora, solo agrega
tres tareas falsas para que pueda ver
cómo se ven. Así es como se
proporciona un aviso. Necesitas ser
específico. decir explícitamente
eso lo que quieres, dónde quieres colocar las cosas, y así es como obtienes un
rendimiento óptimo en una sola toma. De lo contrario,
es posible que deba iterar una y otra vez para hacer las cosas Eso está perfectamente bien. Pero si tienes la paciencia
para escribir un prompt detallado, así es como puedes maximizar
la eficiencia de la IA. Voy a copiar este aviso
en particular y voy a
pegarlo justo por aquí, y también tengo mi archivo Instruction dot MD justo por aquí. Voy a dar este aviso
en particular y vamos a ver qué
superficial va a hacer Entonces chicos, una cosa
para notar aquí que realmente no
he especificado
ningún tipo de extractos. Estoy dejando que la IA elija
un etat para mí. Y en casos como estos, básicamente
se establece por defecto la configuración de Vanida
que es la técnica vanilla, HTML, CSS y
JavaScript. Y esto está perfectamente bien para nosotros porque estamos construyendo
una aplicación muy simple,
pero, uh, si estás construyendo
una aplicación compleja que requiere conexiones de
base de datos, más lógica de renderizado,
etcétera, etcétera, entonces puedes pedirle explícitamente Cursor o a la IA que usen un ejemplo
específico de TextGF, siguiente Jas
vista reactiva angular
puedes especificarlo y en consecuencia construir
ello. Pero en mi caso, quiero una aplicación
muy sencilla usando HTR CSS y JavaScript,
y eso es lo que
hace la IA por defecto, porque en realidad
pasó por el
archivo de instrucciones y el prompt, y básicamente llegó a la conclusión de que esta es
una aplicación muy simple, por lo que no necesita usar un
framework como next o una biblioteca como react porque hay demasiado muy complejo para una
aplicación sencilla como esta. De hecho fui con
el set de vainilla. Aquí puedes ver eso,
creando una sola página para
hacer maquetación para tu instrucción,
limpio mandado, sí Y tenemos los cambios de código, y aquí hay un resumen
de lo que hizo Cursor. Básicamente creó un índice
de archivo HTML, página remitida, caja
principal, agregó un área, tres lugares o una tarea.
El estilo es mínimo. Y aquí puedo dar
click en revisar para ver el cambio de código
que realizó Cursor. Aquí puedes ver
que básicamente escribió todos los estilos en línea. Um, eso es una cosa
que realmente no me gusta. Pidamos realmente
que lo cambie a un archivo CSS diferente
en el siguiente prompt. Pero en el centro,
tenemos los detalles básicos. Así que voy a pedirle que
abstrazca el código CSS del índice HTML del punto índice a
un archivo CSS separado. Entonces aquí, voy a
agregar archivo de instrucciones. Además, voy a especificar mi, uh, archivo HTML índice también, y voy a presionar Ender. Ahora lo que Cursor
va a hacer
es que va a crear un archivo CSS
separado, mover todo el archivo CSS a ese archivo y vincular este archivo
Htable y CSS juntos Y veamos qué
va a hacer. Sí. Creé un archivo CSS, agregué todo el CSS justo por aquí, y veamos qué más
va a hacer. Entonces Cursor se hace
con otra tarea. Entonces creó el archivo CSS, movió todos los estilos
al archivo CSS, y luego
se eliminó el bloque de línea y se reemplazó
con el enlace. Entonces, si hago clic en Revisar, aquí puedes ver todo el
archivo CSS que está justo por aquí. Voy a dar click en keypall y aquí mismo en el archivo
índice o dígito, aquí se puede ver el
enlace al archivo CSS Y esto es exactamente lo
que esperaba que hiciera. Bien, entonces ahora
veamos cómo se ve
actualmente la aplicación. Entonces aquí, lo que puedes hacer es
que puedes ir directamente a extensiones e instalar una extensión llamada
como Live Server. Así que el servidor en vivo es
básicamente una extensión que nos puede ayudar a ver la aplicación directamente sin abrir el archivo
HTML de punto índice manualmente. Entonces eso es instalarlo. Todo bien. Entonces supongo
que está instalado. Y después de instalar eso, vamos a vincular ir al
siguiente archivo do get, haga clic
derecho sobre él, y haga clic
en Abrir con servidor en vivo. Y así así, aquí
puedes ver que tenemos nuestra aplicación de todo muy básica aquí
mismo en la
web. Todo bien. Así que terminamos con la
primera tarea que es
construir una interfaz de usuario de símbolo,
un fondo blanco, un lugar a otra tarea, un botón para agregar la tarea, y un par de tareas ficticias para que podamos ver
cómo se ve la UUI terminamos con
la primera fase, es
decir, el esqueleto visual. Ahora es el momento de
que lo hagamos funcional. Lo que voy a hacer es que
voy a hacer que funcione. Lo que voy a hacer es que
cuando escriba algo en el cuadro y haga clic en en la tarea, realidad aparece en la lista. Además, agrega un pequeño botón
X al lado cada tarea para que pueda
eliminarlo si cambio de opinión. Esto es lo que
voy a hacer a continuación, así que voy a copiarlo y voy a pegarlo
en la ventana de chat. Además, voy a adjuntar mi archivo de
instrucciones como contexto, y voy a decirle a
Cursor que haga esto por mí. Así se hace con la tarea. Entonces aquí está lo que implementó. Implementó la función de tarea de
arte, la función de tarea remota, y ha modificado el
índice o archivo digital, y puede ver un par
de características que agregó. Por lo que crea una nueva etiqueta de IA. Cada uno utiliza un pequeño SK gt nos
ayudará con la
prueba de tipo se muestra como texto plano, etcétera, etcétera, y el archivo tilt cs
también se ha modificado Vamos a hacer clic en Revisar, y aquí podrás ver los
cambios que realizó. Entonces aquí puedes ver
que creó el tag script en línea e
hizo todos estos cambios. Nuevamente, no soy realmente un gran fan de escribir todo
en una página, así que voy a pedirle a Cursor cree un nuevo archivo para almacenar
el contenido de la etiqueta script, que no
es más que Vanila JavaScript. ¿Se puede
abstraer la etiqueta del script? Y crear un nuevo archivo para ello. Entonces, chicos, la razón para hacer esto es
hacerlo modular. Así que nunca deberíamos
escribir realmente código en una sola página. Uh, básicamente deberíamos dividir el código en
diferentes segmentos diferentes. Entonces en este caso,
se puede ver que tenemos todos los estilos almacenados en archivo CSS, el punto de entrada está
en Index o HTML, y luego tenemos
el archivo JS punto app donde básicamente
escribimos toda nuestra lógica. Entonces así es como debes
estructurar tu aplicación, especialmente una
aplicación vainilla como esta. Entonces aquí puedes ver que
básicamente estoy teniendo una visión y básicamente
estoy guiando a la
IA para lograr mi visión. Así es como básicamente debes trabajar cuando estás usando IA. Ya debes tener una idea básica respecto a
lo que quieres, cómo quieres que se vea la
estructura, cómo quieres que se comporte la
aplicación. Entonces quieres
básicamente proporcionar un prompt detallado
muy claro a la IA para que pueda
trabajar hacia tu visión. Así es como básicamente
lo haces. Entonces aquí, básicamente creó
el archivo Abdo Js,
y en el indext del archivo HTML, básicamente
se vinculó
a los js y en el indext del archivo HTML, de Abdo Entonces voy a hacer click en Keypod. Y si voy a mi aplicación, debería poder
agregar una nueva tarea. Entonces voy a decir básicamente Wh Clothes. Y si
le agregas clicon debería venir a la lista
y así así, se
puede ver que los lavados ortografía está mal, así que
voy a borrarlo Lavar la ropa al anochecer. Y tenemos otra característica, y somos capaces de agregar una tarea e incluso eliminar una tarea también. Bien, ya terminamos
con la fase dos. Ahora es el momento de la fase tres. Eso es para marcar la característica. Por lo tanto, necesitamos agregar una
función donde podamos verificar el strike off de una tarea una
vez que se complete la semana. Entonces voy a decir que eso es
agregar una manera de terminar la tarea. Cuando hago clic en el
texto de una tarea, quiero que se ponga gris y
tenga una línea a través de ella, así que demuestre que está hecha. Entonces, si lo vuelvo a hacer clic,
debería volver a la normalidad. Entonces copiémoslo e instruyamos a
Cursor para que haga esto por nosotros. Y así, Cursor
no ha terminado con la tarea, así que tenía un estilo y una app
actualizada dot js. Veamos qué hizo. Entonces creó una función
llamada stogal done, un selector de consultas y
un oyente emir Sí. Así que cada vez
que hago clic en él, esta función en particular
se activa. Y un strike through se
agregaría realmente al texto. Entonces voy a dar
click en Clave pálida. Entonces, si voy a la aplicación, puedes ver si hago
clic en algún texto, se pone tachado y
si vuelvo a hacer clic en
él, básicamente vuelve
a su fecha anterior, y eso es exactamente
lo que quería Entonces lo que voy a hacer es que voy a
quitar todos estos,
y voy a decir, escríbele una carta a papá
haga clic en Agregar tarea. ¿Y si actualizo la página? Se puede ver que
por defecto vuelve al
codificado duro a dos que agregamos Entonces, lo que sea que agreguemos
no se va a persistir, así que necesitamos agregar
esa característica también Esa es la función de memoria. Entonces ahora mismo cuando
actualizo mi navegador, todas las tareas desaparecen. ¿Puedes hacerlo para que
la app recuerde mi lista? Quiero que mis tareas estén ahí
exactamente como las dejé. Entonces si les cierro la pestaña, cierro la pestaña y
vuelvo, debería estar ahí. Entonces voy a copiar
esta tarea en particular y voy a agregar
justo por aquí. Y también, voy
a decir una cosa, quitar la tarea coed dura Y aquí voy a
adjuntar mi expediente de instrucciones. Entonces Cursor es básicamente querer hacer uso del almacenamiento
local de un navegador. Así que cada vez que
ingreses a una tarea, también va a quedar almacenada en el almacenamiento local
del navegador. Entonces, aunque vuelvas, eso va a persistir
justo ahí, y ese debería ser el enfoque que Cursor
debería estar siguiendo Veamos qué
va a llegar a ocurrir. Entonces superficial se hace
con la tarea. Por lo que aquí se puede ver que la tarea del codificador
duro fue eliminada, y en la tarea de
almacenamiento Ado JA se almacena en el almacenamiento local
tal como anticipamos Así que tenemos la
función getTask, guardar la función tarea, crear función de tarea,
renderizar tarea, una tarea, y todas estas funciones
diferentes Lo que hace es que
en realidad se refactorizó en Cada vez que carga
la aplicación, renderiza la tarea
llamando a la función tarea G. Entonces, la función get task básicamente obtiene los datos del almacenamiento local
si hay alguno, o de lo contrario básicamente
proporciona un estado limpio. Y cada vez que
básicamente agregas una tarea, también
se guarda en
el almacenamiento local. Entonces así es como funciona.
Así que vamos a guardarlo. Y si me refresco, se
puede ver que ninguna tarea
está presente en este momento. Entonces voy a cantar una
canción, escribir una carta. Lavar los platos. Y voy a decir que
ya lavo platos y si. Entonces voy a dar
click en refrescar. Y como pueden ver,
cuando si actualizo, estos datos se están persistiendo, pero se puede ver esa casilla de verificación no
se está marcando ya que básicamente golpeo estas tareas Entonces voy a decir
cuando ponga en marcha una tarea, también muestre un cheque. Ya hay botón de verificación, así que vas a decir también llena la casilla de verificación con un ícono de verificación. Bien, así que básicamente lo hizo. Entonces voy a
aceptarlo para que veas
cada vez que me golpee, también
puedes ver que el botón de
verificación se activa con una casilla de verificación verde Entonces eso es todo. Así
es como básicamente puedes incitar a una IA para construir una
aplicación de tu visión. Así que solo pasando por lo
que hemos hecho en esta clase en
particular, lo primero
que hicimos fue crear un archivo vacío de
punto de instrucción. Esto no es realmente relevante en esta
aplicación en particular porque es una muy pequeña y realmente no
tenemos mucha conversación
sucediendo aquí arriba. Pero imagina que estás construyendo una
aplicación de comercio electrónico muy grande. Entonces estarás
interactuando constantemente con la IA
para hacer cambios, agregar cambios, refractor de
cosas y todo Y en ese caso particular, el contexto se hace más grande, y la IA tendería a olvidar lo que
se dice al principio. Entonces en ese caso, puedes crear
un archivo de instrucciones como este para agregar la visión básica de tu aplicación
para que siempre se mueva hacia esa visión
sin halucinar Entonces eso es una cosa. Y lo segundo más importante es la estrategia de
Lego Prompting Asegúrate de desglosar toda
tu visión o idea en múltiples pequeños
bailes ejecutables diferentes que puedas instruir a la IA para que haga, y que puedan darte resultados
mucho mejores que una estrategia de un solo disparo Entonces eso es todo para este video
en particular, y realmente espero
que hayas aprendido algo que te sea útil en tu viaje de usar un Cursor o cualquier
tipo de agentes de IA. Y una cosa que también
quiero señalar es que aquí donde has aprendido en esta clase en particular
es completamente genérico. No está atado al Cursor. Ahora en el futuro,
si cambias a copiloto o Windsor por adorables, todos ellos utilizan esta misma técnica en
particular como
el archivo de instrucciones,
la estrategia de incitación Todo es
básicamente aplicable a todas las demás aplicaciones o cualquier tipo de agentes de IA en
este espacio en particular. Y una cosa que también
quiero decirles chicos es leer a los perros Cursor proporciona
muchas características, como agentes, MCP, etcétera Simplemente dedique algo de
tiempo y revise estos documentos en particular
para comprender cuáles son las diferentes características
que ofrece Cursor. Y, uh, resulta que
habría muchas características que pueden
ayudarte en tu flujo de trabajo diario. Entonces Tas chicos,
muchas gracias por mirar.
6. Conclusión: Muchas gracias por ver. Y es realmente genial que
ustedes hayan hecho hasta el final. De hecho, muestra tu
pasión e interés por crear aplicaciones usando IA y lo cual es extremadamente
apreciable Y yo realmente, realmente quería saber qué piensan
ustedes esta
clase en particular y pueden dejar eso en la sesión de
comando. Y además, si ustedes
tienen algún tipo de consulta, siempre
estoy disponible en
la sesión de discusión. Puedes pausar una consulta,
y estaré más que feliz de ayudarte.
Y eso es todo. Muchas gracias por
ver, y estaré haciendo muchos más
videos sobre IA y cómo puedes usarla
para construir una aplicación, cómo podemos convertir una idea
en un producto de la vida real. Quédate mar para eso hasta entonces hay Peter
Johnson firmando.
Peter Johnson, Software Engineer
