Skip to content

Single page React app that uses the Google Maps and FourSquare API.

License

Notifications You must be signed in to change notification settings

Jlevett/Neighborhood-Map-React

Repository files navigation

Neighborhood Map React Single Page App

By Jeremy Levett

About

This single page app uses the Google maps API and the location-based service Foursquare API to list some attractions in the Blue Mountains Katoomba, Australia. The page features 5 map markers of locations in the Blue Mountains and lists details of each attraction using the Foursquare API. It also includes a search functionality that filters out the markers by query. It is made with responsiveness and a11y in mind.

APP HOSTED HERE. CLICK TO TRY IT OUT!

Gif

Udacity Project Reviewer comment: "Congrats. This is indeed a great submission. You went far more than what was demanded from you and the final application is awesome I really enjoyed reviewing this! You did a great job!"

This app was design from ground up, utilizing the create-react-app tool. It uses the google-maps-react library.

How to Use the App

  1. The app will load a map of Katoomba, Blue Mountains with markers for each attraction and a list of of these attractions in the sidebar.
  2. Click on a map marker or name of the attractions list to get details about the specific attraction.

Local Installation

Note: Make sure you have the latest Node.js installed.

  1. Navigate to the directory that contains the project.
  2. Open up Git Bash in this location.
  3. Run 'npm install'.
  4. Run 'npm start'.
  5. Open http://localhost:3000

Important

This application uses API's from Google maps and Foursquare, and developer free plans are only limited to a certain number of requests per day so you may experience not being able to load content. Note: The service worker is only functional in production mode (try it on the hosted site).

Technology

  • Reactjs
  • HTML
  • CSS
  • Foursquare API
  • Google Maps API

Desktop Screenshot

Image of App Desktop

Tablet/Mobile Screenshot

Image of App Mobile

License

This project is licensed under the MIT License - see the LICENSE file for details.

About

Single page React app that uses the Google Maps and FourSquare API.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published