📝 JavaScript Todo App ✅

Welcome to JavaScript Todo App — a sleek, interactive task management application that demonstrates the power of JavaScript's localStorage and DOM manipulation! This project was built as part of the JavaScript Algorithms and Data Structures curriculum on freeCodeCamp, showcasing dynamic data handling and real-time UI updates.

---

🎓 Certification

Course: JavaScript Algorithms and Data Structures

Complete Your Certificate:

• ✅ This project (Todo App) fulfills one requirement

Full Project Suite: 25+ hands-on projects from Pyramid Generator to Final Certification Projects

• 🎓 Complete all projects to earn your certification

This repository contains the complete portfolio of projects needed to demonstrate JavaScript proficiency and earn the freeCodeCamp certificate.

---

📸 Application Preview

Live Demo: https://acheronx0577.github.io/JavaScript-Building-a-ToDo-App

---

🎮 How to Use

Adding Tasks:

• Click "Add New Task" to open the task form
• Fill in title (required), date, and description
• Click "Add Task" to save your task
• Tasks automatically save to localStorage

Managing Tasks:

• Edit: Click the "Edit" button on any task to modify its details
• Delete: Click the "Delete" button to remove tasks permanently
• Persistent Storage: All tasks survive browser refreshes and restarts

Form Features:

• Real-time Validation: Required field checking
• Special Character Handling: Automatic sanitization of input data
• Responsive Design: Works perfectly on desktop and mobile

---

🧰 Installation & Usage

1️⃣ Clone this repo

git clone git@github.com:acheronx0577/JavaScript-Building-a-ToDo-App.git

2️⃣ Open the project folder

cd JavaScript-Building-a-ToDo-App

3️⃣ Run the file

Just open index.html in your favorite browser 🌐 and start playing!

---

🎯 Key JavaScript Concepts

• localStorage.setItem() and localStorage.getItem() for data persistence
• JSON.stringify() and JSON.parse() for data serialization
• findIndex() for locating tasks in arrays
• addEventListener() for user interactions
• classList manipulation for CSS animations
• Template literals for dynamic HTML generation
• Arrow functions and modern syntax
• Array methods (push, splice, forEach)

---

🎨 Color Scheme

• Primary: Purple Gradient (#667eea to #764ba2)
• Secondary: Blue (#4299e1)
• Success: Green (#48bb78)
• Warning: Orange (#ed8936)
• Danger: Red (#f56565)
• Background: White with subtle shadows

---

🤝 Contributing

Want to enhance this date formatter?

• Fork the repo 🍴
• Add new features (timezone support, calendar view, date calculations, etc.) ✍️
• Submit a Pull Request ✅

---

📜 License

This project is open-source under the MIT License.

---

⭐ If you find this date formatter useful, don't forget to give it a star! ⭐