TravelWorld 🌍

A Fullstack Tours & Travels Web App Using MERN Stack 💫

Backend Repository

• TravelWorld Backend Repository

Resources

• React Docs
• BootStrap
• ReactStrap
• Stackoverflow

Authors

• @Shuence 💫

Badges

Live Preview

TravelWorld 🌍

https://github.com/shuence/Travel-World/assets/65482186/69a5ebf9-85d7-4f65-a8a2-066dceebbc24

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 ❤️