🌍 World Tour

World Tour is a client-side tour & travel booking web app where users can explore popular tourist spots, view details, and book a trip. Registered users can also add new tour spots and manage the tour-spot listings, with authentication handled via Firebase (Email/Password & Google).

🔗 Live Site: https://world-tour-web.web.app/

---

📸 Screenshots

---

🛠️ Built With

• React 17 — Frontend library
• React Router DOM (v5) — Client-side routing & Private Routes
• Firebase Authentication — Email/Password & Google Sign-In
• Context API — Global authentication state management
• React Bootstrap & Bootstrap 5 — Responsive UI layout
• React Hook Form — Form validation for booking & adding services
• Axios / Fetch API — HTTP requests to the backend
• Node.js / Express + MongoDB (Heroku-hosted API) — Backend data source
• Firebase Hosting — Deployment

---

✨ Key Features

• 🔐 Authentication — Register/Login with Email & Password or Google via Firebase
• 🛡️ Protected Routing — Booking, Add Service, and Manage Services pages are only accessible to logged-in users
• 🗺️ Explore Tour Spots — Browse popular tourist destinations with images and descriptions on the homepage
• 🧳 Book a Trip — Book a visit to a specific tour spot through a validated booking form
• ➕ Add Tour Spot — Authenticated users can add new tourist spots to the platform
• 🗂️ Manage Services — View and manage the list of added tour spots/services
• 📱 Fully Responsive — Optimized for desktop, tablet, and mobile
• ⚡ Single Page Application — Smooth client-side navigation with no page reloads

---

📦 Dependencies

"axios": "^0.24.0",
"bootstrap": "^5.1.3",
"firebase": "^9.2.0",
"react": "^17.0.2",
"react-bootstrap": "^2.0.1",
"react-dom": "^17.0.2",
"react-hook-form": "^7.18.0",
"react-router-dom": "^5.3.0",
"react-router-hash-link": "^2.4.3",
"react-scripts": "4.0.3",
"web-vitals": "^1.0.1"

---

🚀 Getting Started (Run Locally)

Follow these steps to run the project on your local machine:

1. Clone the repository

git clone https://github.com/<your-username>/world-tour-client-side-website.git
cd world-tour-client-side-website

2. Install dependencies

npm install
# or
yarn install

3. Set up Firebase configuration

This project uses Firebase Authentication. Add your own Firebase project credentials inside:

src/Pages/Login/Firebase/firebase.config.js

You'll need a firebaseConfig object with your apiKey, authDomain, projectId, etc., generated from the Firebase Console.

4. Run the app

npm start
# or
yarn start

The app will run at http://localhost:3000.

5. Build for production

npm run build
# or
yarn build

---

🔗 Relevant Links

• 🌐 Live Website: https://world-tour-web.web.app/
• 💻 Client Repository: https://github.com/Sheikhasib/world-tour-client-side-website
• ⚙️ Server Repository: https://github.com/Sheikhasib/world-tour-server-side-website

---

📄 License

This project is created for educational purposes.