This is a project which is a part of an interviewing process for an internship position as a front-end developer (🤞).
For this project I will implement JavaScript, HTML, and CSS.
This project will display restaurants using the Yelp API. The user will be presented with a list of categories which is based on the Yelp category JSON. Once the user select a category of restaurants he will be shown all of the restaurants' information that cooincide with that category. The information diplayed will be: the restaurant's name, restaurant's image, review, and pricing field, with an option of viewing the restaurant's webpage.
In this project I will: *Use Yelp category JSON to obtain all of the categories available for selection on Yelp *Use Yelp API to obtain information for restaurants *Make sure that the web page is responsive for desktops, tablets, and phones
In the desktop version the user will be presented with buttons for all of the different categories of restaurants. The buttons will be able to be scrolled horizontally. Once the user clicks on a particular category of restaurants below of these buttons, 15 restaurants that match the category will be shown. The restraunts will be shown as "cards" with each card containing restaurant's name, image, review, pricing and a button which leads to the restaurant's website. The whole restaurant card as well, will be clickable and will lead to the restaurant's website.
The page will be:
*~~Infinite scrolling, meaning that once the user reaches the end of the webpage next 15 restaurants will be shown, until there are no more restaurants for that category. ~~
*There will be, as well, a three dot GIF which will be shown as the user scrolls down, indicating that more restaurants are being loaded. This GIF will appear as well once the user selects a category, indicating that the webpage is fetching results for that category.
In the mobile version the user will be presented with two buttons for different categories of restaurants. Again, once the user clicks on a particular category of restaurants, he will be presented with restaurants that match the category. The restraunts will be shown as "cards" with each card containing restaurant's name, image, review, pricing and a button which leads to the restaurant's website.
*Once the user scrolls down to the 9th restaurant, next 15 restaurants will be loaded. (still left to be done)