This is a simple and interactive Item Manager App built with vanilla JavaScript. It allows users to add, edit, d
83F7
elete, filter, and store items in the browser's localStorage
. It’s designed to demonstrate core JavaScript skills such as DOM manipulation, event handling, form validation, and persistent storage — all without any frameworks.
✦ Add Items: Users can add new items to the list via an input form.
✦ Edit Mode: Items can be edited; clicking an item turns the form into edit mode.
✦ Remove Items: Items can be removed individually by clicking the X icon.
✦ Clear All Items: One-click option to remove all items from the list.
✦ Real-time Filtering: Users can search and filter items as they type.
✦ LocalStorage Support: Items persist across sessions using localStorage.
✦ Validation: Prevents adding empty or duplicate items.
✦ Dynamic UI Feedback: UI updates based on the number of items.
✦ HTML5
✦ CSS3
✦ JavaScript
shopping-list-javascript/
├── images/
│ └── shopping-list-icon.png
├── index.html
├── style.css
├── script.js
└── README.md
To get a local copy of this project up and running, follow these simple steps:
- Clone the Repository
git clone https://github.com/rukenerpolat/shopping-list-javaScript.git
- Navigate to the Project Directory
cd shopping-list-javaScript
- Open the Project
open index.html # macOS
start index.html # Windows
💡 No installation or build tools needed — it runs directly in the browser!
Let's collaborate and build something great together. 💻