MothNote, extensión de nueva pestaña de Google Chrome con dashboard todo en uno que suma widgets de reloj, clima y calendario a un sistema de notas basado en carpetas

lunamoth · 2025-09-01T16:42:57+09:00

🦋 MothNote Captura de pantalla de la página detallada de notas de MothNote Captura de pantalla de la página detallada del clima de MothNote Post de presentación de MothNote en el blog lunamoth 4th MothNote GitHub (Parece que GeekNews no soporta mostrar imágenes, así que las dejo como enlaces.) MohtNote es una extensión de nueva pestaña de Google Chrome con un dashboard todo en uno que agrega widgets de reloj, clima y calendario a un sistema de notas basado en carpetas. Proceso de desarrollo Con MothNote puedes escribir notas rápidamente directamente desde la nueva pestaña de Google Chrome, y también ver de inmediato reloj/calendario/clima/temperatura. Después de crear la extensión LunaTools, que incluye 15 funciones, se me ocurrió de repente que estaría bien intentar hacer una extensión de nueva pestaña, y así empecé a desarrollarla. No soy desarrollador y tampoco sé programar en absoluto, pero empecé a crearla el 25 de julio de 2025 usando Google AI Studio (web) con Google Gemini 2.5 Pro, y tras unos 38 días de desarrollo terminé lanzándola el 1 de septiembre de 2025. El código, excluyendo bibliotecas externas, tiene 7,385 líneas. Como me pareció que sería cómodo poder escribir notas directamente en la nueva pestaña, que es la pantalla que más se ve, primero empecé creando una app de notas con una estructura de 3 columnas como la que suele verse en muchas herramientas de gestión de proyectos. Añadí soporte para los temas Solarized Light/Dark y, tomando ideas de la extensión Tabliss, incorporé reloj digital, reloj analógico, clima y temperatura; además, para usarla también como diario, agregué un calendario. También añadí modo de enfoque y modo zen, funciones que suelen implementarse en muchas apps de escritura. Incluí configuración de diseño, ajuste de tipografía del editor, configuración de ciudad para el clima y funciones de respaldo/restauración de datos. En el camino también llegué a implementar sincronización entre múltiples pestañas, pero entendí lo que significa el over-engineering y terminé haciendo rollback. Recuerdo también haber conocido el término “trabajo atómico” mientras lo iba implementando. Pensé que también estaría bien integrar la página detallada del clima que había creado antes, así que la incluí. No pensaba dar soporte a Markdown, pero aprendí a usar bibliotecas externas y terminé añadiendo un modo de vista Markdown. (Primero usé Snakdown y luego cambié a Marked). Como carpetas predeterminadas probé incluir PARA y también las carpetas recomendadas por Bullet Journal. Creo que también podría usarse al estilo de Todo.txt. Antes usaba Simplenote, así que pensé que la migración de datos también sería posible, y añadí una función para migrar datos desde archivos de respaldo JSON de Simplenote. Hace unos días también descubrí el permiso unlimitedStorage, que permite usar almacenamiento sin el límite de 10 MB de local storage, y lo apliqué. Entre las ideas que surgieron durante el desarrollo estaban etiquetas, carpetas multinivel, editor WYSIWYG, enlaces tipo wiki, casillas de tareas, recorte de contenido con Readability.js e integración con Google Drive, entre otras. Más adelante pienso actualizarla enfocándome en funciones realmente significativas. Pasé bastante tiempo en el proceso de corregir errores y ahora siento que quedó bastante usable, así que decidí lanzarla. Creo que les puede resultar bastante útil. Si la prueban, agradecería sugerencias de mejora y reportes de bugs. (Les agradecería mucho si me responden por Bluesky, Twitter o Threads). Funciones principales (La descripción de funciones a continuación fue redactada por Gemini 2.5 Pro tras analizar el código fuente de MothNote). Dashboard todo en uno: revisa toda la información que necesitas de un vistazo en la nueva pestaña. Reloj: ofrece un reloj analógico de diseño elegante y un reloj digital de alta legibilidad. Información detallada del clima: conviértete en experto del clima con un solo clic en el widget del dashboard. Pronóstico semanal: en una página dedicada puedes ver de un vistazo los cambios de temperatura máxima y mínima de la semana junto con gráficos visuales, además de hermosos efectos de fondo de lluvia o nieve según el clima actual. Información detallada por hora: al hacer clic en la tarjeta de pronóstico de una fecha específica, se muestra una lista detallada y gráficos con temperatura por hora, cambios del clima y probabilidad de precipitación para ese día. Configuración de ubicación: además de buscar por nombre de ciudad, puedes ingresar directamente latitud y longitud para configurar el clima de cualquier lugar del mundo. Calendario integrado con notas: las fechas con notas aparecen subrayadas y, al pasar el mouse sobre una fecha puedes previsualizar el título de la nota; al hacer clic, puedes reunir al instante todas las notas de ese día. Sistema de notas potente: organiza tus ideas de forma estructurada con base en carpetas y gestiona tus notas eficientemente mediante una interfaz de paneles de 3 columnas. Soporte para Markdown: escribe notas con formato usando sintaxis simple como #, *, **, y cambia con un solo clic a una vista previa renderizada de forma limpia. Editor orientado a la productividad: en la parte inferior del editor puedes ver en tiempo real información detallada como cantidad de caracteres/palabras/líneas y fecha de creación/modificación, y usar la tecla Tab para indentar/quitar indentación. Guardado automático y guardado manual: lo que escribes se guarda automáticamente cuando dejas de tipear, y también puedes guardar manualmente al instante con el atajo Ctrl+S (Mac: Cmd+S). Funciones de conveniencia: si dejas el título vacío, la primera línea del contenido se convierte automáticamente en el título. Alta libertad de uso y comodidad: admite varias funciones para maximizar la productividad. Configuración del usuario: cambia la apariencia de la app según tus preferencias, incluyendo tema claro/oscuro, tipografía/tamaño del editor, y también puedes restablecer toda la configuración. UI dinámica: además del menú de configuración, puedes ajustar intuitivamente con arrastrar con el mouse el ancho de los paneles y del modo zen. Gestión avanzada de notas: ofrece búsqueda de notas (incluyendo resaltado del término buscado), ordenamiento, fijar notas importantes y favoritos. Movimiento intuitivo: puedes cambiar el orden de las carpetas o mover notas fácilmente a otras carpetas con drag and drop. (También puedes eliminar/agregar directamente una nota arrastrándola a la carpeta de papelera/favoritos) Modo zen para concentración (Zen Mode): ofrece un entorno donde se ocultan todos los elementos alrededor para que puedas concentrarte únicamente en escribir notas. Papelera y restauración: los elementos eliminados van a la papelera y, al restaurarlos, detecta y resuelve automáticamente conflictos de nombres, para una restauración segura. Respaldo y restauración de datos: puedes respaldar y restaurar todos los datos de forma segura en un solo archivo JSON. Admite importar archivos de respaldo de Simplenote (JSON) y los agrega de forma segura a una carpeta nueva sin alterar los datos existentes. Atajos de teclado: permite ejecutar rápidamente solo con el teclado varias acciones como crear carpetas/notas nuevas, renombrar y navegar por listas. Estabilidad y confiabilidad de los datos: protege de forma segura los valiosos datos del usuario. Los datos se guardan en el almacenamiento local del navegador web. Advertencia para evitar pérdida: si intentas cerrar la página con cambios sin guardar, muestra una alerta para evitar pérdida de datos. Función de recuperación de emergencia: si el navegador se cierra de forma anormal, hace un respaldo temporal del último cambio no guardado y en la siguiente ejecución pregunta si deseas restaurarlo. Verificación automática de datos: al iniciar la app revisa la integridad de los datos y, si detecta problemas, los corrige automáticamente para mantener la estabilidad. Cómo instalar En la página de GitHub, descarga el archivo de la versión más reciente desde la sección Releases y descomprímelo. En la barra de direcciones de Chrome, escribe chrome://extensions para ir a la página de administración y activa el modo desarrollador. Haz clic en el botón para cargar una extensión descomprimida y selecciona la carpeta descomprimida en el paso 1 para completar la instalación. También puedes arrastrar y soltar la carpeta en la página de administración de extensiones. (Como referencia, esa carpeta no debe eliminarse). Historial de actualizaciones 2025-09-01 4:15 p. m. // lanzamiento 17.58, primer lanzamiento

