This is a Travel Advisor website built with React.js. The website allows users to explore famous restaurants, hotels, and tourist attractions at their desired location. The application integrates various technologies such as Google Map React, Material UI, and Rapid API to provide an interactive and informative travel experience.
https://travellers2.netlify.app/
- Location-based Information: The website leverages Google Map React to display a map interface. Users can enter their desired location and view famous restaurants, hotels, and tourist attractions in that area.
- Detailed Information: Each restaurant, hotel, and tourist attraction is accompanied by detailed information such as name, address, ratings, reviews, and contact information. This helps users make informed decisions about the places they want to visit.
- Map Markers: The places are marked on the map, allowing users to visually identify their locations and plan their itinerary accordingly.
- Responsive Design: The website is built with responsive design principles, ensuring an optimal viewing experience across different devices and screen sizes.
- React.js: The website is developed using React.js, a popular JavaScript library for building user interfaces.
- Google Map React: The Google Map React library is used to integrate the map interface into the website and handle map-related functionalities.
- Material UI: Material UI is used for the overall styling and components of the website, providing a modern and visually appealing user interface.
- Rapid API: The website utilizes Rapid API to access the necessary data and information about restaurants, hotels, and tourist attractions.
To run the Travel Advisor website locally, follow these steps:
-
Clone the repository to your local machine.
git clone https://github.com/your-username/travel-advisor.git -
Navigate to the project directory.
cd travel-advisor -
Install the dependencies using npm or yarn.
npm install -
Set up the necessary API keys. Refer to the documentation for Google Maps and Rapid API to obtain the required keys.
-
Create a .env file in the project root directory and add the following environment variables, replacing <YOUR_GOOGLE_MAPS_API_KEY> and <YOUR_RAPID_API_KEY> with your actual API keys.
REACT_APP_GOOGLE_MAPS_API_KEY=<YOUR_GOOGLE_MAPS_API_KEY>
REACT_APP_RAPID_API_KEY=<YOUR_RAPID_API_KEY> -
Start the development server.
npm start -
Open your browser and visit http://localhost:3000 to access the Travel Advisor website.
This project is licensed under the MIT License. Feel free to modify and use the code for your own purposes.