- Hyperclay permite crear webapps donde toda la UI, la lógica y los datos se integran en un solo archivo HTML
- Es posible hacer ediciones inmediatas y compartir en tiempo real directamente desde el propio archivo, con control total sobre la apariencia, el comportamiento y hasta la forma de edición de la app
- Ofrece una estructura de ejecución y guardado instantáneos sin proceso de build o despliegue aparte, base de datos ni backend complejo
- Con un solo archivo HTML, la app puede ejecutarse en cualquier lugar: navegador, servidor u offline, y todos los cambios quedan versionados y pueden recuperarse
- Está diseñado para reducir la complejidad del desarrollo web moderno y permitir que cualquiera cree fácilmente apps interactivas vivas en tiempo real
Introducción: Hyperclay, webapps vivas hechas con un solo archivo HTML
- Hyperclay ofrece a los programadores la experiencia de moldear webapps como si estuvieran esculpiendo un producto, usando un único archivo HTML portable y sin gestionar infraestructura compleja
- Busca una estructura autosuficiente basada en un solo archivo, eliminando elementos que antes eran esenciales en el desarrollo web como archivos de configuración, builds, frameworks y pipelines de despliegue
Concepto central y ventajas
- La app está compuesta por un solo archivo HTML
- El propio archivo puede editarse en tiempo real mediante una UI visual, y esos cambios se guardan de forma permanente como estado de la app
- La UI, la lógica y los datos están incluidos dinámicamente dentro de un mismo archivo
- El usuario puede modificar la app al instante como si fuera un documento, y compartir o descargar los cambios de inmediato para usarlos también offline
- Como en la analogía de "Google Docs para código interactivo", compartir, editar y controlar la propiedad resulta flexible y libre
Resumen de funciones principales
- Manipulación directa: se puede editar la app mientras está en ejecución. Los cambios se reflejan al instante, sin compilar ni recargar
- What you see is what you build: al modificar la UI o editar directamente el código fuente, la app cambia de inmediato, sin capas intermedias
- Portabilidad real: la app puede exportarse como archivo HTML y ejecutarse igual en cualquier lugar (servidor u offline). Cada guardado queda versionado y puede recuperarse
- Todo esto se logra sin tecnología especial, únicamente con un archivo HTML estándar
Estructura técnica
- Hyperclay está compuesto por un servidor NodeJS y una biblioteca JS del lado del cliente
- Cuando la propia página HTML modifica el DOM, envía el
document.body.outerHTML cambiado al servidor, y ese mismo archivo HTML se actualiza
- Los cambios dentro de la app, como el atributo checked de un checkbox, se guardan permanentemente en el código HTML, lo que permite reproducir el mismo estado en la siguiente visita
- Incluye control de versiones y gestión de permisos de lectura/escritura
Ejemplos reales
- Es posible crear y guardar todo tipo de apps en un solo archivo HTML, como blogs editables directamente o listas de verificación de horario laboral
- Con el atributo
contenteditable o con algo como <input type="checkbox" persist>, el estado de la app se registra directamente en el documento
Contexto y problemática
- Tras crear decenas de sitios web cada año, existía la necesidad de que programar webapps fuera tan natural como escribir
- Los sitios web estáticos tradicionales tienen cambios efímeros (las acciones del usuario no se guardan)
- Para implementar persistencia de datos en la web, suele hacer falta demasiado trabajo: base de datos, API, plantillas, sistema de cuentas, etc.
- Esto resulta ineficiente para prototipos, herramientas simples, registros personales de desarrollo, blogs y otros casos donde se quiere crear rápido, editar en tiempo real y compartir
Cómo lo resuelve Hyperclay
- Integra UI, estado y comportamiento en un solo archivo HTML
- Se puede abrir y modificar de inmediato con facilidad, como si se abriera una app de escritorio, y reflejar el resultado online al instante
- Propone el concepto de objetos digitales persistentes (shared, cloneable, persistent)
- Puede aplicarse a creadores de sitios web, herramientas de documentos, diagramas y presentaciones, dashboards, blogs, creación de encuestas y quizzes, visualización de datos y más
Resumen general del concepto
- La mayoría de las webapps ya usan HTML
- Si se eliminan las capas intermedias, el archivo HTML puede asumir el papel de base de datos / API / UI, simplificando el stack a apenas unas cuantas líneas
- Los desarrolladores pueden reducir la complejidad y crear apps con código mínimo que sigan ofreciendo buena usabilidad y mantenimiento
Ejemplos de uso de Hyperclay
- Cualquier app, desde un blog hasta una checklist, puede escribirse, desplegarse, compartirse y editarse con un solo HTML
- Se puede usar directamente con algo como
<div contenteditable>¡Mi blog!</div>, y con <input type="checkbox" persist> cada estado queda registrado de forma permanente en el documento
Conclusión
- Hyperclay propone una nueva forma de crear webapps interactivas livianas y altamente portables, permitiendo que cualquiera las comparta, guarde y recupere en tiempo real sin las complicaciones del desarrollo web
- Es una plataforma de webapps de próxima generación que puede ser usada fácilmente no solo por desarrolladores y diseñadores, sino por cualquier persona
Aún no hay comentarios.