This is a simple web-based Comment and Reply System built using Vanilla JavaScript, HTML, and CSS. It allows users to post a comment and reply to existing comments in a nested, interactive format.
📁 Project Structure
📦 comment-reply-system
├── comment.html // Main HTML structure
├── comment.css // Styling for form, buttons, and layout
└── comment.js // Logic to handle comments and nested replies
🚀 Features
- 💬 Post a new comment
- ↩️ Reply to any comment (unlimited nesting)
- ✨ Smooth UI interactions using CSS transitions
- 📱 Responsive and minimalist design
🛠️ Technologies Used
- HTML5 — Markup
- CSS3 — Styling and layout
- JavaScript (ES6) — DOM manipulation & interactivity
🧠 How It Works
- Users type in the textarea and click “comment” to add a top-level comment.
- Each comment includes a hidden reply input and a “reply” button.
- Hovering over a comment reveals its reply section.
- Replies can be nested infinitely by replying to replies.
- Each reply follows the same interaction pattern, enabling threaded discussions.
📸 Screenshots
https://github.com/user-attachments/assets/5de82b78-529a-4add-9d1c-324e4c6eef75
🧪 How to Run
- Clone or download this repository.
- Open the comment.html file in a browser.
- Start commenting and replying interactively.
📌 Notes
- No backend: All data is stored in memory and lost on page refresh.
- No framework: Pure HTML/CSS/JS without libraries or frameworks.