Rogue Syntax es mi base de operaciones en internet: la página donde explico qué hago, cómo trabajo y qué tipo de sistemas construyo. Ha pasado por varias vidas (Angular, plantillas PHP/JS, AstroJS…) hasta llegar a la versión actual, una SPA estática construida a mano con HTML y CSS, sin frameworks.

En esta iteración decidí abandonar plantillas y temas prehechos —gratuitos y de pago— y diseñar la web desde cero. El objetivo: tener un sitio ligero, rápido, fácil de mantener y totalmente alineado con mi marca, sin arrastrar el peso de un framework que no necesito.

Para ello definí mi propia arquitectura técnica SPA para páginas estáticas, que reutilizo como base en otros proyectos: sistema de layout, navegaciones, animaciones y clases utilitarias en CSS que aceleran mucho el desarrollo y permiten transiciones suaves entre secciones sin perder simplicidad.

También diseñé una librería de iconos en CSS basada en Pixel Icons. Los iconos SVG se integran directamente en las plantillas a través de clases, lo que reduce código repetitivo, simplifica el marcado y hace más rápido experimentar con nuevas combinaciones visuales.

Bajo el capó, esta web incluye varios elementos interesantes: el fondo de estrellas estáticas, el script de estrellas fugaces aleatorias, el script del scroll segmentado,el sistema de tabs del portfolio y el buscador/paginado del blog. Son piezas pequeñas, pero juntas definen la experiencia de navegación que quiero trasladar a otros proyectos: ligera, fluida y sin ruidos innecesarios.

Aun así, la parte más intensa de este proyecto no ha sido el código, sino el trabajo de diseño, estructura de contenidos y storytelling. He dedicado más tiempo a pensar qué quiero contar, cómo organizarlo y cómo guiar al visitante que a programar la propia web. Esa mezcla de producto, mensaje y sistema es justo la que luego aplico cuando diseño soluciones para clientes.

Youtube2Ivoox es un agente de automatización escrito en Python que construí para resolver un problema muy concreto de muchos creadores: publicar el mismo contenido en YouTube y en iVoox sin duplicar trabajo.

El flujo manual clásico es absurdo: descargar el vídeo, extraer el audio, preparar los archivos, entrar en iVoox, rellenar formularios uno a uno, subir cada episodio… y repetir cada vez que hay nuevo contenido. Youtube2Ivoox convierte todo ese proceso en automático.

Qué hace exactamente

El agente trabaja como un “puente” entre tu canal de YouTube y tu cuenta de iVoox:

• Revisa los últimos 15 vídeos de tu canal de YouTube y comprueba cuáles ya se han procesado usando una pequeña base de datos en JSON.
• Descarga solo los vídeos nuevos y extrae el audio de cada uno, dejándolo listo como archivo de podcast.
• Abre una sesión de navegador controlada con Selenium, entra en iVoox, hace login y sube cada audio como nuevo episodio, autocompletando títulos, descripciones y el resto de campos necesarios.

En la práctica, el creador solo tiene que seguir como siempre: subir sus vídeos a YouTube. El agente se encarga del resto: detectar qué es nuevo, generar los audios y mantener el podcast de iVoox actualizado sin pasos manuales.

Arquitectura técnica

Por debajo, Youtube2Ivoox es una pequeña arquitectura de automatización basada en Python 3 + Selenium:

• Un módulo de ingestión que obtiene la lista de vídeos y gestiona el registro de qué episodios ya han sido procesados (fichero JSON como “mini DB”).
• Un módulo de procesado que descarga los vídeos y extrae el audio, generando los ficheros listos para subir.
• Un módulo de automatización web que, con Selenium, navega por iVoox igual que lo haría un usuario humano: login, alta de nuevo episodio, subida del archivo y rellenado de los campos del formulario.

Toda la configuración (credenciales, rutas, opciones) está aislada, de forma que el agente se puede adaptar a distintos canales y cuentas con cambios mínimos.

Para quién tiene sentido

Youtube2Ivoox es un ejemplo pequeño pero muy claro del tipo de automatización que diseño para creadores y negocios:

• Creadores que publican vídeo en YouTube y quieren replicar contenido en formato podcast sin invertir horas en tareas repetitivas.
• Negocios que trabajan con contenido recurrente y necesitan mantener “en sincronía” varias plataformas.
• Cualquiera que quiera transformar un flujo manual de “clics y formularios” en un proceso automático ejecutable desde su propio entorno.

No es solo un script: es un buen ejemplo de cómo abordo este tipo de problemas en general. Definir el flujo, encapsular la lógica, evitar duplicar trabajo y hacer que las plataformas trabajen para ti, no al revés.

Aproveché el desarrollo de esta web para crear mi propia arquitectura técnica para sitios estáticos con experiencia de SPA ligera: DemiurgeJS. El nombre viene de la filosofía platónica: el Demiurgo como “supremo artesano”, el que da forma al mundo. La idea es la misma aplicada al código: una pieza pequeña que ordena y da forma al resto del sistema.

