Notes of my life v1

Proyecto Aplicación web "Notes of my life v1"
Proyecto del 28 de Abril de 2017

Introducción

Esta aplicación de tipo SPA permite crear anotaciones personales con total privacidad y filtrarlas por todo tipo de datos. No se guardan en ninguna base de datos alojada en un servidor. Se almacenan en la memoria del navegador y únicamente puede consultarlas el propietario del dispositivo.

Me propuse este ejercicio para aprender la API localStorage de HTML5, así como para retomar la programación con vanilla JavaScript.

Es la primera versión. En un futuro me gustaría crearla de nuevo con Vue.js y aprovechar para completar algunas opciones básicas que le faltan, como la posibilidad de editar y/o eliminar una nota, así como corregir los bugs que he ido detectando con el tiempo.

Abrir aplicación

Lenguajes y tecnología

  • HTML5 HTML5
  • CSS3 CSS3
  • LESS LESS
  • JavaScript JavaScript

Objetivos y motivaciones

Desarrollé esta aplicación por diversión y por querer disponer de un gestor de anotaciones 100% adaptado a mis necesidades.

La enfoqué como un Producto Mínimo Viable (MVP, del inglés Minimum Viable Product) y la hice lo más rápido posible, porque el objetivo principal era poder pasar las notas que había escrito a mano en diversos papeles que se me estaban acumulando a un lugar que me permitiera centralizarlas y filtrarlas.

Debido a que esa fue la prioridad, hubo algunas opciones básicas que no acabé incluyendo (editar y eliminar notas); un campo que debí haber descartado por falta de utilidad (campo "Alfa") y un aspecto que dejé a medias: ocultar las notas marcadas como "Archivado".

Por todo lo demás considero que logré lo que me propuse y que es una aplicación práctica (hasta cierto punto, óbviamente).

La hice mucho antes de haber aprendido JavaScript ES6 y las diversas opciones de modularización. Así que una de mis motivaciones es repetirla en el futuro aplicando mis nuevos conocimientos. Sin duda el código se verá muy distinto al actual.

Características y funcionalidades

Una de sus características más singulares es el tema de las fechas. Esta aplicación te permite indicar a qué fecha asocias la nota que estás creando, de modo que no estás forzado a vincularla a la actual. Esta última fecha se añade por defecto en una columna aparte como "Fecha inserción". Con lo cual tienes la ventaja de que siempre puedes diferenciar entre cuándo obtuviste la información que anotaste ("Fecha") y cuándo la introduciste ("Fecha inserción").

Además, también se generan columnas de tipo "Fecha AMD" (Año/Mes/Día, porque están en formato americano) por cada una de las dos fechas mencionadas anteriormente. De modo que hace posible filtrar las fechas por año, mes y/o día muy fácilmente escribiendo antes del número la letra del atributo deseado. Por ejemplo, si escribes "A18" obtienes todas las notas del año 2018.

Otra cualidad a destacar es el hecho de poder tener la seguridad de que tus anotaciones son privadas. Considero que ésta es una gran ventaja en tiempos donde prácticamente cualquier app requiere que aceptes permisos de acceso a tu información para poder utilizarla.

Dicho esto, paso a enumerar todas las características y funcionalidades de esta aplicación:

  • Añadir notas.
  • Añadir notas relacionadas con otras anteriores. Basta con copiar la referencia de una nota y pegarla en el campo "Ref:" del formulario. Cuando filtres por la referencia, verás el hilo completo de esa nota.
  • Filtrar los registros por todo tipo de datos: icono, fecha, categoría, descripción, etiquetas, precio, URL...
  • Muestra cuántos registros hay en total y, si se aplica un filtro, cuántos coinciden con la búsqueda.
  • 141 categorías por defecto. Se indica el total de categorías disponibles en el propio input de selección.
  • 53 iconos disponibles.
  • Si añades notas relacionadas con productos e incluyes su precio, siempre verás el coste total de tus compras pendientes. Y si filtras las notas, verás la suma de precios de los registros mostrados.
  • Si en la descripción de la nota añades direcciones web o de email, automáticamente te las convierte en enlaces (siempre se abrirán en nuevas pestañas).
  • Si ocultas el formulario cuando está a medias, el botón de añadir cambia su texto y color para recordarte que no has guardado la nota.
  • Eligir cuántos datos (columnas) quieres ver: sólo los más prácticos; incluir información adicional (referencias y otras fechas); todas las columnas.
  • Botones de desplazamiento a los extremos de la tabla (izquierda, derecha y parte superior).
  • Añadir tantas categorías como necesites. No tiene límite. Te avisa si ya existe una con el mismo nombre.
  • Generar una copia de seguridad que exporta toda la información en un simple fichero. Sólo se tiene que pulsar un botón.
  • Visualizar los datos de forma estructurada fuera de esta aplicación con cualquier intérprete y/o conversor de JSON. Sólo se tiene que copiar la línea de texto que se ofrece como alternativa cuando se realiza la copia de seguridad.
  • Eliminar las notas almacenadas en la memoria del navegador cuando se quiera.
  • Privacidad absoluta. Sólo tú tienes acceso a la información.

Galería de imágenes

Bugs detectados

Uso esta aplicación en mi móvil desde que la creé, y gracias a ello me he ido dando cuenta de que tiene los siguientes fallos:

  • Si dejas una nota a medias y la terminas otro día, la fecha de inserción es la del día que iniciaste la nota, no la de cuando realmente la añades a la tabla de registros.
  • Si escribes una referencia en el campo "Ref:" y dejas la nota a medias, al volver a abrir el formulario desaparece la referencia e inserta la nota con su valor por defecto siguiendo la numeración interna pre-establecida.
  • El campo "URL" también añade el protocolo "http://" cuando la URL empieza por "https://".
  • El formulario para añadir categorías es case sensitive, con lo cual permite añadir "programación" cuando ya existe la categoría "Programación", por ejemplo.

Derechos de autor

Copyright © 2017 - 2019 - 2024. Todos los derechos reservados.

Licencia de Creative Commons
Esta aplicación se publica bajo una licencia de Creative Commons Reconocimiento-NoComercial-CompartirIgual 4.0 Internacional.

Actualización realizada el día 26 de Julio de 2019: originalmente esta aplicación la llamé "Post-its of my life". Debido a que era consciente de que podría estar infringiendo el copyright de la marca comercial "Post-it®" propiedad de 3M Company, me puse en contacto con su Departamento Legal para que me confirmaran si había algún inconveniente con el uso que le estaba dando. Tras recibir su confirmación sobre la imposibilidad de usar su nombre y/o cualquiera de sus variantes para no causar confusión a los/as usuarios/as, declaro que he reemplazado tanto en esta página como en la propia aplicación (en su versión "/live" y en el nuevo descargable "RAR") cualquier referencia a dicha marca comercial.

¿Te gusta lo que estás viendo en mi portafolio?

CONTACTA CONMIGO