Wanderlustic

Wanderlustic is the ultimate travel booking website, providing users with everything they need to plan and book their dream vacation. With a user-friendly interface, personalized recommendations, Wanderlustic makes it easy to have the perfect travel experience.

Demo

Frontend Deployed link: https://wanderlustic.vercel.app/

Backend Deployed link: https://wanderlustic.onrender.com/

Tech Stack

Client: React, Chakra-UI

Server: Node, Express, Mongoose, MongoDB

Features

• Light/dark mode toggle
• Fullscreen mode
• Cross platform

Run Locally

Clone the project

  git clone https://github.com/pratikderepatil/wanderlustic

Go to the project directory

  cd frontend
  cd backend

Install dependencies

  npm install

Start the server

  npm run start

API Reference

New booking

  POST /user/confirmBooking/

Parameter	Type	Description
fullname	string	Required.
email	email	Required.
destination	string	Required.
numberOfTravellers	number	Required.
budget	number	Required.

Get booking details by id

  POST /user/getBookingDetails

Parameter	Type	Description
id	string	Required. Id of booking to fetch

Environment Variables

To run this project, you will need to add the following environment variables to your .env file

Frontend

REACT_APP_API_URL="https://wanderlustic.onrender.com/user/"

Backend

DB_URL="mongodb+srv://wanderlustic:wanderlustic@cluster0.3cetmid.mongodb.net/"

PORT=8080

Test Cases

Frontend

Test Case ID	Test Case Description	Test Steps	Expected Result
1	Form Submission with Valid Data	1. Enter a valid name in the "Name" field.	Form data is successfully submitted and the user is redirected to the second page.
		2. Enter a valid email address in the "Email address" field.
		3. Select a valid option from the "Select Destination" dropdown.
		4. Enter a valid number in the "No. of travellers" field.
		5. Enter a valid budget per person in the "Budget Per Person" field.
		6. Click on the "Submit" button.
2	Form Submission with Invalid Data	1. Enter an invalid name in the "Name" field (e.g. special characters, numbers only).	Submit button is disabled
		2. Enter an invalid email address in the "Email address" field (e.g. missing '@' symbol).
		3. Select an invalid option from the "Select Destination" dropdown.
		4. Enter an invalid number in the "No. of travellers" field (e.g. negative number, decimal value).
		5. Enter an invalid budget per person in the "Budget Per Person" field (e.g. non-numeric characters).
		6. Click on the "Submit" button.

Backend

Test Case ID	Test Case Description	Test Steps	Expected Result
1	Store Form Data	1. Submit a valid form with valid data.	The form data is successfully stored in the database.
		2. Verify that the form data is successfully stored in the database.
2	Retrieve Form Data	1. Submit multiple forms with valid data.	All the previously submitted form data is retrieved and displayed correctly.
		2. Call the second endpoint to retrieve existing form submissions.

Screenshots

Authors

• @pratikderepatil