Happy Safar - Travel Agency Website 🌍✈️

Welcome to Happy Safar, a modern and immersive travel agency website designed to inspire your next adventure. Built with React and Vite, this project features a warm, engaging user interface with smooth animations and a responsive design.

View Live Demo

📸 Overview

Happy Safar serves as a digital gateway for travelers, showcasing popular destinations, special offers, and travel tips. The design emphasizes visual storytelling with a focus on warm tones (autumn themes) and user-friendly navigation.

✨ Features

• Dynamic Hero Section: Captivating landing page with immersive visuals to grab user attention immediately.
• Popular Destinations: A showcase of top-rated travel spots with attractive cards and details.
• Special Offers: Highlighted deals and packages for prospective travelers.
• Blog Section: A space for travel stories, tips, and guides.
• About Us: Information about the agency's mission and vision.
• Responsive Navigation: Seamless navigation across all devices (Desktop, Tablet, Mobile).
• Smooth Animations: Integrated AOS (Animate On Scroll) for elegant entry animations.
• Modern UI/UX: clean layout, custom styling, and interactive elements.

🛠️ Tech Stack

• Frontend Framework: React
• Build Tool: Vite
• Styling: Vanilla CSS (Custom responsive designs)
• Routing: React Router DOM
• Icons: React Icons
• Animations: AOS (Animate On Scroll)

🚀 Getting Started

Follow these steps to set up the project locally on your machine.

Prerequisites

Make sure you have Node.js installed on your system.

Installation

1. Clone the repository

   git clone https://github.com/KamalElmaddini/happy-safar.git
   cd happy-safar

2. Install dependencies

   npm install

3. Run the development server

   npm run dev

4. Open in Browser Visit http://localhost:5173 (or the URL shown in your terminal) to view the app.

📂 Project Structure

happy-safar/
├── src/
│   ├── assets/          # Images and static assets
│   ├── components/      # Reusable UI components (Navbar, Hero, etc.)
│   ├── App.jsx          # Main application component
│   ├── main.jsx         # Entry point
│   ├── index.css        # Global styles
│   └── ...
├── public/              # Static public files
├── package.json         # Project dependencies and scripts
├── vite.config.js       # Vite configuration
└── README.md            # Project documentation

🤝 Contributing

Contributions are welcome! If you have suggestions for improvements, feel free to open an issue or submit a pull request.

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

📄 License

This project is open-source and available under the MIT License.

---

© 2025 Kamal Elmaddini. All Rights Reserved.