Lecciones de Código con IA

En esta lección, exploraremos las últimas novedades y avances dentro de nuestra comunidad, marcando el regreso a la actividad después de un breve receso. Nos centraremos en las nuevas integraciones tecnológicas y el progreso de nuestros miembros, destacando cómo estas innovaciones están mejorando la experiencia de aprendizaje y certificación. Descubriremos la reciente integración de certificaciones con tecnología blockchain, utilizando la red Polygon para garantizar la trazabilidad y la inmutabilidad de los diplomas. Analizaremos cómo esta implementación ofrece un sistema de certificación robusto y de bajo costo, y cómo se vincula con los cursos disponibles en la plataforma. También escucharemos testimonios de miembros sobre su progreso y la utilidad de las herramientas y el soporte de la comunidad. La lección también abordará la importancia del feedback de la comunidad para el desarrollo de nuevos proyectos y la mejora continua de la plataforma, ejemplificando con casos de éxito de estudiantes que han logrado avances significativos en sus proyectos personales gracias al apoyo y los recursos proporcionados.

En esta lección, exploraremos los desafíos y estrategias para la gestión de proyectos y la carga de trabajo en el ámbito profesional, especialmente cuando la demanda de servicios es alta. Analizaremos cómo equilibrar el crecimiento profesional con la capacidad operativa, evitando el agotamiento y asegurando la calidad del trabajo. Se discutirán diversas tácticas para manejar un volumen elevado de proyectos, incluyendo la delegación de tareas, la priorización de proyectos y la gestión de expectativas del cliente. También se abordarán situaciones complejas como la gestión de pagos internacionales y la importancia de establecer condiciones claras antes de iniciar un nuevo trabajo. La lección incluye un caso real sobre la gestión de un proyecto con retrasos en el pago y las implicaciones de los pagos internacionales, destacando la importancia de la comunicación y la claridad en los acuerdos para evitar complicaciones. Se enfatiza la necesidad de tomar decisiones estratégicas para mantener un flujo de trabajo sostenible y rentable.

En esta lección, exploraremos el funcionamiento de WorkTrees en un entorno de desarrollo, centrándonos en su visualización y gestión dentro de la interfaz de usuario. Aprenderás a identificar cuándo y cómo aparecen los WorkTrees, así como a solucionar problemas comunes relacionados con su despliegue y sincronización. Analizaremos casos donde los WorkTrees no se muestran inicialmente, discutiendo la importancia de la configuración del proyecto y la relación con los repositorios. Se abordarán conceptos como la sincronización remota y la gestión de subagentes, destacando cómo estos elementos influyen en la experiencia de desarrollo. La lección incluirá una demostración práctica de creación y gestión de un nuevo WorkTree, mostrando cómo interactuar con él y solucionar posibles inconvenientes, como la no aparición de las opciones esperadas en la interfaz.

En esta lección, exploraremos la importancia de la eficiencia y la gestión del tiempo en el ámbito profesional, incluso en situaciones inesperadas. Aprenderás cómo mantener la productividad y cumplir con tus compromisos, a pesar de los desafíos que puedan surgir en tu día a día. Se abordará la capacidad de adaptación y la resolución de problemas bajo presión, destacando cómo una mentalidad orientada a la acción puede transformar un día caótico en una jornada productiva. Se mencionan herramientas como ClickUp para la gestión de tareas y la importancia de la comunicación efectiva con los clientes. La lección ilustra un caso real donde, a pesar de imprevistos personales y profesionales, se logró completar un conjunto de tareas críticas, incluyendo un deploy y la preparación de documentación, demostrando la aplicación práctica de la resiliencia y la planificación estratégica.

En esta lección, exploraremos el proceso de especificación y desarrollo de plugins y plantillas personalizadas para WordPress, con un enfoque en la filosofía de "cero dependencias". Aprenderá a definir los requisitos de sus proyectos desde cero, evitando el uso de plugins externos y construyendo soluciones robustas y autónomas. Se detallará cómo utilizar herramientas de inteligencia artificial como Gemini (o ChatGPT, Claude) para generar documentación de proyectos, incluyendo la creación de PRD (Product Requirements Document). Analizaremos la estructura de tres proyectos específicos: dos plugins y una plantilla personalizada, destacando la importancia de la autonomía y la integración de APIs externas, como la de TMDB, para la gestión de contenido. Además, se abordará la creación de Custom Post Types (CPTs) para almacenar datos externos, la implementación de REST APIs con endpoints personalizados y la documentación de estas APIs utilizando estándares como Swagger y OpenAPI, asegurando una integración fluida y escalable.

