shuence / TravelWorld

TravelWorld - A Fullstack Tours & Travels Web App

Home Page:https://travelworldtours.shuence.com

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

TravelWorld 🌍

A Fullstack Tours & Travels Web App Using MERN Stack πŸ’«

Backend Repository

Resources

Authors

Badges

GPLv3 License

Live Preview

TravelWorld 🌍

image

Travel.World.mp4

Setup

To Setup this project run

git clone <https://github.com/shuence/Travel-World>
cd Travel-World
yarn
yarn serve

Environment Variables

REACT_APP_BASE_URL= http://localhost:4000/api/v1

Features

  • Tours Listing: Display a list of available tours for users to explore.
  • Featured Tours: Highlight and showcase special or popular tours on the homepage.
  • Tour Details: Provide comprehensive information about each tour, including description, itinerary, price, and more.
  • Gallery: Showcase high-quality images and videos of destinations and tour experiences.
  • User Authentication: Allow users to create accounts and log in to access personalized features.
  • Booking System: Enable users to book tours online with a secure and easy-to-use booking system.
  • Search Tours: Implement a search functionality to help users find specific tours based on their preferences.
  • Reviews and Ratings: Allow users to leave reviews and ratings for tours they have experienced.
  • Responsive Design: Ensure the website is optimized for various devices, including desktops, tablets, and smartphones.
  • Newsletter Signup: Allow users to subscribe to a newsletter to receive updates and promotions.
  • User Reviews and Testimonials: Showcase positive reviews and testimonials from previous customers to build trust.
  • Contact Form: Provide a contact form for users to get in touch with inquiries or feedback.
  • Blogs: Added Blogs feature to provide more information to customers.
  • Alerts: Appropriate alerts of errors and success for better user experience.
  • FAQ's: Include a frequently asked questions (FAQ) section to address common queries from users.
  • Analytics Integrated Google Analytics for analytics.

What I learned

While building this project, I embarked on my first full-stack journey, transitioning from frontend development to working with the backend. The journey was both exciting and challenging, and I learned a lot along the way:

  1. Frontend Gracefulness: As I crafted the frontend, I encountered various errors, but I embraced each challenge as an opportunity to learn. With useState and other hooks, along with Bootstrap for styling, I built an intuitive and responsive user interface.

  2. Backend Confidence: Setting up the Express and MongoDB server initially seemed daunting, but I persisted. Working on controllers for API calls and defining routes took time, but I gained confidence as I overcame each obstacle.

  3. Expanded Toolkit: Throughout the project, I explored additional React concepts like useEffect, useContext, and React Router DOM for seamless navigation between components and managing state effectively.

  4. Deployment Know-How: Deploying the backend server was a crucial step in making the application accessible online. I learned to configure the production environment, manage dependencies, and ensure security with HTTPS and authentication.

  5. Continuous Improvement: I adopted a proactive approach to monitoring and logging server performance, identifying potential issues early on and implementing CI/CD pipelines for smooth and automated deployments.

  6. The Joy of Problem-Solving: Despite encountering obstacles, I discovered the joy of problem-solving and the satisfaction that comes with finding solutions to complex challenges.

  7. Version Control and Rollbacks: I grasped the importance of version control not only for the codebase but also for server configurations, facilitating easy rollbacks if needed.

Overall, this project marked a significant milestone in my journey as a full-stack developer. Combining frontend and backend expertise, I can now confidently bring complete web applications to life and tackle new challenges with enthusiasm.

Tech Stack

Client: React, Bootstrap, Reactstrap, Remix Icons

Server: Node.js, Express

Database: MongoDB

Roadmap

  • Implement additional login options, such as Google signup.
  • Explore and integrate popular payment gateways for secure online transactions.
  • Enhance the app with modern features like real-time chat support and personalized recommendations.
  • Introduce advanced search filters for customized tour searches.
  • Integrate geolocation services for location-based tour suggestions.
  • Implement a user dashboard for managing and tracking bookings.

Hi, I'm Shuence! πŸ‘‹

πŸš€ About Me

I'm Shubham Pitekar, a passionate full-stack developer with expertise in ReactJS,NextJS, NodeJs,ExpressJS and MongoDb. I love turning ideas into reality on the web. I thrive on challenges and continuously seek opportunities to push my boundaries. Let's create impactful projects together!

πŸ›  Skills

JavaScript, HTML, CSS, React, Bootstrap, Node.js, Express, MongoDB.

Happy coding πŸ’―

Made with love from Shuence ❀️

About

TravelWorld - A Fullstack Tours & Travels Web App

https://travelworldtours.shuence.com


Languages

Language:JavaScript 74.9%Language:CSS 23.8%Language:Dockerfile 0.7%Language:HTML 0.7%