(github.com/lunamoth)

5 puntos por lunamoth 2025-09-01 | 3 comentarios | Compartir por WhatsApp

🦋 MothNote

(Parece que GeekNews no soporta mostrar imágenes, así que las dejo como enlaces.)

MohtNote es una extensión de nueva pestaña de Google Chrome con un dashboard todo en uno que agrega widgets de reloj, clima y calendario a un sistema de notas basado en carpetas.

Proceso de desarrollo

Con MothNote puedes escribir notas rápidamente directamente desde la nueva pestaña de Google Chrome, y también ver de inmediato reloj/calendario/clima/temperatura. Después de crear la extensión LunaTools, que incluye 15 funciones, se me ocurrió de repente que estaría bien intentar hacer una extensión de nueva pestaña, y así empecé a desarrollarla.

No soy desarrollador y tampoco sé programar en absoluto, pero empecé a crearla el 25 de julio de 2025 usando Google AI Studio (web) con Google Gemini 2.5 Pro, y tras unos 38 días de desarrollo terminé lanzándola el 1 de septiembre de 2025. El código, excluyendo bibliotecas externas, tiene 7,385 líneas.

Como me pareció que sería cómodo poder escribir notas directamente en la nueva pestaña, que es la pantalla que más se ve, primero empecé creando una app de notas con una estructura de 3 columnas como la que suele verse en muchas herramientas de gestión de proyectos. Añadí soporte para los temas Solarized Light/Dark y, tomando ideas de la extensión Tabliss, incorporé reloj digital, reloj analógico, clima y temperatura; además, para usarla también como diario, agregué un calendario.

