'Mappinner' is a multi page application using client-side routing.
The app allows the user to pin a location on an interactive map. The user can add a title and a description to every new pin created and also list all of the pins in the 'My Pins' page. When clicked on one of the listed pins, the app automatically directs the user to the pinned point on the map.
React-Map-GL library, Mapbox API and MongoDB/Mongoose are used in the project.
To get started simply clone the repo and install the dependencies in the root folder:
npm install
npm run setup
and run the app in the development mode:
npm run dev
then you could open http://localhost:3000 in the browser, if it wouldn't open automatically.
- Create the project structure.
- Create an interactive map page to be able to pin new locations.
- Create a 'My Pins' page to list all pinned locations.
- Connect to a public API (mapbox).
- Style the app based on the colour palette of a company/organisation.
- Connect to MongoDB to store and get the data of pinned locations.
- Add a delete feature to delete pinned locations from database.
- Testing.
The color palette of Greenpeace is used in the project.