React app to generate a road trip itinerary given a starting point and a destination.
This React app lets the user choose a start and an end point for their trip, as well as selecting various parameters regarding their trip (type of attractions they'd like to visit, how much they're prepared to deviate from the original route). The app will then return a map of the route with the suggested attractions and some basic information regarding the itinerary (total distance and time, list of suggested attractions).
Demo at https://itinerary-generator.netlify.app/
The back end for this application is made with Node.js and Express; the code is at https://github.com/cbaggini/itinerary-generator-node and the deployed API can be found at https://itinerary-generator-node.nw.r.appspot.com/
To get a local copy up and running follow these simple steps.
Node >= 14.15.1
An OpenRouteService API key (get one here)
An OpenTripMap API key (get one here)
- Clone the repo
git clone https://github.com/cbaggini/itinerary-generator-react.git
- Install the necessary Node packages
npm install
- Start the local development app.
npm start
Here the user can select where they'd like their trip to start and end, as well as how many kilometers they want to deviate from the most direct route (between 1 and 30) and one or more types of attractions they'd like to visit.
Here the user is shown a map of the calculated itinerary with the suggested attractions shown as red circle markers and origin and destination shown as blue markers. The route between the starting point, all suggested attractions and the destination is also shown (blue line). The green buffer represent the search area used to look for attractions.
Above the map, the user can see some basic information about the trip, as well as the list of suggested places to visit.
Clicking on a marker will show a popup with a photo and information about the attraction.