Topics discussed in class this week:
• Capturing user input
• Basic DOM manipulations [img src, innerHTML]
• Code debugging using the browser
• Code commenting
• Structuring code files
• Scope
• State
Here you find the readings you have to complete before the fourth lecture.
- Go through the review of the first week
- Go through the review of the second week
- Go through the review of the third week
Topics discussed in class this week:
• Git
Here you find the readings you have to complete before the fifth lecture.
Deadline Monday
All share a video or a resource (this can be a drawing, article or a pod cast) that was helpful for you the last few weeks with learning JavaScript. Please share this in the channel of your class in Slack. Also write as small note about what the resource i about and why you think it's so helpful (you can share more than one if you like).
Deadline Monday
Give one of your fellow students in Github feedback about their homework of the previous week: create an issue in their repo, telling them what they did great and what they can improve.
Deadline Saturday
-
Open a new js file and start by declaring an array that contains 10 strings. These strings should be of book titles you have read (or made up) and be lowercase without spaces or special characters so that you can use these later as Id's. (Example: Harry Potter's - The Chamber of Secrets ->
harry_potter_chamber_secrets). -
Create a basic html file called index.html and use it to load the js file, confirm the console.log show the array. (This is for debugging and making sure everything is in order. Delete it later when you're done :))
-
Make a function (or functions) that generate a
ulwithlielements for each book ID in the array using a for loop. -
Make an object containing information for each book. Each item (object) in this object should have the book ID you thought up in point 1 as a key, and it should have at least the following fields: title, language and author.
-
Now change the function you used to display the book ID's in a list to take the actual information about the book from the object and display that. Make sure you choose the right html elements for each piece of info, for instance, a heading for the title.
-
Beautify your html page with css, add sources and alts to each of the images.
-
Download book covers for each book, construct a new Object which has as keys the bookId's again, and as value the path to the image source (e.g.
{"harry_potter_blabla": "./img/harry_potter_blabla.jpg", ...}). Now loop over these entries (hint:Object.keys(objectName)gives you an array containing the keys). Then write a function which places an image at the correspondinglielement. Remember that Objects are not ordered, so you cannot guarantee that the first key is the firstlielement. (Hint: you could give eachliitem anidtag by modifying the function you made before)
How to hand in your homework:
• Upload your homework in your "hyf-javascript1" Github repository. Make sure to create a new folder "week3" first.
• Upload your homework files inside the week3 folder and write a description for this “commit”.
• Your hyf-javascript1/week3 should now contain an index.html, main.css and a script.js file (and the images folder)
• Place the link to your repository folder in Trello.
Deadline Sunday morning
- https://www.freecodecamp.com/challenges/declare-javascript-objects-as-variables
- https://www.freecodecamp.com/challenges/make-instances-of-objects-with-a-constructor-function
- https://www.freecodecamp.com/challenges/make-unique-objects-by-passing-parameters-to-our-constructor
- https://www.freecodecamp.com/challenges/make-object-properties-private
And just for fun ... https://www.freecodecamp.com/challenges/sum-all-numbers-in-a-range
Deadline Sunday morning
Go trough the reading material in the README.md to prepare for your next class
the Bonus homework for this week (for those of you want an extra challenge) do the following:
- Sign up on codewars.com
- In you account setting under “clan” write “Hack Your Future”
- Go do the challenges in the following playlist: https://www.codewars.com/collections/fun-fun-fundamentals
Codewars is really a lot of fun, and you can compete against each other who has the most points
it’s a great way to really practice JavaScript a lot in various problems.
Please note, there are various challenges all sorted on difficultly called KIU. Kiu 8 is the easiest, Kiu 1 is the hardest, we expect you to do challenges around level 8, 7 maybe.
enjoy!
![]()
How to hand in your homework:
• Create a new repository "hyf-javascript2". Also create a new folder "week1" inside this repository.
• Upload your homework files inside the week1 folder and write a description for this “commit”.
• Your hyf-javascript2/week1 should now contain the files of your homework.
• Place the link to your repository folder in Trello.
⭐ Additional resources and review: here⭐