Cruadapp

🛒 CRUproductPriceD System A simple, user-friendly web application for managing product data (Create, Read, Update, Delete) — built using HTML, CSS, Bootstrap, and JavaScript, with persistent storage using the browser's LocalStorage.

🚀 Project Description The CRUproductPriceD System is a lightweight inventory-like app that allows users to manage product information with ease. Whether you're a developer learning about local storage or someone looking for a basic tool to manage product data, this app provides an interactive and responsive UI.

Users can:

Add product details (name, category, price, description)

View all entered products in a table

Update existing products

Delete products

Search for products by name

Save data locally with localStorage for persistence across sessions

💡 Key Features ✅ Add Products: Enter product information and store it locally.

🔁 Update Products: Edit and update saved product details.

❌ Delete Products: Remove individual items from the list.

🔍 Search Products: Live search by product name with highlighting.

🧠 LocalStorage: Ensures data persistence across browser sessions.

📱 Responsive Design: Styled with Bootstrap to work on various screen sizes.

🛠️ Technologies Used HTML5 — Structure of the app

CSS3 — Basic styling

Bootstrap 5 — For responsive design and layout

JavaScript (Vanilla) — DOM manipulation, event handling, and data storage

LocalStorage — Data persistence without a backend

ScreenShots

--

📂 File Structure graphql Copy Edit project-folder/ │ ├── index.html # Main HTML file ├── css/ │ └── bootstrap.min.css # Bootstrap styles │ └── test.css # Custom styles ├── js/ │ └── bootstrap.bundle.js # Bootstrap JS bundle │ └── myScript.js # JavaScript logic for CRUD operations └── README.md # Project documentation

👤 Author ahmed Khaled

📄 License This project is open-source and available under the MIDOKHALED License.