Skip to content

fariya-sultana/garden-hub

Repository files navigation

🌿 GardenHub – Your Green Dreams Delivered

GardenHub is a modern landscaping and gardening web experience built to inspire nature lovers and garden enthusiasts. Designed with care using React and Tailwind CSS, this project helps showcase green services with a flair of creativity and responsiveness.


🔗 Live Website

👉 [https://garden-hub-app.web.app/)


🌱 Project Overview

GardenHub is more than just a gardening service site — it’s a visual journey that connects your eco-friendly lifestyle with smart digital aesthetics. Whether you’re browsing for ideas, seeking inspiration, or looking for professional services, GardenHub is your digital greenhouse.


🚀 Key Features

  • 🌳 Elegant Hero Section with strong call-to-action
  • 🌺 "Why Choose Us" Section with animated feature cards
  • 🧑‍🌾 Skilled Gardeners Showcase with Lottie animation & icons
  • 🪴 Green Tips & Eco-Friendly Practices section
  • 🏆 Responsive Layout across all screen sizes
  • Animated Overlays with smooth hover zoom and reveal effects
  • 👩‍💻 React Icons & Lottie Animations for dynamic UI
  • 📸 Visually Balanced Image Grid with styled borders and curves
  • 🔋 Optimized for Speed & Engagement using modern stack

🛠️ Tech Stack

  • Vite
  • React
  • daisyui
  • swiper
  • Tailwind CSS
  • React Icons
  • sweetalert2
  • Lottie React
  • react-simple-typewriter
  • React Awesome Reveal
  • firebase
  • Netlify (Deployment)

🌟 Unique Touches

  • 🍃 Natural color palette reflecting eco-conscious branding
  • 📱 Fully responsive design with animations that feel alive
  • 🛠️ Clean code architecture for scalability
  • 🎥 Lottie-based interaction for user delight
  • 💬 Friendly tone for copywriting and CTAs

🧪 How to Run Locally

  1. Clone the project:

git clone https://github.com/fariya-sultana/garden-hub.git

  1. Navigate to the project folder:

cd your-repo-name

  1. Install dependencies:

npm install

  1. Create a .env file in the root directory and add your Firebase config:

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

  1. Start the development server:

npm run dev


👤 Author

Fariya Sultana
🔗 GitHub: @fariya-sultana

About

GardenHub is a modern landscaping and gardening web experience built to inspire nature lovers and garden enthusiasts. Designed with care using React and Tailwind CSS, this project helps showcase green services with a flair of creativity and responsiveness.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors