Yelp Api Setup

[GregStephen]

User Story

As a user when I search a term, I should come up with a list of names of business near my location

AC

WHEN the user types in a term such as "pizza" THEN a list of pizza places near by should populate under the search bar

Development

• Create a project with Yelps fusion api at Yelp.com
• Copy the apiKey and put it into your apiKeys.json with a key of yelpConfig and a value of an object with a key of yelpApiKey and a value of the copied apiKey.
• Copy the new info into your apiKeys.example.json to match but take out the actual apiKey!
• Create a yelpData.js file in helpers/data and import yelpKeys from apiKeys.json and axios from 'axios'
• Create a new function getBusinessesNearMe that takes in three params (latitude, longitude, search) that is a new Promise that does the axios call found in the comments
• In the .then(res) resolve `res.data.businesses)
• In the catch reject the err per usual
• export default { getBusinessesNearMe }
• In App.js add to the state { results: [], latitude: 36.1627, longitude: -86.7816, }
• In the searchYelp function call yelpData.getBusinessesNearMe and pass in the latitude, longitude and search from this.state
• Create a variable called yelpRes and set it to the result from get.
• SetState of results: yelpRes
• Create a function in render called resultComponents that maps out results and with each result makes a <ResultRow key={ result.id } result={ result }/>
• Create a <ul> below the submit button in the return and call { resultComponents }
• Create a ResultRow component like standard
• In the render of ResultRow create a <li> and then {this.props.result.name} inside
• Export default ResultRow
• Marvel at it's beauty when you search a term

[GregStephen]

code for the axios call

(`${'https://cors-anywhere.herokuapp.com/'}https://api.yelp.com/v3/businesses/search`,
    {
      headers: {
        Authorization: `Bearer ${yelpKey.YelpKeys.apiKey}`,
      },
      params: {
        term: search,
        latitude,
        longitude,
      },
    })