Telar

🧠 La idea

Telar nació de una frustración con el desarrollo web moderno.

Para construir una app simple hoy necesitas elegir entre decenas de frameworks, configurar webpack, escribir JSX, gestionar dependencias… todo eso antes de haber resuelto el problema real.

La hipótesis: ¿y si pudieras describir lo que quieres en español, y el compilador tomara todas las decisiones técnicas por ti?

---

🚀 Qué hace

aplicación MiTienda
  dominio "https://mitienda.com"

diseño principal
  navbar
    título "MiTienda"

página inicio en "/"
  título "Bienvenido"
  mostrar Producto recientes
    máximo 8
    ordenados por precio
    si falla
      mostrar "Sin conexión"
      reintentar en 5 segundos

página producto en "/producto/(id)"
  diseño principal
  mostrar Producto filtrados por id = parametro.id

  variable cantidad = 1
  texto cantidad
  botón "+" hacer sumar cantidad
  botón "Añadir al carrito" hacer añadirAlCarrito

Eso compila automáticamente a HTML semántico, CSS responsivo y JavaScript optimizado. El selector de cantidad de la segunda página es interactivo — suma en el navegador al hacer clic — sin escribir una sola línea de JS.

• Sintaxis declarativa en español estructurado
• Diseños y componentes reutilizables entre páginas
• Rutas dinámicas (/producto/(id)) resueltas en tiempo real, no como archivos estáticos
• Variables y estado local — interactividad real sin tocar JavaScript
• Formularios con validación HTML5 nativa (requerido, mínimo, máximo)
• Temas oscuro/claro, alternables en vivo y persistentes
• SEO automático: og:tags, sitemap.xml y robots.txt sin configuración
• Optimización móvil, caché y accesibilidad ARIA por defecto
• Mensajes de error en español con contexto visual
• CLI completa: compilar, servir, verificar, nuevo
• Gestor de paquetes con paquetes oficiales
• Live reload en el servidor de desarrollo
• Extensión oficial para VS Code
• Release automatizada: un git tag dispara tests, build, publicación en npm y release en GitHub, sin tocar nada a mano

---

🏗️ Arquitectura del compilador

Telar implementa un compilador completo en tres fases:

• Lexer — tokeniza el archivo .telar reconociendo el español con tildes y ñ
• Parser — construye el árbol de sintaxis abstracta (AST) desde los tokens
• Generador — recorre el AST y produce HTML semántico + CSS responsivo, y un runtime JS propio para el estado, la validación y las rutas dinámicas

Cada fase tiene su propio sistema de errores con mensajes en español y sugerencias concretas de cómo arreglarlos, incluyendo contexto visual de las líneas del archivo.

---

📦 Ecosistema

Telar tiene su propio gestor de paquetes basado en GitHub:

telar nuevo mi-proyecto
telar añadir navbar
telar añadir formulario
telar añadir lista
telar servir app.telar

Los paquetes son repositorios de GitHub con el prefijo telar-. Cualquiera puede crear y publicar paquetes para la comunidad.

---

📊 Lo interesante del proyecto

Lo más complejo no fue generar HTML, sino:

• Diseñar una gramática que se lea como español natural pero sea determinista
• Manejar la ambigüedad del lenguaje humano sin perder precisión
• Construir mensajes de error útiles con contexto visual de línea y columna
• Implementar un sistema de indentación significativa compatible con el parser
• Crear un gestor de paquetes sin infraestructura propia usando GitHub como registro
• Añadir estado y reactividad al navegador sin introducir un framework — un botón que suma una variable y actualiza la pantalla, generado desde una sola línea declarativa

El reto principal fue encontrar el equilibrio entre legibilidad humana y precisión de compilador — demasiado libre y el compilador es ambiguo, demasiado estricto y pierde la naturalidad del español.

Una parte igual de importante ha sido la disciplina de pruebas: cada función nueva se compila y se verifica de verdad antes de darla por cerrada, lo que ha sacado a la luz varios bugs reales que llevaban tiempo sin detectarse silenciosamente en producción.

---

🎯 Estado actual

Telar está en v0.15, con compilador completo, CLI, gestor de paquetes, extensión VS Code, diseños y componentes reutilizables, rutas dinámicas, variables y estado local, formularios con validación, temas visuales, SEO automático, y un pipeline de release totalmente automatizado — un git tag dispara tests, build, publicación en npm y release en GitHub. 181 tests automatizados cubren el compilador y el CLI.

La v1.0 será el lanzamiento público, con la sintaxis ya estable.

---

📦 Instalación

npm install -g @davidbc01/telar
telar nuevo mi-proyecto
cd mi-proyecto
telar servir app.telar