🌍 Trippy - Travel & Tourism Website

A modern, responsive React-based travel and tourism website that showcases popular destinations and travel experiences. Built with React Router for seamless navigation and featuring beautiful destination galleries and trip showcases.

✨ Features

• Home Page: Hero section with call-to-action and featured destinations

• Popular Destinations: Showcase of beautiful locations with detailed descriptions

• Recent Trips: Gallery of travel experiences from around the world

• About Page: Information about the travel company

• Contact Page: Contact form for inquiries

• Responsive Design: Mobile-friendly interface

• Modern UI: Clean and attractive design with CSS styling

Tech Stack

• Frontend: React 19.1.1
• Routing: React Router DOM 7.9.4
• Build Tool: Vite 7.1.7
• Styling: CSS3
• Deployment: GitHub Pages

📁 Project Structure

src/
├── components/          # Reusable UI components
│   ├── Hero.jsx        # Hero section component
│   ├── Navbar.jsx      # Navigation bar
│   ├── Destination.jsx # Destination showcase
│   ├── Trip.jsx        # Trip gallery
│   ├── AboutUs.jsx     # About section
│   ├── ContactForm.jsx # Contact form
│   └── Footer.jsx      # Footer component
├── routes/             # Page components
│   ├── Home.jsx        # Home page
│   ├── About.jsx       # About page
│   ├── Service.jsx     # Services page
│   └── Contact.jsx     # Contact page
├── assets/             # Images and media
└── App.jsx             # Main app component

🌟 Key Components

Hero Section

• Dynamic hero images
• Customizable titles and descriptions
• Call-to-action buttons

Destination Showcase

• Featured destinations with descriptions
• High-quality images
• Detailed information about locations

Trip Gallery

• Recent travel experiences
• Country-specific information
• Visual trip highlights

🎨 Styling

The project uses modular CSS files for each component:

• HeroStyles.css - Hero section styling
• DestinationStyles.css - Destination showcase styling
• TripStyles.css - Trip gallery styling
• Navbar.css - Navigation styling
• FooterStyles.css - Footer styling

Live Demo

Visit the live website: Trippy Travel Website