Cómo acceder y editar tu código en Coderick AI
Coderick AI construye tu proyecto a partir de tus instrucciones en el chat, pero lo que produce es una base de código real, los mismos archivos con los que trabajaría un desarrollador. La pestaña CODE abre esa base de código directamente dentro de Coderick AI, para que puedas leerla, entenderla y hacer cambios manuales cuando quieras.
¿Qué desbloquea la pestaña de Código para tu proyecto en Coderick AI?
El principal beneficio de Coderick AI es la capacidad de describir lo que quieres en lenguaje sencillo, sin necesidad de escribir o entender código. Sin embargo, hay momentos en los que sabes exactamente qué necesita cambiarse: una clase CSS, un valor de color, una sola prop, y describirlo lleva más tiempo que hacerlo. También hay momentos en los que simplemente quieres ver qué se ha construido.
Los principales beneficios que desbloquea el acceso al código son estos:
- Visibilidad total. Cada archivo que genera Coderick AI está ahí para que lo abras y leas, así que nada de tu proyecto es una caja negra.
- Las ediciones manuales no consumen créditos. Cambiar un archivo tú mismo no consume créditos, a diferencia de pedirle a Coderick AI que haga el cambio por ti. Para un pequeño ajuste que ya sabes cómo hacer, editarlo directamente es la ruta más rápida y económica.
- Cada guardado es un punto de restauración. Cada guardado exitoso crea una versión a la que puedes volver, así que puedes editar con confianza.
- Sin ataduras. Descarga un solo archivo o todo tu proyecto como un .zip.
¿Cómo acceder a la pestaña Código?
Abre tu proyecto en Coderick AI, luego selecciona CÓDIGO en la barra de pestañas sobre el área de vista previa, junto a PREVIEW y VISUAL EDIT.
La vista previa es reemplazada por la vista de código: el árbol de archivos a la izquierda y el editor a la derecha.
Navegando por tus archivos
El árbol de archivos lista los archivos y carpetas de tu proyecto. Selecciona una carpeta para expandirla y selecciona un archivo para abrirlo en el editor.
Dos cosas hacen que navegar sea más fácil en un proyecto grande:
- Abrir varios archivos a la vez. Abrir un segundo archivo no cierra el primero. Cada archivo abierto tiene su propia pestaña en la parte superior del editor, para que puedas moverte entre ellos mientras trabajas, lo cual ayuda cuando un cambio abarca más de un archivo. Cierra un archivo con el ✕ en su pestaña.
- Colapsar el árbol de archivos. Usa el control de colapso a la izquierda de las pestañas de archivo para ocultar el árbol y darle al editor todo el ancho. Selecciónalo de nuevo para traer de vuelta el árbol.
Editando y guardando
Puedes escribir directamente en el editor y cambiar cualquier archivo a mano. Las ediciones manuales no cuestan créditos.
Tan pronto como cambies algo, la barra de herramientas muestra un indicador de Cambios no guardados, los botones DESCARTAR y GUARDAR se activan, y aparece un punto en la pestaña de cada archivo que has modificado.
Algunos consejos que vale la pena saber cuando estás editando tus archivos:
- Experimenta libremente. Haz un cambio, reescríbelo, deshazlo. Nada llega a tu proyecto hasta que haces clic en Guardar. Además, puedes usar CTRL + Z para deshacer y CTRL + Y para rehacer.
- Publica un conjunto de cambios como una sola construcción limpia. Guardar desencadena una nueva versión de tu proyecto con todos los cambios que has hecho. Mantener tus ediciones hasta que estés listo significa que un guardado deliberado produce una construcción, en lugar de que tu proyecto se reconstruya cada vez que tocas un carácter.
- Puedes descartar tus cambios. El botón DESCARTAR elimina tus ediciones no guardadas y devuelve los archivos a su último estado guardado.
¿Qué sucede cuando guardas?
Una nueva tarjeta de versión aparece en el panel de chat, etiquetada como Edición de código y con marca de tiempo. Esa versión es un punto de restauración: los controles de la tarjeta te permiten ver esa versión o restaurar tu proyecto a ella más tarde, si un cambio posterior no funciona. En otras palabras, cada guardado exitoso te da una versión a la que puedes volver.
Dirigir a Coderick AI a un archivo específico
No tienes que hacer cada cambio tú mismo. Puedes referenciar el archivo abierto en tu próximo mensaje de chat. El archivo aparece como una ficha sobre el cuadro de mensaje, y luego escribes lo que quieres cambiar en texto plano como de costumbre.
Referenciar un archivo delimita el trabajo a ese archivo, lo que hace que las ediciones y explicaciones de Coderick AI sean más rápidas y precisas que una solicitud general, porque no tiene que averiguar a qué parte del proyecto te refieres.
Buscando en tu código
Hay dos tipos de búsqueda, para dos trabajos diferentes.
Buscando en todo el proyecto. Usa el campo de búsqueda sobre el árbol de archivos y selecciona el icono de búsqueda para ejecutarlo. Los resultados regresan en dos secciones, cada una con un conteo:
- Archivos: archivos cuyo nombre coincide con lo que escribiste.
- En archivos: archivos cuyo contenido coincide, con el número de coincidencias en cada uno.
Así puedes encontrar un archivo cuando recuerdas su nombre, y encontrar una cadena cuando solo recuerdas lo que dice el código.
Buscando dentro del archivo abierto. Presiona CTRL + F, o selecciona el icono de búsqueda en la barra de herramientas de la pestaña de Código, para abrir la barra de búsqueda para el archivo que estás viendo actualmente. Resalta cada coincidencia y muestra un contador de coincidencias.
Descargando tu código
Seleccionar el icono de descarga en la barra de herramientas de la pestaña de Código te permite:
- Descargar archivo seleccionado: descarga el archivo que está actualmente abierto en el editor.
- Descargar toda la base de código: descarga todo el proyecto como un archivo .zip.