También añadí modo de enfoque y modo zen, funciones que suelen implementarse en muchas apps de escritura. Incluí configuración de diseño, ajuste de tipografía del editor, configuración de ciudad para el clima y funciones de respaldo/restauración de datos.

En el camino también llegué a implementar sincronización entre múltiples pestañas, pero entendí lo que significa el over-engineering y terminé haciendo rollback. Recuerdo también haber conocido el término “trabajo atómico” mientras lo iba implementando.

Pensé que también estaría bien integrar la página detallada del clima que había creado antes, así que la incluí. No pensaba dar soporte a Markdown, pero aprendí a usar bibliotecas externas y terminé añadiendo un modo de vista Markdown. (Primero usé Snakdown y luego cambié a Marked).

Como carpetas predeterminadas probé incluir PARA y también las carpetas recomendadas por Bullet Journal. Creo que también podría usarse al estilo de Todo.txt.

Antes usaba Simplenote, así que pensé que la migración de datos también sería posible, y añadí una función para migrar datos desde archivos de respaldo JSON de Simplenote. Hace unos días también descubrí el permiso unlimitedStorage, que permite usar almacenamiento sin el límite de 10 MB de local storage, y lo apliqué.

Entre las ideas que surgieron durante el desarrollo estaban etiquetas, carpetas multinivel, editor WYSIWYG, enlaces tipo wiki, casillas de tareas, recorte de contenido con Readability.js e integración con Google Drive, entre otras. Más adelante pienso actualizarla enfocándome en funciones realmente significativas.

Pasé bastante tiempo en el proceso de corregir errores y ahora siento que quedó bastante usable, así que decidí lanzarla. Creo que les puede resultar bastante útil. Si la prueban, agradecería sugerencias de mejora y reportes de bugs. (Les agradecería mucho si me responden por Bluesky, Twitter o Threads).

Funciones principales

(La descripción de funciones a continuación fue redactada por Gemini 2.5 Pro tras analizar el código fuente de MothNote).

Dashboard todo en uno: revisa toda la información que necesitas de un vistazo en la nueva pestaña.
- Reloj: ofrece un reloj analógico de diseño elegante y un reloj digital de alta legibilidad.
- Información detallada del clima: conviértete en experto del clima con un solo clic en el widget del dashboard.
  - Pronóstico semanal: en una página dedicada puedes ver de un vistazo los cambios de temperatura máxima y mínima de la semana junto con gráficos visuales, además de hermosos efectos de fondo de lluvia o nieve según el clima actual.
  - Información detallada por hora: al hacer clic en la tarjeta de pronóstico de una fecha específica, se muestra una lista detallada y gráficos con temperatura por hora, cambios del clima y probabilidad de precipitación para ese día.
  - Configuración de ubicación: además de buscar por nombre de ciudad, puedes ingresar directamente latitud y longitud para configurar el clima de cualquier lugar del mundo.
