inside out – STEP 101 | Starting the Navigation to Our App – Assignment
Overview
In this lesson you will complete the following steps to add the first level of links to the index.html page.. Each action item has been linked to the time stamp in the lesson video to help you focus on learning rather than searching for information. Please be sure to complete each step as demonstrated in the video.
Action Items to Complete
- Complete all steps completed in the video “inside out – inside out – STEP 101 | Starting the Navigation to Our App”.
- 00:00 – Introduction to what we will be learning in the lesson.
- 00:10 – starting here – an overview of where we are before starting
- 00:23 – overview of what we will be learning in this lesson
- 00:34 – where we are after completing step-100
- 00:50 – review starting files and folders
- 01:22 – update our jQuery from slim to full
- 02:02 – create step folders
- 02:15 – move files to step folders
- 02:34 – copy step-100 folder to step-101 folder
- 04:03 – create data folder
- 04:20 – download JSON file from Assignment Resou
- 04:51 – copy menu.json file to data folder
- 05:07 – review menu JSON file
- 06:07 – begin setting up menu
- 07:21 – add the app.js file
- 07:54 – move header script to the app.js file
- 09:06 – link app.js file to index.html page
- 09:49 – open console to help trouble shoot
- 11:05 – init function
- 11:26 – start creating first ajax call
- 15:43 – ajax error – oh no!
- 16:34 – fixing the error
- 17:00 – how to see and use the data
- 18:50 – getting the length of the object
- 20:29 – do something if the object has children
- 21:46 – if there are children handle each
- 24:07 – create links with the data items
- 24:20 – use jQuery append
- 25:27 – add MenuLink & MenuName to element
- 26:42 – see our javascript created links
- 26:56 – remove static links in menu
- 27:40 – lesson review
- Push all the files you have created to your server and review that your work is error free and aligns to the completed work in the video.
- Submit the url to your application (the index.html file) once you have validated your work and are confident you have completed everything. The link should look similar to the following link: http://inside-out-html5-app.inside-out-project.com/step-101/ and your page should look to what you see when clicking on the example link.
please note: your assignment is to be submitted in the step folder as shown in the example above.