🔗 Live Demo: https://assignment-papaya.web.app/

HobbyHub is a dynamic platform where users can discover, join, and create hobby-based groups. Whether it's art, reading, cooking, or any passion, HobbyHub connects like-minded individuals through an organized and user-friendly interface.

• Hero slider banner
• Six featured groups of the day
• Animated statistics using CountUp
• "Why People Love HobbyHub" testimonial section

• Browse all user-created groups
• Public access without login

• Create new groups with full hobby details
• Firebase pre-fills user name and email

• View all groups created by the logged-in user

• Complete group information
• Join Group functionality:
  • Future start date → shows Join Successful (toast)
  • Expired group → shows Group no longer active

• Toggle between Dark and Light themes
• Built with Tailwind CSS + DaisyUI

🔒 Private routes require login via Firebase Authentication

• React.js
• Tailwind CSS
• DaisyUI

• React Router
• Context API

• Firebase Auth

• MongoDB (via backend API)

• Swiper (sliders)
• SweetAlert2 (alerts)
• React CountUp (animation)
• React Tooltip
• React Spinners
• React Icons
• React Awesome Reveal

• date-fns (date handling)

• Fully responsive and mobile-first
• Clean and reusable components
• Dark/Light mode support
• Real-time group interaction
• Firebase + MongoDB integration
• Full CRUD functionality

Follow these steps to run the project locally:

https://github.com/Hossahin/HobbyHub-Project-Client.git

cd HobbyHub-Project-Client

npm install

Create a .env.local file in the root directory and add the following:

VITE_APIKEY=your_api_key
VITE_AUTHDOMAIN=your_auth_domain
VITE_PROJECTID=your_project_id
VITE_STORAGEBUCKET=your_storage_bucket
VITE_MESSAGINGSENDERID=your_messaging_sender_id
VITE_APPID=your_app_id

npm run dev

Visit the local server:

🌐 http://localhost:5173