SYST $24444$ Assignment #$2(10\%)$

$$ Create a new Angular app called A$2$yourloginname $($ex$.$ A$2$doejane$)-$ NOTE: Marks off if not named as specified

o Use New Angular Application With Material in the Angular References Module on starting a new project with defaults.

$$ This will be a mobile assignment formatted for landscape view only

$$ Note: Styling included is mostly for testing Angular concepts and mobile layout

o Include a data folder in the assets folder

o Download Assignment$02.$zip that will include the JSON file and a $.$txt file

$$ Copy the Assignment$02.$json file into the assets$/$data folder and open the A$2$Info.txt file

$$ Include the code in the A$2$Info.txt file to update the tsconfig.json file

$$ Update the Assignment$02.$json file to include your personal$/$Sheridan information where indicated AND update the myBooks array with your own data $($Note: published field is a number data type$)$

o NOTE: You may want to validate the file after making changes $($jsonlint$.$com$)$

$$ Create a file called yourusenameInterface.ts in the app folder and include interfaces for the following:

o a$2$Personal information myBooks array structure campusData array structure

$$ In app.component.ts $($parent$),$ import ALL your interfaces AND the JSON file

o Include a variable called yourloginnamePersonal to hold your personal data from the JSON file

o Include a variable called yourloginnameBooks to hold the book data from the JSON file $($remember$,$ this will be an array variable$)$

o Include a variable called yourloginnameCampus to hold the campus data from the JSON file $($remember$,$ this will be an array variable$)$

$$ Create a header component called header$-$yourloginname and a footer component called footer$-$yourloginname and include in app.component.html:

o Use the Sharing procedure to pass your personal information only included in the JSON file from the app component to both header and footer components. The variable in both components to accept shared data must be called yourloginnameMyData

o Header: Add a header element $($I would suggest an