Desde un punto de vista técnico, DemiurgeJS es una arquitectura pseudo-SPA para páginas estáticas: mantiene HTML servido de forma tradicional, pero añade enrutado en cliente, carga de parciales y scripts por página, más un servicio de modales reutilizable. Todo con el objetivo de tener una UX fluida sin tener que arrastrar el peso de un framework completo.

El núcleo se compone de dos artefactos: un bundle JavaScript y un core CSS con los estilos base. Ambos se generan mediante scripts de build en Node, de forma que la arquitectura se puede reutilizar en otros proyectos sin depender de tooling externo.

A alto nivel, DemiurgeJS aporta:

• Un bootstrap que inyecta los parciales de layout (header, footer, etc.) definidos en una configuración global y marca automáticamente la navegación activa.
• Un router pseudo-SPA que intercepta enlaces internos, carga el documento de destino, reemplaza solo el <main> con transiciones suaves, actualiza el history.pushState y dispara hooks tras cada navegación.
• Un cargador de scripts por página que lee la configuración (por ejemplo, vía data-page) y ejecuta solo la lógica necesaria en cada vista, evitando rehidrataciones innecesarias.
• Un servicio de modales con delegación de eventos sobre document, de forma que los modales cargados dinámicamente funcionan sin tener que volver a registrar listeners.

El resultado es una base muy ligera para construir sitios estáticos con comportamiento de SPA: navegación rápida, estructura clara, sin vendor lock-in y con un coste de mantenimiento mucho más bajo que el de una SPA clásica sobre frameworks pesados. Es la misma base que puedo reutilizar después en proyectos de clientes que necesitan frontends sencillos, rápidos y bien estructurados.

CØØK13 DUMP3R es una extensión para monitorizar y exportar cookies de dominios concretos. Está pensada para entornos de desarrollo, QA y automatización: cuando necesitas ver qué está pasando en sesiones reales, preparar entornos de prueba o enviar el estado de autenticación a otros sistemas.

La extensión vigila una lista configurable de hostnames y te permite volcar las cookies a un archivo o a un endpoint HTTP. Todo se gestiona desde un popup que funciona como una mini SPA: sin salir de la extensión puedes añadir dominios, ajustar opciones y lanzar volcados bajo demanda.

Entre las funciones principales destacan:

• Gestión de dominios vigilados: se añaden a mano o con un botón que toma automáticamente el hostname de la pestaña activa.
• Panel de estado que muestra el resultado de cada acción (altas/bajas de dominios, volcados, errores, etc.).
• Modo AUTO-DUMP: la extensión escucha la navegación en segundo plano y, cuando visitas un dominio vigilado, lanza el volcado según el modo configurado (archivo o HTTP).
• Acciones rápidas como DUMP TAB (solo la pestaña actual) o DUMP ALL (todos los dominios vigilados).

A nivel interno, las cookies se agrupan por sitio y se envían en un único payload, con la información cifrada antes de serializar y descifrada justo antes de generar el JSON final. La extensión solo persiste configuración (dominios, flags y endpoints), no los datos sensibles en sí.

En resumen: CØØK13 DUMP3R ahorra tiempo en debugging y automatización cuando necesitas entender o reutilizar el estado de sesión de varios sitios sin hacerlo todo a mano.

SHØRTS LØCK3R es justo lo contrario: en vez de darte más información, te quita ruido. Es una extensión hecha para bloquear la experiencia de YouTube Shorts y proteger tu capacidad de concentración.

Cada vez que una pestaña navega a una URL del tipo https://www.youtube.com/shorts/*, la extensión redirecciona automáticamente a la página principal de YouTube. El comportamiento está activado por defecto, pero se puede activar o desactivar desde el popup con un simple toggle.

Funcionamiento básico:

• Un service worker en background observa las actualizaciones de pestañas para hostnames de YouTube (youtube.com, www.youtube.com, m.youtube.com).
• Si el path es exactamente /shorts o comienza por /shorts/, redirige la pestaña a https://youtube.com.
• La redirección solo se aplica cuando la preferencia almacenada shortsRedirectEnabled está activa.

Es una herramienta pequeña, pero muy efectiva: convierte un patrón de consumo adictivo en una experiencia mucho más controlable. Ideal para creadores, desarrolladores o cualquier persona que quiera usar YouTube sin caer en el agujero de los Shorts.

Ambas extensiones comparten la misma idea: automatizar decisiones que no quieres tomar todos los días. Ya sea gestionar cookies en entornos complejos o evitar distracciones en YouTube, el objetivo es el mismo: construir pequeñas piezas de software que te dejan más tiempo y foco para lo importante.

Batch Bunny es una herramienta que desarrollé para auditar cómo se sirven los vídeos embebidos en Bunny.net en la página de una universidad destacada: detectar qué contenidos están realmente expuestos, qué flujos de entrega están mal configurados y cómo se podrían endurecer. Nació como un script ofensivo para pruebas de seguridad controladas y acabó convirtiéndose en una pequeña plataforma de análisis y automatización.

