Name: Mehmet Acikgoz

Student Id: 01

Lesson Overview:

Angular

In this lesson, we are going to discuss routers, services, HTTP, and RESTful APIs in Angular

ICP Plan

A sample webpage that will extract data from different APIs and display it to the user based on the request with the help of REST calls

Programming elements : Angular (routers, services, HTTP, and RESTful APIs)

The source code for the same is here in compressed format. Please find the source code in here

More info

In Class Programming (ICP)

The following code shows the code for searching the recipes and restaurants. The input are given as place value and recipe value. The API Foursquare is used to find the restaurant with respect to the location using the URL of the API. The API EDAMAM is used to find the recipes using the URL.

The response from the PAI services are in JSON format and the fields we are interested are extracted from the response.

The following shows the HTML code to displays the recipe, a for loop is used which iterates through the recipes and extracts needed fields.

The credentials for the API calls given in the code as well.

The home page is shown as below.

When the user registers with the email, user gets a welcome page.

When the user clicks on the contact button, he gets some more info about the owner.

The search for recipes page is as shown and with search, we see the results.

When the user clicks on any of the recipe, the user gets the details on a new page.

When the user clicks on the google map icon, user lands on the google map.