OverviewYоu will be building аn Angulаr аpplicatiоn that will use the Dоgs API that you built in the first question to read and write data. Note: After creating your initial Angular application, if you want you can add the following properties to the "compilerOptions" object in your tsconfig.json: "strictPropertyInitialization": false, "noImplicitAny": false, "strictNullChecks": false Part 1 (40 points)Instructions Create a new Angular application that will have a home page and an edit page. Your home page should look similar to Figure 1 below, and you are free to style it however your want as long as you follow style guidelines in Figure 1. The edit page will be explained in Part 2 of this question. Figure 1 As shown in the Figure 1 above, your application will have a link with text "Home" on the top. Clicking this will navigate the web page back to the home page. This "Home" link will have the appropriate styles listed in Figure 1 if this route is active. The home page will show all the dogs from the Dogs API you created earlier in the first question. If you click the "Add" button after filling out all the fields, it will call the backend API and add the new dog to the list and the UI will be updated accordingly (Figure 3). If any of the fields are missing, you should display an alert message saying "All fields are required.". (Figure 2) If a non-numeric value is entered for the "Id", display an alert saying "Id must be a number.", if a non-numeric value is entered for "Year of birth", display an alert stating "Year of birth must be a number.", similarly display an alert "Weight must be a number" if the weight in lbs is a non-numeric value. If the id entered already exists in the list, then display an alert stating "A dog with this id already exists.".Figure 2Figure 3 Part 2 (25 points) Instructions For this part of the exam, you will make the dogs editable. Make the appropriate change to add an "Edit" button next to each dog row as shown in Figure 4.Figure 4 Clicking the "Edit" button will take the user to the edit page where the dog's information is loaded as shown in Figure 5.Figure 5 Notice how the "Id" field is not editable but the other fields can be edited. Clicking "Cancel" will take the user back to the home page without making any changes. Clicking "Save" will update the dog with the appropriate changes and take the user back to the home page. You should make sure that all the fields are populated and year of birth / weight is a number; display the alert box with the proper message like you did in #4 of Part 1 above. In this example, I am editing this dog's breed and weight (Figure 6). Once I click save, you will see the change reflected in Figure 7.Figure 6Figure 7 If you restart the backend API server and refresh the browser window, the dog list will revert back the original list from Figure 1. Submission Place all of the files needed to run this application in a single zip file. Note: Do NOT include the "node_modules" folder in your zip file, I will deduct 5 points if your zip file contains the "node_modules" folder. The zip file must be named in the format lastname_firstname_final_ui.zip. For example using my name it would be shrestha_gaurav_final_ui.zip