📇 Contact Manager (JavaScript DOM Project)

An interactive contact management application built using Vanilla JavaScript and DOM manipulation.

🚀 Features

• Add new contacts
• View all contacts
• Delete existing contacts
• Search contacts by name (case-insensitive + partial match)
• Show all contacts after filtering
• Input validation for user data
• Data persistence using LocalStorage

---

🖥️ Tech Used

• HTML
• JavaScript (Vanilla JS)
• Browser LocalStorage

---

💡 How It Works

• Users can add and manage contacts through form inputs
• Contacts are stored in an array of objects
• The UI updates dynamically using DOM manipulation
• Data is saved in LocalStorage, so it remains after page reload

---

📌 Project Purpose

This project was built as part of my learning journey to:

• Practice JavaScript fundamentals
• Understand DOM manipulation
• Practice CRUD operations
• Learn how to manage application state
• Improve problem-solving skills
• Build a real user-facing application

---

🧠 Skills Practiced

• JavaScript fundamentals
• DOM manipulation
• Event handling
• Arrays and objects manipulation
• CRUD operations (Create, Read, Delete)
• Input validation with reusable functions
• Error handling using try-catch
• LocalStorage and JSON for data persistence
• Problem-solving and logic building
• Basic Git & GitHub workflow (branching, commits, pull requests)

---

🔮 Future Improvements

• Improve UI with CSS (responsive design)
• Add edit/update contact functionality
• Refactor code using higher-order functions (map, filter, find)

---

📷 Preview

Simple and clean UI with form inputs and a dynamic contact list.

---

👩‍💻 Author

Iqra Amin Aspiring Frontend Developer

---

🔗 Live / Repository

GitHub Repo: https://github.com/iqraamin054-code/contact-manager-js