This is a site where users can browse hiking routes and post their own trails using interactive mapping and blogging features!
Here is a link to the deployed app. You can login with email: test@test.com and password: test1234 if you would like to try out the hiking route creation features.
Hike EU is a full stack app with the frontend built in React and a backend that uses NodeJS and Express.
Each hike created using the tools on Hike EU has 3 main components.
- A summary card which is shown in the explore interface
- A blog which is generated from the user entered data.
- An interactive map locked to user defined constaints. This map has one or more routes drawn onto it.
I made a three part wizard to create hikes. A stepper at the top of the page tracks progress.
Enter the hike summary which will be displayed on the explore page.
The user sets the bounds of the map and then draws the routes on with a polyline tool.
Instructions are displayed in the sidebar.
The user enters the blog information. A hike is composed of days and each day has one or more stages.
A clickable table of contents menu is generated from the day and stage headings
Albeit a very basic example for the sake of demonstration.