feat:Update navigatio/Header Section design

📌 What does this MR do and why?

This MR implements a React + TypeScript web application with a modular component structure, multiple pages, and dynamic data handling. It improves scalability, maintainability, and overall UI experience.

---

🚀 Key Features

• Reusable components (Navbar, Hero, ProjectCard, etc.)
• Multi-page routing (Home, About, Projects, Events)
• Tailwind CSS for responsive UI
• API/JSON-based dynamic data
• Test coverage using Vitest
• ESLint & Prettier configuration

---

❓ Why this change?

• Improves code structure and reusability

• Enhances UI/UX

• Replaces static data with dynamic content

• Ensures code quality with testing and linting

• 

  

---

✅ Checklist

• ✔ Modular and clean code

• ✔ No hardcoded values

• ✔ UI working properly

• ✔ Tests added and passing

• ✔ Responsive design implemented

  Related Issue

• #60 (closed)