https://github.com/cynthiachiu/travel_advisor
Finds and visualizes the surrounding restaurants, hotels, and attractions based on your location and specified locations in real-time, using markers, popups, and supplementary information accurately. Uses leafletJS, React, Geosearch, and Material-UI.
https://github.com/cynthiachiu/travel_advisor
geosearch javascript leaflet material-ui nodejs reactjs
Last synced: 8 months ago
JSON representation
Finds and visualizes the surrounding restaurants, hotels, and attractions based on your location and specified locations in real-time, using markers, popups, and supplementary information accurately. Uses leafletJS, React, Geosearch, and Material-UI.
- Host: GitHub
- URL: https://github.com/cynthiachiu/travel_advisor
- Owner: cynthiachiu
- Created: 2021-10-15T21:55:01.000Z (almost 4 years ago)
- Default Branch: main
- Last Pushed: 2021-10-15T22:17:53.000Z (almost 4 years ago)
- Last Synced: 2025-01-01T11:24:35.490Z (9 months ago)
- Topics: geosearch, javascript, leaflet, material-ui, nodejs, reactjs
- Language: JavaScript
- Homepage:
- Size: 68.4 MB
- Stars: 0
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Travel Advisor
About |
Features |
Technologies |
Requirements |
Starting |
License |
Author
## :dart: About ##
Finds and visualizes the surrounding restaurants, hotels, and attractions based on your location and specified locations in real-time, using markers, popups, and supplementary information accurately. When you first load the page, allow the browser to detect your location.
You can interact with the map in real-time by dragging the map and seeing the surrounding attractions appear in the map. You can also search a particular address or city in the search bar, and the map automatically adjust to that region. Clicking on a particular marker will bring up the corresponding information in a popup and scroll to a card on the left-hand side with further details.
## :sparkles: Features ##
:heavy_check_mark: Real-time mapping using LeafletJS;\
:heavy_check_mark: Location-based queries to find and visualize nearby restaurants, hotels, and attractions;\
:heavy_check_mark: Ability to change locations and interact directly with the map via dragging and zooming;\
:heavy_check_mark: Searchbar to search and find locations with autocomplete;\
:heavy_check_mark: Filter results by ratings;
## :rocket: Technologies ##
The following tools were used in this project:
- [Node.js](https://nodejs.org/en/)
- [React](https://pt-br.reactjs.org/)
- [Leaflet](https://leafletjs.com/)
- [Geosearch](https://www.npmjs.com/package/leaflet-geosearch)
- [MaterialUI](https://mui.com/)
- [RapidAPI](https://rapidapi.com/)
## :white_check_mark: Requirements ##
Before starting :checkered_flag:, you need to have [Git](https://git-scm.com) and [Node](https://nodejs.org/en/) installed. You will also need to sign up with RapidAPI, and subscribe to the Travel Advisor API. An API key will be generated for you. Create a .env file from the .env.example provided. Take the API key generated for you and put it in the .env file.
## :checkered_flag: Starting ##
```bash
# Clone this project
$ git clone https://github.com/cynthiachiu/travel_advisor
# Sign up with RapidAPI and subscribe to the Travel Advisor API. An API key will be created for you
# Create a .env file following the .env.example and enter your API key
# Access
$ cd travel_advisor
# Install dependencies
$ npm install
# Run the project
$ npm start
# The server will initialize in the
# The browser will ask you to allow it to detect you location, click ALLOW and proceed
```
## :memo: License ##
This project is under license from MIT. For more details, see the [LICENSE](LICENSE.md) file.
Made with :heart: by cynthiachiu