Neighborhood-map-Project-5-FSND---Udacity

Live Project:

Project Overview

A single page web-application featuring a map of neighborhood, having functionalities including highlighted locations, third-party data about those locations and various ways to browse the content.

What did I learn?

• How design patterns assist in developing a manageable codebase
• How frameworks can decrease the time required for developing an application and provide a number of utilities for you to use
• Implement third-party APIs that provide valuable data sets that can improve the quality of your application.

---

Getting started:

Tools required:

• Microsft VSCode to make the app.
• Google Chrome to run the web-app.
• Google Maps API to load map.
• Foursquare API to fetch data for the eating joints.
• Knockout Javascript to bind data.
• jQuery (Javascript Library) for easier coding of javascript.
• Bootstrap to make the page responsive.
• Google Fonts to add stylish text.

Steps to run the app:

• Download/Clone this project, here is the link.
• Extract and open the project folder.
• Open index.html, you will be opened with the app in your web browser (use Google chrome).

  Functionality:

• You can traverse the map loaded using Google maps API.
• You can click on any of the locations provided in the list in the sidebar to see more information implemented using FourSqaure API.
• You can search from any of the places in the list using the searchBar, which is implemented using knockoutjs.

Reference:

Udacity's Google Maps APIs course

Acknowledgment:

Hat tip to Udacity's Full Stack Web development team and to anybody who helped me. 👏👏👏