[WEBDEV] TASK-02: Build a Responsive Navbar with Mobile Menu

[ShubhamKumarSahu-svg]

---

📌 What You Will Learn

• How responsive layouts adapt to screen size
• How CSS and JavaScript work together
• Basic DOM manipulation using JavaScript

---

🛠 What You Have To Do

1. Create a navigation bar that includes:

   • Website name or logo
   • 3–4 navigation links

2. For desktop screens:

   • Navigation links should be visible

3. For mobile screens:

   • Hide the navigation links
   • Show a hamburger (☰) icon

4. When the hamburger icon is clicked:

   • Show or hide the navigation menu using JavaScript

---

📁 Where To Work

webdev/contributors/<your_enrollment_number>/task-02/

---

✍️ Mandatory Explanation (explanation.md)

Inside the same folder, create a file named:

explanation.md

In this file, explain in your own words:

1. What this task was trying to teach you
   (Why responsive navbars are important in real websites)

2. How you designed the navbar structure
   (HTML structure and why you chose it)

3. How responsiveness was handled
   (Media queries, breakpoints, desktop vs mobile logic)

4. How JavaScript controls the menu
   (What happens when the hamburger icon is clicked)

5. What you learned from this task
   (New concepts, mistakes, or realizations)

6. What you think is good and what could be improved
   (Code clarity, responsiveness, UX, etc.)

7. Any difficulties or thoughts you had while working

⚠️ This explanation must be written personally by you.
Generic or AI-generated explanations will be rejected.

---

✅ When Is This Task Complete?

• Navbar works correctly on both desktop and mobile
• Hamburger menu toggles properly
• JavaScript logic is simple and readable
• explanation.md is present and meaningful

---

❌ Rules

• ❌ No libraries (React, jQuery, etc.)
• ❌ No inline JavaScript (onclick)
• ❌ No copy-pasted navbar code
• ❌ No copied explanations

---

🧠 Mentor Note (For Contributors)

A responsive navbar is one of the most common real-world UI problems.
Focus on understanding, not complexity.

---