En esta lección, exploraremos un caso práctico de desarrollo de una aplicación de diseño de interiores, enfocándonos en la resolución de problemas comunes y la implementación de funcionalidades avanzadas. Aprenderás a identificar y solucionar errores típicos en entornos de desarrollo, como la necesidad de reiniciar el servidor tras cambios en la base de datos, y a manejar la interacción con el usuario de manera efectiva.Se abordará la gestión de un proyecto con Habiteka y Prisma, discutiendo la importancia de la validación en tiempo de ejecución (runtime validation) y la gestión de chunks. Además, profundizaremos en la creación y manipulación de elementos de diseño en un entorno 2D y 3D, incluyendo la agrupación, desagrupación, posicionamiento y escalado de objetos, así como la adaptación de medidas reales en el diseño.Finalmente, la lección te mostrará cómo aplicar estilos de diseño predefinidos (minimalista, rústico, art deco, etc.) y generar renders a partir de un plano, utilizando prompts para especificar materiales y otros detalles. Esto te permitirá comprender el flujo de trabajo completo desde la creación del plano hasta la visualización en 3D y la generación de propuestas de diseño.

En esta lección, exploraremos el proceso de integración de diseños y funcionalidades en un proyecto web existente. Nos centraremos en cómo fusionar elementos de diferentes fuentes para crear una experiencia de usuario cohesiva y atractiva, prestando especial atención a la estructura y los componentes visuales. Aprenderemos a analizar y combinar elementos de diseño de dos proyectos, Open Design (OD) y Stitch, para construir una interfaz rica y funcional. Se discutirán conceptos como la integración de una landing page con una funcionalidad de chat, la aplicación de un design system, y la fusión de estilos visuales como el glamorfismo y patrones de giro. También abordaremos la importancia de una paleta de colores bien definida y la integración de animaciones puras. Veremos cómo implementar un chat dentro de la interfaz de la landing page, asegurando que el usuario pueda navegar fluidamente entre el chat y el contenido principal, con opciones para volver y contactar. Esto permitirá al usuario generar diseños web a partir de una conversación fluida, manteniendo toda la interacción dentro de una misma ventana.

En esta lección (Workshop 8) exploramos la creación de sistemas complejos como un CRM integrado, la automatización con clientes mediante hojas de cálculo y GitHub Issues, la planificación arquitectónica con IA multiagente (Predict), auditorías Red Team con claudekit, y la exploración de ecosistemas abiertos como Jan.ai para modelos fine-tuned.

En esta lección (Workshop 7), exploramos la automatización remota avanzada, la integración de MCPs (Model Context Protocol) y la orquestación multiagente con Multica y Hermes. Aprende a controlar tu entorno de desarrollo desde Telegram, publicar en redes sociales mediante APIs directas, actualizar dependencias de forma autónoma y ejecutar auditorías de seguridad con agentes especializados.

En esta lección (correspondiente al Workshop 6), profundizamos en el ecosistema de inteligencia artificial aplicado al entorno de trabajo local, explorando el uso de asistentes personales, la automatización de procesos mediante sistemas de múltiples agentes y la eficiencia del contexto.

En esta sesión del taller profundizamos en la optimización de costes y recursos al trabajar con Inteligencia Artificial, la implementación de herramientas de diseño automatizadas, y la delegación de tareas a sistemas multiagente avanzados.

