/neighborhood-map

Neighborhood Map of Paris using React and Google /Foursquare API

Primary LanguageJavaScript

Neighborhood Map

Neighborhood Map of Paris developed using React. The application uses Google Maps API and Foursquare API.

About Neighborhood Map

A Single-page application using React featuring a map of Paris and places one can visit in Paris. The application includes the following features,

1.Textinput field, that filters the locations/map markers matching the input.

2. List View - A list of location names matching the search input. By default, all locations are displayed.

3.Map markers - Markers are displayed for all the listed locations, which when clicked displays an Infowindow showing address and Wikipedia article for the location.

Create React App

This project was bootstrapped with Create React App.

How to Run

Screenshot of the project

image

How to Run locally

Dependencies

  • Install all project dependencies using npm install

npm start

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.
You will also see any lint errors in the console.

npm test

Launches the test runner in the interactive watch mode.
See the section about running tests for more information.

npm run build

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

See the section about deployment for more information.

npm run eject

Note: this is a one-way operation. Once you eject, you can’t go back!

Resources

Google Maps API

https://in.udacity.com/course/google-maps-apis--ud864

Foursquare

https://developer.foursquare.com/

Walkthrough videos & other references

https://www.diigo.com/outliner/fkkuvb/Udacity-Neighborhood-Map-Project-(project-%237)?key=25wgqnwals