La idea es simple: muchas plataformas delegan la entrega de vídeo en CDNs como Bunny.net mediante iframes. Si la configuración es la correcta (URLs firmadas, checks de origen, políticas de acceso, etc.), el contenido debería estar bien protegido. Si no lo está, un atacante con pocos medios puede descargar lotes enteros de material sin pasar por la capa de aplicación. Batch Bunny está diseñado para detectar precisamente ese tipo de fallos de configuración en entornos donde se tiene autorización para testear.

Qué hace Batch Bunny

Desde el punto de vista funcional, Batch Bunny actúa como un exploit automatizado de extracción:

• Lee una lista de iframes de Bunny.net y resuelve qué recursos de vídeo hay realmente detrás (HLS/MP4, según el caso).
• Intenta descargar los vídeos en lote y los guarda en una carpeta estructurada; si la configuración del CDN es correcta, el flujo falla donde tiene que fallar y queda registrado como “correctamente protegido”.
• Puede extraer el audio normalizado de cada vídeo, creando un espejo en formato podcast para escenarios donde el contenido es propio o se dispone de autorización explícita.

En la práctica, Batch Bunny te permite responder a una pregunta muy clara: “¿Qué parte de este catálogo de vídeos se puede descargar?”.

Arquitectura ofensiva

Técnicamente, el ecosistema está construido en Python 3 + ffmpeg y se organiza en varios módulos:

• Un componente que, a partir de un iframe, analiza la respuesta, localiza el recurso de vídeo y trata de bajarlo a disco.
• Un batch runner que recorre listas enteras de iframes y genera nombres de archivo limpios, gestionando colisiones y errores.
• Un módulo “podcaster” que convierte los vídeos descargados en audio listo para consumo (bitrate, normalización, formatos).
• Un orquestador que lee un fichero de configuración y dispara los distintos pasos en función del objetivo de la prueba (solo vídeo, vídeo + audio, etc.).

Todo el comportamiento está config-driven: rutas, opciones de audio, listas de objetivos, etc. Eso lo hace reutilizable en distintos escenarios de auditoría sin tocar el core del código.

Enfoque de hacking ético

Batch Bunny está pensado para testing autorizado: revisiones internas, laboratorios de seguridad, ejercicios de Red Team o análisis de configuración de CDNs donde se dispone de permiso formal para realizar pruebas. Igual que otras herramientas de hacking ético modernas, el foco está en identificar superficies de ataque y malas prácticas de configuración, no en exfiltrar contenido de terceros porque sí.

El propio diseño del proyecto y su documentación enfatizan esta parte: uso en entornos controlados, respeto a la legalidad y a las políticas de divulgación responsable típicas de pentesting profesional y bug bounty.

Qué dice de mí como exploit/security dev

Batch Bunny es una muestra de cómo abordo el desarrollo de tooling ofensivo.

Junto con otras piezas del Rogue Ecosystem (extensiones de navegador, agentes de automatización, pipelines de contenido), Batch Bunny refuerza una idea clave: sé moverme en la frontera entre desarrollo, automatización y seguridad ofensiva, y puedo construir herramientas específicas para auditar sistemas reales y endurecerlos.

⚠️ Nota: Batch Bunny se utiliza exclusivamente en contextos de hacking ético y con autorización explícita. Cualquier uso fuera de ese marco puede ser ilegal. El objetivo del proyecto es mejorar la seguridad de implementaciones sobre Bunny.net, no aprovechar configuraciones débiles en entornos de terceros.

Siempre me han gustado las interfaces con personalidad: más cerca de un videojuego retro que de una landing corporativa genérica. Descubrí Pixelarticons, una librería de casi 500 iconos en estilo pixel art sobre una cuadrícula de 24x24, pensada para diseños minimalistas y algo brutales.

Empecé usándolos “a pelo”, copiando SVGs de un proyecto a otro, hasta que me di cuenta de que estaba repitiendo el mismo ritual una y otra vez. En algún momento dejó de ser un conjunto de iconos y empezó a ser parte de mi lenguaje visual.

De ahí nace Pixel Icons Library: en lugar de tratar cada icono como un archivo suelto, los convierto en un sistema. Un pequeño paquete de estilos que me permite aplicar ese pixel art —coherente, reconocible, retro— en todas mis interfaces: webs, paneles internos, herramientas propias y proyectos de clientes que lo deseen.

El resultado no es solo “tener iconos bonitos”. Es tener una identidad visual consistente que conecta muy bien con mi forma de trabajar: soluciones técnicas sólidas, sí, pero también un punto de rebeldía estética. No todo tiene que parecer una plantilla de banco; a veces un simple icono pixelado dice “este sistema lo ha hecho alguien que cuida los detalles”.

Pixel Icons Library es precisamente eso: una pieza pequeña, casi invisible, que ayuda a que todo el ecosistema Rogue se sienta como un lugar propio, no como un conjunto de proyectos desconectados.