CRUDs with Vanilla JavaScript

A simple CRUD (Create, Read, Update, Delete) application built using Vanilla JavaScript without any frameworks or external libraries.

This project demonstrates how to implement basic data management functionality using only native browser APIs and JavaScript fundamentals.

---

🚀 Features

• Create new records
• Display stored records
• Update existing records
• Delete records
• Clean and simple user interface
• Built using pure JavaScript (no frameworks)

---

🛠 Technologies Used

• HTML5
• CSS3
• JavaScript (ES6)
• Browser Local Storage

This project focuses on using Vanilla JavaScript, meaning everything is implemented using native JavaScript features without frameworks such as React, Vue, or Angular.

---

📁 Project Structure

cruds-vanilla-js

index.html
style.css
script.js
README.md

---

⚙️ How It Works

The application performs CRUD operations directly in the browser.

Create

Users can add new records through the form interface.

Read

All records are displayed dynamically in the UI.

Update

Existing records can be edited and saved again.

Delete

Records can be removed from the list.

The application uses DOM manipulation and Local Storage to store and manage the data.

---

💻 Getting Started

1. Clone the repository

git clone https://github.com/mohammadsobhy/cruds-vanilla-js.git

2. Navigate to the project folder

cd cruds-vanilla-js

3. Open the project

Simply open the following file in your browser:

index.html

No build tools, frameworks, or installations are required.

---

🎯 Purpose of the Project

This project was created to:

• Practice JavaScript fundamentals
• Understand how CRUD operations work behind the scenes
• Learn DOM manipulation
• Build applications without relying on frameworks
• Strengthen core JavaScript knowledge

---

📚 What You Can Learn From This Project

• Handling form inputs with JavaScript
• Managing application state
• Updating the DOM dynamically
• Working with browser storage
• Structuring small frontend projects

---

👨‍💻 Author

Mohamed Sobhy

GitHub:
https://github.com/mohammadsobhy

---

⭐ Support

If you found this project helpful, consider giving it a star ⭐ on GitHub.