---

📚 BookNest – Book Management Web App

BookNest is a simple and interactive web application that allows users to add, view, and delete books with ease. It is built using HTML, CSS, and JavaScript, making it a beginner-friendly project for learning DOM manipulation and UI design.

---

🚀 Features

• ➕ Add new books with title, author, and description
• 🗑️ Delete books dynamically
• 📦 Popup form for adding books
• 🎨 Clean and responsive UI design
• ⚡ Real-time DOM updates without page reload

---

🛠️ Technologies Used

• HTML5
• CSS3
• JavaScript (Vanilla JS)

---

📂 Project Structure

BookNest/
│── index.html      # Main HTML structure
│── style.css       # Styling and layout
│── script.js       # Functionality and DOM manipulation

---

📸 How It Works

1. Homepage Layout

• Displays book cards with title, author, and description
• Includes a delete button for each book
• Preloaded sample book available

2. Add Book Feature

• Click the ➕ button to open a popup form
• Enter details and click "ADD" to insert a new book dynamically
• Implemented using DOM manipulation

3. Delete Book Feature

• Click "Delete" button to remove a book instantly
• Uses event handling to remove parent element

4. Styling

• Modern card layout with flexbox
• Popup overlay for better UX
• Floating add button design

---

▶️ How to Run the Project

1. Download or clone the repository

   git clone https://github.com/your-username/booknest.git
   

2. Open the project folder

3. Double-click on index.html or open it in a browser

---

💡 Learning Outcomes

• DOM manipulation using JavaScript
• Event handling (click, submit)
• Dynamic element creation
• UI design with CSS (Flexbox & positioning)

---

🔮 Future Improvements

• ✏️ Edit book feature
• 💾 Store data using Local Storage
• 🔍 Search functionality
• 📱 Fully responsive mobile design

---

🙌 Acknowledgement

This project is created as a practice project for web development beginners to understand core frontend concepts.

---