README (en) • Subject (fr) • Design Doc (en)
Traverse is a web application that allows users to plan their road trips.
By discovering and selecting destinations, setting arrival dates, and deciding on the length of stay, users can craft their own personalized journeys.
They can seamlessly edit or remove stops, and the itinerary is beautifully organized with an interactive map view, providing an enhanced visual experience.
Check out the deployed project here: Traverse -Road Trip Planner-
- Example Destinations: Example destinations are shown, and you can clear them using the clear button at the top left.
- Search Destinations: Search for your destination using the search bar.
- Add Destinations: Add the destination to your trip by specifying the arrival date. You can also add additional information as desired.
- Modify Destinations: Modify your trip by clicking on a destination, making the necessary changes, and clicking save to apply the updates.
- Delete Destinations: To delete a destination, click the delete button in the modification window or select "remove from route" in the map popup.
-
Clone the repository:
git clone https://gitlab.com/mfunyu/traverse.git
-
Start the docker container:
make -
Access from a browser: https://localhost:3000
- React: React Documentation
- TypeScript: TypeScript Documentation
- HTML: HTML Documentation
- CSS (Sass): Sass Documentation
- Docker: Docker Documentation
| Technology | Description | Documentation Link |
|---|---|---|
| React-Leaflet | A React wrapper for Leaflet, a JavaScript library for interactive maps. | React-Leaflet Documentation |
| Leaflet-Geosearch | A geocoding library for Leaflet, allowing for location searches and display on maps. | Leaflet-Geosearch Documentation |
| Leaflet-Routing-Machine | A routing library for Leaflet, providing a way to draw routes on a map and control them easily. | Leaflet Routing Machine Documentation |
| Leaflet-Active-Area | A Leaflet plugin that defines the active area of the map, where layers are displayed and interactive. | Leaflet-Active-Area Documentation |
| UUID | A library for generating unique identifiers (UUIDs) in JavaScript. | UUID Documentation |