Skip to content

Isarok/ToDoList

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

82 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

🌟 My ToDoList

My ToDoList es una aplicación de gestión de tareas centrada en la simplicidad y una experiencia visual mejorada. Con funcionalidades completas para agregar, editar, eliminar, y completar tareas, además de opciones de filtrado y persistencia en localStorage, esta aplicación es ideal para organizar tus actividades diarias.

🚀 Características

CRUD Completo: Permite crear, leer, actualizar y eliminar tareas fácilmente.

  • Tareas Completadas: Marca las tareas como completadas, mostrándolas tachadas para una visualización clara.
  • Filtrado de Prioridades: Filtra las tareas por prioridad: Urgent, Important, Medium, Completed y Uncompleted.
  • Fecha Actual: Muestra la fecha actual para mantener el contexto.
  • Interfaz Atractiva: Un diseño limpio y optimizado que ofrece una experiencia de usuario superior (UX/UI).
  • Responsive Design: Adaptado a dispositivos móviles, tablets y escritorios.
  • Fondo Animado: Añade dinamismo al fondo con la librería Particles.js.

🛠 Tecnologías Utilizadas

  • HTML5 - Estructura de la aplicación.
  • CSS3 - Estilo y diseño, incluyendo diseño responsive.
  • JavaScript (Vanilla) - Lógica de la aplicación, manejo de localStorage, y operaciones CRUD.

📂 Almacenamiento y Persistencia

Web Storage API (localStorage) - Almacenamiento en el navegador para persistencia de datos.

🎨 Librerías Visuales

Particles.js - Animación del fondo para una experiencia visual mejorada y para entreternerte en tus ratos muertos ya que puedes jugar con ellas.

📸 Capturas de Pantalla

Welcome     Login     Funcionalidades     Filtrado    

⚙️ Instalación y Uso

  1. Clona el repositorio en tu máquina local. bash Copiar código git clone https://github.com/tu-usuario/my-todolist.git
  2. Abre el archivo index.html en tu navegador para iniciar la aplicación. (click derecho sobre el index.html y en el menú desplegable busca open with liveserver)
  3. ¡Empieza a organizar tus tareas! Agrega, completa, edita y filtra tareas según tu prioridad preferida.

🔑 Funcionalidades Clave

➕ Añadir y Editar Tareas

  • Permite agregar prioridad a cada tarea.
  • Edita las tareas en cualquier momento.

✅ Completar Tareas

  • Marca las tareas como completadas y se mostrarán tachadas.
  • Filtra para ver solo tareas completadas o pendientes.

🔍 Filtros de Prioridad

  • Urgent: Tareas de alta prioridad.
  • Important: Tareas importantes pero no urgentes.
  • Medium: Tareas de prioridad media.
  • Completed y Uncompleted: Para ver tareas terminadas o pendientes.

💾 Persistencia de Datos

Utiliza localStorage para almacenar de forma persistente las tareas, manteniéndolas incluso después de cerrar o refrescar la página.

🤝 Contribución

  1. Haz un fork del proyecto.
  2. Crea una nueva rama (git checkout -b feature/nueva-funcionalidad).
  3. Realiza tus cambios y haz commit (git commit -m 'Añadir nueva funcionalidad').
  4. Sube tus cambios a tu repositorio (git push origin feature/nueva-funcionalidad).
  5. Abre un Pull Request.

📜 Créditos

  • Particles.js: Particles.js - Una librería para generar fondos animados.
  • FontAwesome: FontAwesome - Para iconos y elementos visuales.
  • Documentación de MDN: MDN Web Docs - Para consultas sobre HTML, CSS y JavaScript.
  • Inspiración y Estilos: Muchas de las ideas y estilos en este proyecto fueron inspirados por ejemplos en CodePen. Aquí hay algunos enlaces específicos que me ayudaron en el diseño.
  • Tutorial - Este tutorial me enseñó a implementar un sistema CRUD básico en mi proyecto.youtube.

📚 Agradecimientos

  • Agradezco a todos los tutoriales en línea a esas personas que comparten sus conocimientos y tiempo, dandonos esa oportunidad de aprendizaje y recursos que ayudan para aplicar tecnologías web en este proyecto.

Releases

No releases published

Packages

 
 
 

Contributors