artnerdnet / aglutenfreemap

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Gluten Free Map

Desktop Mobile

Description

This map has been created for the Udacity Front-End Developer Nanodegree, as a final project. It has been developed on React with create-react-app, fetching data from Google Maps API and FourSquare API.

Project Instructions

The goal was to build single-page application using React featuring a map of an area you live in or woud like to visit. Adding additional functionality to this application, including: map markers to identify locations, a search function to easily discover these locations, and a list view to support simple browsing of all locations. It was required to implement third-party APIs that provide additional information about each of these locations.

Run the Application

npm start

  • Clone or download this project:

    $ git clone https://github.com/artnerdnet/bcnglutenfree.git
    
  • Once you are inside the folder, run npm install

  • Run the development server with npm start

Auth Keys

In order to run the app, you are going to need API keys from Foursquare and Google Maps.

Replace them in the App.js file:

For Google Maps: Line 43 const googleApi = "YOUR KEY HERE"

For FourSquare: Lines 49 and 50 clientSecret: "YOUR CLIENT SECRET HERE", clientID: "YOUR CLIENT ID HERE",

Service Worker

To enable the service worker, run the application in production build mode. This is included in Create React App:

npm run build

Dependencies

Packages

API

Design

Customized designed made by me using the following tools

About


Languages

Language:JavaScript 68.7%Language:CSS 25.1%Language:HTML 6.1%