Ecosistemas Multiagente, Open Design y Arquitectura HeadlessEn esta lección profundizamos en el uso de herramientas de orquestación de agentes IA, la generación automatizada de interfaces visuales y la construcción paso a paso de un proyecto headless integrando WordPress y Astro. A continuación, se detallan los conceptos y procesos técnicos desarrollados durante la sesión:1. Sistemas Multiagente Avanzados (Hermes y Multica)La evolución del desarrollo web requiere delegar la codificación manual a sistemas orquestadores donde el programador actúa como un supervisor de agentes.Hermes: Es altamente recomendado para entornos multiagente complejos y asistencia personal. Ofrece la ventaja de integrarse con aplicaciones móviles como Telegram, permitiendo enviarle notas de voz para que ejecute tareas (por ejemplo, revisar el código o el estado de una rama de desarrollo) sin necesidad de estar frente al ordenador.Multica: Se presenta como una plataforma gratuita y de primer nivel para la gestión y orquestación de proyectos. Permite conectar diferentes entornos locales, importar skills (habilidades) desde repositorios, y lanzar múltiples agentes de inteligencia artificial para trabajar en equipo sobre el código base.2. Generación de Interfaces de Usuario con Open DesignOpen Design es una solución avanzada que permite generar interfaces visuales completas y totalmente responsivas (incluyendo la generación de paneles y dashboards) a partir de simples instrucciones de la IA.Uso de design.md: La mejor práctica consiste en utilizar esta herramienta para crear y estructurar un sistema de diseño (que incluya tipografías, colores, y espaciados). Posteriormente, se exporta este sistema como un archivo Markdown (design.md) y se le proporciona al asistente de IA (como Claude) para que este escriba el código del frontend manteniendo una coherencia visual perfecta en toda la aplicación.3. Arquitectura Headless (WooCommerce + Astro 6)Se plantea un proyecto práctico para construir una tienda en línea automatizada (orientada al dropshipping desde AliExpress) utilizando una arquitectura desacoplada o headless.El Backend (WordPress): Desplegado localmente utilizando Docker, opera exclusivamente como el gestor de contenidos y de la tienda utilizando el plugin WooCommerce.El Frontend (Astro 6): Se utiliza la versión más reciente del framework Astro (v6) para construir una interfaz web ultrarrápida. Este frontend extrae la información de los productos conectándose a los endpoints nativos de la API REST de WooCommerce.Autenticación API: Para conectar ambos sistemas de forma segura, se emplean claves de autenticación básica (Basic Auth) generadas desde WooCommerce. A su vez, para permitir la autenticación y la sincronización de los carritos de los usuarios registrados, se establece el uso del plugin JWT Authentication dentro del entorno de WordPress.4. Prevención de Errores y Gestión de Contexto con EngramDurante el desarrollo con asistentes locales (como Claude Code), es común que el chat se bloquee o se cuelgue al intentar procesar imágenes o capturas de pantalla pesadas, deteniendo el flujo de trabajo.Solución mediante Bifurcación (Fork): Si la terminal se bloquea, la técnica recomendada es hacer un fork o retroceder en el historial de la conversación a un punto estable anterior al error.Uso de Engram: Una vez en el punto estable, se le indica a Engram que guarde todo el contexto y la planificación en su memoria persistente. De este modo, se puede abrir una nueva ventana de chat, recuperar la memoria y continuar el proyecto intacto.5. Estrategia de Criterios de Éxito (Success Criteria)Al automatizar el desarrollo, no basta con proveer una descripción general de las funcionalidades; se debe exigir a la IA el cumplimiento de Criterios de Éxito medibles.Ejemplos prácticos: el diseño debe cargar con Server Side Rendering (SSR), las pruebas unitarias (tests) deben superar el 80% de cobertura en color verde, y el puntaje de PageSpeed de Google debe ser superior a 80 en móvil. Esto obliga al agente a ejecutar comprobaciones locales antes de marcar una tarea como completada.6. Configuración Profesional de Entorno y Control de VersionesEntornos de Ejecución Rápidos: Se establece como convención estricta dejar de utilizar el tradicional npm debido a su lentitud, adoptando alternativas modernas y rápidas como pnpm (o Bun) para instalar y gestionar dependencias.Flujo de Ramas (Branching) y Versionado Semántico: Cualquier desarrollo debe utilizar metodologías profesionales de Git. Esto incluye aislar cada nueva funcionalidad en ramas específicas (como develop o feature), dejando la rama main bloqueada exclusivamente para lanzamientos estables. Además, el avance del código se debe documentar mediante versionado semántico (SemVer) implementando etiquetas (tags) por cada fase terminada (ej. v0.1.0, v0.2.0).Mantenimiento de Herramientas: Es de extrema importancia mantener actualizados tanto el CLI general como las skills, ejecutando frecuentemente en terminal comandos como cloud update y ckupdate para evitar dependencias obsoletas.