📝 To-Do List App
Una aplicación web simple para gestionar tus tareas diarias. Puedes agregar, completar y eliminar tareas fácilmente desde el navegador.
Construida con HTML, Tailwind CSS y JavaScript puro.
- Implementación de modo oscuro
- Gestión de estado local
- Componentes reutilizables
🧠 Funcionalidades
- ✅ Agregar nuevas tareas
- 🟢 Marcar tareas como completadas (en proceso)
- 🗑️ Eliminar tareas
- 💾 Guarda tus tareas en localStorage
- 🎨 Diseño responsivo con Tailwind CSS
- 🌙/☀️ Alternar entre modo oscuro y claro
📸 Capturas de pantalla
Captura de pantalla de escritorio (modo claro ☀️)
Captura de pantalla de Escritorio (modo oscuro 🌙)
Captura de pantalla de Movil (modo claro ☀️)
Captura de pantalla de Movil (modo oscuro 🌙)
🛠️ Tecnologías
- HTML5
- Tailwind CSS
- JavaScript (Vanilla)
- LocalStorage (para guardar las tareas en el navegador)
📝 To-Do List App
Aplicación web para gestionar tareas: agregarlas, marcarlas como hechas y eliminarlas.
Diseñada con buenas prácticas de estructura de archivos, usando Tailwind CSS y JavaScript moderno.
📁 Estructura del proyecto
TO-DO-LIST/
│
├── .vscode/ # Configuración de VSCode
│ └── settings.json
│
├── assets/ # Recursos estáticos (imágenes, íconos, etc.)
│ └── icons/ # Íconos de la app
│ └── favicon.png # Ícono para el navegador (favicon)
│
├── src/ # Código fuente
│ ├── js/ # Scripts organizados
│ │ ├── main.js # Punto de entrada de la app
│ │ ├── task.js # Módulo con funciones relacionadas a tareas
│ │ └── themes.js # Módulo con funciones relacionadas a temas (Dark Mode)
│ └── input.css # Estilos base con Tailwind (directivas @tailwind)
│
├── dist/ # Archivos generados (CSS final)
│ └── output.css
│
├── node_modules/ # Dependencias instaladas (NO subir a Git, se instala con npm)
│
├── index.html # HTML principal
├── tailwind.config.js # Configuración de Tailwind
├── package.json # Dependencias y scripts
├── package-lock.json
└── .gitignore # Archivos ignorados por Git