Skip to content

Latest commit

 

History

History
58 lines (43 loc) · 2.34 KB

README.md

File metadata and controls

58 lines (43 loc) · 2.34 KB
Raw

Wiki Map

A full stack web app made to connect friends who want to share map pin points--built using the open-source Leaflet1 Javascript library and Mapbox2 tile data to display an interactive and user-friendly map interface.

This app was built as a midterm project for the Lighthouse Labs web development program by:

Product Views

"Homepage" "Map view" "Profile page"

Dependencies

  • Node
  • NPM
  • PG
  • Chalk
  • EJS
  • Express
  • Cookie-parser

Project Setup

  1. Install all dependencies (npm install)
  2. Reboot the database (npm run db:reset)
  3. Run the development web server (npm start)
  4. Navigate to localhost:8080/maps
  5. Using DevTools, create a cookie user_id with a value of 1, 2, or 3--this will enable you to navigate the site as a logged-in user (in the current development state)3

Functionality

  • A user can create a map, and then save pins to that map
  • Pins must contain a title and location (location is determined from map click)
  • Pins can optionally contain a description and image URL
  • Other users can add pins to any map
  • Only the creator of a pin can edit or delete that pin
  • Users can view their profile page, which includes summary lists of their maps, 'liked' maps by others, and pins they've contributed to other maps.

Future Objectives

  • Add user authentication
  • Add cloud database support and hosting
  • Improve responsive design for various screen sizes
  • Build-out error pages to provide more visual continuity

Wireframes

"Wireframes"

Entity Relationship Diagram (ERD)

"Entity Relationship Diagrams"

Footnotes

  1. Refer to https://leafletjs.com/ ↩

  2. Refer to https://www.mapbox.com/ ↩

  3. Refer to https://developer.chrome.com/docs/devtools/ ↩