CRUDS Product Management System is a web-based application designed for an electronic devices company to efficiently manage product inventory. The system allows users to add, update, delete, and search for products, making inventory management seamless and organized.
This project is built using HTML, CSS, and JavaScript, ensuring a user-friendly interface and smooth functionality. The system dynamically updates the product list and enables real-time calculations of product pricing, including taxes, ads, and discounts.
✔ Create Products: Users can add a new product by entering details such as:
- Product Name
- Price, Taxes, Ads, and Discount (Total is auto-calculated)
- Number of Units
- Category (Phone, Laptop, TV, etc.)
✔ Read Products: All added products are displayed in a structured table with an ID and relevant details.
✔ Update Products: Users can modify product details and update them in the list.
✔ Delete Products:
- Delete a single product.
- "Delete All" button to remove all products at once.
✔ Search Functionality:
- Search by product title.
- Search by category (e.g., Phones, Laptops, TVs).
✔ Dynamic Total Calculation:
- The total price updates automatically when price, taxes, ads, or discount values are entered.
✔ Responsive Design:
- Optimized for different screen sizes for better usability.
✔ Local Storage Support:
- All product data is stored in local storage, ensuring persistence even after refreshing the page.
Initial interface
Adding a device
Searching for a device
- HTML → Structuring the web page
- CSS → Styling and layout
- JavaScript → Functional logic for CRUD operations and local storage
- Clone the repository:
git clone https://github.com/Mazenmarwan023/CRUDS-Product-Management-System.git
- Open the
index.htmlfile in your browser.
For any inquiries or suggestions, feel free to reach out:
- Mazen marwan
- 📧 [mazen55moez@gmail.com]
Special thanks to everyone who contributed feedback and support during development. 🚀
This project is open-source and available under the MIT License.