Week 1 Homework
Day 5 (Friday)
It's been an exciting day, learning about DOM and how to manipulate it. Don't worry if you didn't get everything, practice makes perfect. Here are some exercises to help you reinforce the concepts!
Submit the link to your tic-tac-toe repository with your index.html, style.css and script.js files.
- Back to tic-tac-toe! Now that you have the basic HTML and CSS layouts in place, use DOM manipulation to add these features
- Allow players to place "X" & "O" pieces on the game board
- Switch between player turns
- Restart the game
- More DOM manipulation practice
- Work on the Fellowship of the Ring lab
- Bonus For some additional practice try out the DOM Times Table exercise as well!
Day 4 (Thursday)
There were a lot of new and difficult JavaScript topics introduced today. Don't get discouraged if you didn't internalise them all - it's nearly impossible! Understanding and memory comes with practice, practice and more practice! (so that's what we're going to do)
- We're going to write a lot of functions to do all kinds of different things. Read the handout carefully and Google anything you don't understand
- Submit a GitHub repository that contains a JavaScript file:
functions.js. Name all of your functions like so:long1,long2,short1etc. - Remember to make your functions
returnvalues. Returning values makes your functions useful to other parts of your code and will simplify your job further down the road - Indent your code! We haven't talked about it a lot in class, but indentation is really important for keeping track of stuff. Rule of thumb: everything inside braces
{}is another indentation level. This means objects, loops and functions.
- Submit a GitHub repository that contains a JavaScript file:
- Read the Gitbook chapters on DOM and Events and DOM Manipulation. It's a confusing concept, so do familiarise yourself before class
- Bonus If you want some practice, try adding some manipulations to your tic-tac-toe. For example: causing an X or O to appear when you click the box, or creating a button that resets the board
- We're training you to think algorithmically too: FreeCodeCamp from Reverse a string to Largest number in array
Day 3 (Wednesday)
We're going full-on JavaScript today!
- We'll be looking at FreeCodeCamp again, this time from primitives to arrays! Comment your Javascript code to Shopping List
- We'll also practice
forloops: FreeCodeCamp For Loops to Nesting For Loops - Optional: HackerRank has a cool 30 Days of Code challenge. Try it from Day 1 and see how far you can get!
- It might be a bit confusing because it's meant for all kinds of languages. Just stick with it and Google anything you're not sure of! (remember to change the editor language to Javascript)
- If you'd like other, cooler exercises, HackerRank has plenty of programming tasks for you to try out.
Day 2 (Tuesday)
- We're going to recreate a site! Choose either Airbnb or Instagram
- You'll submit this one too! Same procedure as yesterday's User Inputs
- Following up from the HTML CSS challenge (remember HTML User Profile Content?) We'll add onto it using fonts, colors and box model positioning
- Fonts and Colors
- Box Model
- Remember to make all of the changes in yesterday's repository
- Free Code Camp's Javascript Tutorial, from Comment your Javascript code to Word blanks
- We'll jump deep into Javascript tomorrow, so make sure you familiarise yourself with it now!
Code School Dev tools (until chapter 4)
- Do this after the Javascript tutorial so that the later chapters make more sense
Day 1 (Monday)
- Do this after the Javascript tutorial so that the later chapters make more sense
(CodeCademy's Learn the Command Line)[https://codecademy.com/learn/learn-the-command-line]: Do the first part of units 1-3 (don't worry about the pro/paid parts).
- Finish learning How The Internet Works!
-
- Create a git repository for this homework
- Add all of the content required (don't worry about CSS just yet)
- It should contain whatever original stuff you like!
-
- Take note, you'll have to submit this one!
- Create a GitHub repository
- Do all of the work required
- <--- Submit the homework using the link on the left!