Visión general
KallosMD es un editor web de Markdown diseñado para ofrecer un entorno de escritura y lectura claro, con una interfaz que busca reducir las distracciones. Está pensado para personas que trabajan con documentación, apuntes y textos técnicos.
El problema
Al escribir documentación técnica es útil disponer de un editor que permita concentrarse en el contenido, consultar su representación visual y conservar los documentos bajo control del usuario.
La solución
Desarrollé una aplicación web que integra edición Markdown, una experiencia de lectura cuidada y almacenamiento local de documentos mediante IndexedDB.
Funcionalidades destacadas
- Edición de Markdown con CodeMirror 6.
- Vista de lectura del contenido Markdown.
- Almacenamiento de documentos en el navegador mediante IndexedDB.
- Interfaz orientada a la concentración y la legibilidad.
Capturas del proyecto
Tres vistas del espacio de trabajo: lectura, edición Markdown y edición con previsualización.
Vista general de KallosMD
Editor Markdown
Vista dividida
Detalle técnico
Tecnologías utilizadas
- Svelte 5: componentes e interfaz reactiva.
- TypeScript: tipado de los módulos y contratos internos.
- Vite: herramientas de desarrollo y compilación.
- CodeMirror 6: experiencia de edición de texto.
- IndexedDB: almacenamiento local persistente en el navegador.
Enfoque de arquitectura
El código se organiza por funcionalidades (feature-first) en tres áreas: core, features y shared. El almacenamiento se comunica mediante un contrato StorageAdapter, implementado por un adaptador IndexedDB. El objetivo es aislar las funcionalidades del editor y evitar dependencias innecesarias entre módulos.
Decisiones técnicas
- Mantener los documentos localmente, evitando exigir una cuenta o servidor para persistirlos.
- Separar la lógica de las funcionalidades de su presentación visual.
- Utilizar herramientas especializadas como CodeMirror para resolver la edición en lugar de desarrollar un editor de texto desde cero.
Aprendizajes
Este proyecto me permitió profundizar en Svelte 5, TypeScript y el diseño de interfaces centradas en contenido, además de practicar una arquitectura modular y mantenible.
Enlaces
Evidencia y límites
El código es público bajo AGPL-3.0. Las tecnologías y el puerto de almacenamiento de este caso se contrastaron con el código revisado, en particular package.json, StorageAdapter y su adaptador IndexedDB.
Las capturas muestran las vistas de lectura, editor y vista dividida aportadas para este portafolio. No presento cifras de usuarios ni mediciones de rendimiento: el resultado demostrable es la aplicación publicada y su implementación abierta. La persistencia local pertenece al navegador y no sustituye una copia de seguridad de los documentos.