MERN-ASSIGNMENT

This is a MERN stack application that allows users to view travel packages, get details of individual packages, and make bookings.

Table of Contents .Tech Stack .Features .Installation .Usage .API Endpoints .Frontend Structure .Backend Structure

Tech Stack Frontend: React.js - A JavaScript library for building user interfaces. React Router - For navigation between pages. Axios - To make HTTP requests to the backend. TailwindCSS - Utility-first CSS framework for styling.

Backend: Node.js - JavaScript runtime built on Chrome's V8 engine. Express.js - Web application framework for Node.js to handle HTTP requests. Zod - Type-safe validation library to validate and enforce correct data structure. MongoDB - NoSQL database to store data (e.g., packages, bookings). Mongoose - ODM (Object Data Modeling) library to interact with MongoDB. dotenv - To manage environment variables securely.

Features: View All Packages: Users can see a list of available travel packages. View Package Details: Users can view detailed information about a specific package. Booking Form: Users can book a package by filling out a booking form, which includes their name, email, phone number, number of travellers, and any special requests. API Endpoints for Backend: GET /api/v1/packages - Retrieves a list of all available packages. GET /api/v1/packages/:id - Retrieves details of a single package. POST /api/v1/bookings - Submits a booking form to make a booking.

Installation Prerequisites Make sure you have the following installed on your system:

Node.js (v14 or later) MongoDB (if running locally) or a cloud MongoDB service like MongoDB Atlas

Installation Prerequisites Make sure you have the following installed on your system:

Node.js (v14 or later) MongoDB (if running locally) or a cloud MongoDB service like MongoDB Atlas

Clone the repository git clone https://github.com/Anuradha-Udatha/MERN-ASSIGNMENT.git cd MERN-ASSIGNMENT

Backend Setup Navigate to the backend/ folder: cd backend

Install the dependencies: npm install Create a .env file to store environment variables (e.g., MongoDB connection URL).

Example: env Copy code MONGO_URI=mongodb://localhost:27017/mern-assignment PORT=3000

Start the backend server: npm start

Frontend Setup Navigate to the frontend/ folder: cd frontend

Install the dependencies: npm install

Start the frontend development server: npm run dev The frontend will be accessible at http://localhost:5173.

Usage Open your browser and go to http://localhost:5173/packages to view the list of available packages. Click on a package to view detailed information about it. Use the "Book Now" button to open the booking form and make a booking.

API Endpoints

1. GET /api/v1/packages Retrieves a list of all available travel packages. Response: json [ { "_id": "package_id", "title": "Package 1", "description": "Description of Package 1", "price": 1000 }, ... ]

2. GET /api/v1/packages/:id Retrieves details of a specific package by its ID. Request: GET /api/v1/packages/675e136fd1ffccb375726596 Response: json { "_id": "675e136fd1ffccb375726596", "title": "Package 1", "description": "Detailed description of Package 1", "price": 1000, "itinerary": "Sample itinerary here..." }

3. POST /api/v1/bookings Submit a booking for a package. Request Body: json { "Name": "Anuradha Udatha", "Email": "[email protected]", "PhoneNumber": "8374026569", "NumberOfTravellers": 1, "SpecialRequests": "None", "PackageId": "675e136fd1ffccb375726596" } Response: json Copy code { "success": true, "message": "Booking successful!" }