Skip to content

melsdesign/Neighbourhood-Map-React

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Neighborhood Map Udacity Project

This app was built using create react app and it is the last project of the Udacity Front End Developer Course

This an app was created using Google Maps Api that shows the best places in Larnaca,Cyprus Foursquare api was used to collect informartion about the locations,and to render the InfoWindow. Please note some locations might not have all the details,there are shown only the details which are available on the page of FourSquare

How to navigate

-> Click on any marker will open an infowindow that displays the name of the place and some information about the location -> You can close the info window by clicking the X in the right corner You can click on an item on the provided list and the appropriate marker will display its infowindow. You can type in the input field and filter the beaches alphabetically (Try not to laugh with the weird Greek names). If you are on a mobile or tablet screen, the list is automatically hidden, and you can open it by clicking on the SHOW button (and close it from the same button).

How to see it/run it

Your system expected to have following dependencies installed

  Node.js
  npm
  [ yarn ]
  Git

The project can be found on github https://github.com/melsdesign/Neighborhood-Map-React

You can run the page live at : https://melsdesign.github.io/Neighbourhood-Map-React/

  1. Download this repo
  2. Run: npm install in working directory
  3. Install Dependances (see Dependances)
  4. Run npm start to initialize.

A new browser window will initialize and display the app. In case it doesn't, navigate to http://localhost:3000/ in your browser to open the page

Dependances:

escape-string-regexp Google Maps API Foursquare API