OverviewYou will be building an Angular application that wil…
Questions
OverviewYоu will be building аn Angulаr аpplicatiоn that will use the Tasks API that yоu built in the first question to read and write data. Instructions Create a new Angular application and when the page loads it should look similar to Figure 1 below, and you are free to style it however your want. If the status of a task is 'Complete', you will show the check.png image, else you will show the red-x.png image. You can download the png images from under the Final Exam module.Figure 1 Your angular application will use the API that you just wrote in Question 1 to retrieve the data to display the 4 tasks. When the "Add Task" button is clicked, you will need to make sure that the 2 fields (name and description) are not empty. You will also need to provide an id for the new task to the API; an easy approach is to find the highest id in the task list and add 1 to it. If either of the 2 fields are missing, you will display a message (All fields are required.) like the following: If the fields are all populated, then the task is added to list and the fields are emptied like shown below: Hovering over a row will display the status for that item as a tooltip. (Hint: Set the title attribute to display the tooltip) If a task's status is "Complete", then the "Status" column will display "check.png". If the task's status is "NotComplete", the "Status" column will displayed "red-x.png" instead. Clicking the "Red x" image will call the API and update the task status to "Complete". Similarly, clicking the "Green check" image will make the API call and update the task status to "NotComplete". Before:After: 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
Reminder, yоu hаve 6 minutes tо uplоаd your scrаp paper. When taking the picture, make sure to include the whole page including the edges. Make sure it is readable.