- Calendario integrado con notas: las fechas con notas aparecen subrayadas y, al pasar el mouse sobre una fecha puedes previsualizar el título de la nota; al hacer clic, puedes reunir al instante todas las notas de ese día.
Sistema de notas potente: organiza tus ideas de forma estructurada con base en carpetas y gestiona tus notas eficientemente mediante una interfaz de paneles de 3 columnas.
- Soporte para Markdown: escribe notas con formato usando sintaxis simple como #, *, **, y cambia con un solo clic a una vista previa renderizada de forma limpia.
- Editor orientado a la productividad: en la parte inferior del editor puedes ver en tiempo real información detallada como cantidad de caracteres/palabras/líneas y fecha de creación/modificación, y usar la tecla Tab para indentar/quitar indentación.
- Guardado automático y guardado manual: lo que escribes se guarda automáticamente cuando dejas de tipear, y también puedes guardar manualmente al instante con el atajo Ctrl+S (Mac: Cmd+S).
- Funciones de conveniencia: si dejas el título vacío, la primera línea del contenido se convierte automáticamente en el título.
Alta libertad de uso y comodidad: admite varias funciones para maximizar la productividad.
- Configuración del usuario: cambia la apariencia de la app según tus preferencias, incluyendo tema claro/oscuro, tipografía/tamaño del editor, y también puedes restablecer toda la configuración.
- UI dinámica: además del menú de configuración, puedes ajustar intuitivamente con arrastrar con el mouse el ancho de los paneles y del modo zen.
- Gestión avanzada de notas: ofrece búsqueda de notas (incluyendo resaltado del término buscado), ordenamiento, fijar notas importantes y favoritos.
- Movimiento intuitivo: puedes cambiar el orden de las carpetas o mover notas fácilmente a otras carpetas con drag and drop. (También puedes eliminar/agregar directamente una nota arrastrándola a la carpeta de papelera/favoritos)
- Modo zen para concentración (Zen Mode): ofrece un entorno donde se ocultan todos los elementos alrededor para que puedas concentrarte únicamente en escribir notas.
- Papelera y restauración: los elementos eliminados van a la papelera y, al restaurarlos, detecta y resuelve automáticamente conflictos de nombres, para una restauración segura.
- Respaldo y restauración de datos: puedes respaldar y restaurar todos los datos de forma segura en un solo archivo JSON. Admite importar archivos de respaldo de Simplenote (JSON) y los agrega de forma segura a una carpeta nueva sin alterar los datos existentes.
- Atajos de teclado: permite ejecutar rápidamente solo con el teclado varias acciones como crear carpetas/notas nuevas, renombrar y navegar por listas.
Estabilidad y confiabilidad de los datos: protege de forma segura los valiosos datos del usuario.
- Los datos se guardan en el almacenamiento local del navegador web.
- Advertencia para evitar pérdida: si intentas cerrar la página con cambios sin guardar, muestra una alerta para evitar pérdida de datos.
- Función de recuperación de emergencia: si el navegador se cierra de forma anormal, hace un respaldo temporal del último cambio no guardado y en la siguiente ejecución pregunta si deseas restaurarlo.
- Verificación automática de datos: al iniciar la app revisa la integridad de los datos y, si detecta problemas, los corrige automáticamente para mantener la estabilidad.

Cómo instalar

En la página de GitHub, descarga el archivo de la versión más reciente desde la sección Releases y descomprímelo.
En la barra de direcciones de Chrome, escribe chrome://extensions para ir a la página de administración y activa el modo desarrollador.
Haz clic en el botón para cargar una extensión descomprimida y selecciona la carpeta descomprimida en el paso 1 para completar la instalación. También puedes arrastrar y soltar la carpeta en la página de administración de extensiones. (Como referencia, esa carpeta no debe eliminarse).

Historial de actualizaciones

2025-09-01 4:15 p. m. // lanzamiento 17.58, primer lanzamiento

3 comentarios

lunamoth 2025-09-01

Ah, había un error tipográfico en la URL del enlace de la primera captura de pantalla;

https://raw.githubusercontent.com/lunamoth/MothNote/…

Es esta.

xguru 2025-09-01

Lo he corregido.