Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 573b074

Browse files
committed
added old planning
1 parent b190b44 commit 573b074

20 files changed

+828
-877
lines changed

README.md

Lines changed: 25 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
**Please note: this is the JavaScript planning/curriculum that was used at HackYourFuture Amsterdam until 10 November 2017. We now use a different planning which can be found in the master branch.**
2+
13
>Please help us improve and share your feedback! If you find better tutorials or links, please share them by opening a Pull Request.
24
35
# HackYourJavaScript
@@ -6,22 +8,34 @@ Here you can find course content and homework for the JavaScript 1,2 and 3 modul
68

79
|Week|Topic|Read|Homework|Review|
810
|----|-----|----|--------|------|
9-
|0.|Preparation for your first JavaScript session|[Pre-reading](/Week0/README.md)|-|-|
10-
|1.|Git Session with Unmesh|[Reading Week 1](/Week1/README.md) | [Homework Week 1](/Week1/MAKEME.md)|[Review](/Week1/REVIEW.md)|
11-
|2.|• Intro JavaScript (What is it, where can you use it for)<br>• Variables [var, let, const]<br>• Basic Data types [Strings, Numbers, Arrays, Booleans]<br>• Operators <br>• Naming conventions|[Reading Week 2](/Week2/README.md)|[Homework Week 2](/Week2/MAKEME.md)|[Review](/master/Week2/REVIEW.md)|
12-
|3.|• Git work flow :smiling_imp:<br>• Advanced data types [Objects] <br>• Conditions <br>• Statements vs Expressions<br> • Loops (for/while)<br>• Functions <br>• Scope|[Reading Week 3](/Week3/README.md)|[Homework Week 3](/Week3/MAKEME.md)|[Review](/Week3/REVIEW.md)|
13-
|4.|• Capturing user input <br>• Events • Basic DOM manipulations[img src, innerHTML] <br>• Code debugging using the browser <br>• Code commenting <br>• Structuring code files |[Reading Week 4](/Week4/README.md)|[Homework Week 4](/Week4/MAKEME.md)|Review|
14-
|5.|• Functions + JSON/Arrays<br>• Array Manipulations<br>• JSON<br>• Map and filter<br>• Arrow functions |[Reading Week 5](/Week5/README.md)|[Homework Week 5](/Week5/MAKEME.md)|[Review](/Week5/REVIEW.MD)|
15-
|6.|• Closures <br>• Scope <br>• Callbacks|[Reading Week 6](/Week6/README.md)|[Homework Week 6](/Week6/MAKEME.md)|[Review](/Week6/REVIEW.md)|
16-
|7.|• Object Oriented Programming <br>• Code flow (order of execution) <br>• Async VS Sync|[Reading Week 7](/Week7/README.md)|[Homework Week 7](/Week7/MAKEME.md)|[Review](/Week7/REVIEW.md)|
17-
|8.|• Structure for a basic SPA <br>• XHTTP Requests <br>• API calls|[Reading Week 8](/Week8/README.md)|[Homework Week 8](/Week8/MAKEME.md)|Review|
18-
|9.|• (re)writing data structures (in JSON) <br>• Promises|[Reading Week 9](/Week9/README.md)|[Homework Week 9](/Week9/MAKEME.md)|[Review](/Week9/REVIEW.md)|
11+
|0.|Preparation for your first JavaScript session|[Pre-reading](/Week0/README.md) + [CLI Reading Week 1](https://github.com/HackYourFuture/CommandLine/blob/master/Lecture-1.md)|-|
12+
|1.|[CLI](https://github.com/HackYourFuture/CommandLine) session with Unmesh :heart: <br>• Intro JavaScript (What is it, where can you use it for)<br>• Variables [var, let, const]<br>• Basic Data types [Strings, Numbers, Arrays, Booleans]<br>• Operators|[Reading Week 1](/Week1/README.md) | [Homework Week 1](/Week1/MAKEME.md)|[Review](/Week1/REVIEW.md)|
13+
|2.|[CLI](https://github.com/HackYourFuture/CommandLine) session with Unmesh :balloon: <br>• Advanced data types [Objects] <br>• Conditions <br>• Statements vs Expressions<br> • Loops (for/while)<br>• Functions <br>• Naming conventions|[Reading Week 2](/Week2/README.md)|[Homework Week 2](/Week2/MAKEME.md)|[Review](/Week2/REVIEW.md)|
14+
|3.|• Closures <br>• Scope <br>• Array Manipulations <br>• Basic DOM manipulations [img src, innerHTML]<br>• Code commenting|[Reading Week 3](/Week3/README.md)|[Homework Week 3](/Week3/MAKEME.md)|[Review](/Week3/REVIEW.md)|
15+
|4.|• First Git Session with Unmesh :smiling_imp:<br>• JSON<br>• Code debugging using the browser<br>• Functions + JSON/Arrays<br>• Code flow (order of execution) <br>• (capturing user input) <br>• Structuring code files|[Reading Week 4](/Week4/README.md)|[JS](/Week4/MAKEME.md)|Review|
16+
|5.|• Second Git Session :see_no_evil:<br> • Events<br>• Callbacks <br>• XHTTP Requests <br>• API calls|[Reading Week 5](/Week5/README.md)|[Homework Week 5](/Week5/MAKEME.md)|[Review](/Week5/REVIEW.MD)|
17+
|6.|• Async VS Sync<br>• Polling<br>• Structure for a basic SPA<br> TEST :boom:|[Reading Week 6](/Week6/README.md)|[Homework Week 6](/Week6/MAKEME.md)|Review|
18+
|7.|• Third Git Session (Git Workflow :muscle:)<br>• Map, reduce, filter <br> • Arrow functions|[Reading Week 7](/Week7/README.md)|[Homework Week 7](/Week7/MAKEME.md)|[Review](/Week7/REVIEW.md)|
19+
|8.|• (re)writing data structures (in JSON)<br> • Closures <br>• Promises <br>|[Reading Week 8](/Week8/README.md)|[Homework Week 8](/Week8/MAKEME.md)|Review|
20+
|9.| • Object Literals (and other patterns)<br>TEST :boom:|[Reading Week 9](/Week9/README.md)|[Homework Week 9](/Week9/MAKEME.md)|[Review](/Week9/REVIEW.md)|
21+
1922

2023
__Kind note:__
2124

2225
We expect you to __always__ come prepared to the class on Sunday.
2326

27+
## Module goals:
28+
29+
### Week 1-3:
30+
A basic program with multiple functions (reacting to user input)
31+
32+
### Week 4-6:
33+
A tool capable of loading a JSON file and representing it in the DOM
34+
35+
### Week 7-9:
36+
A web app with external data source using at least one API 《〠_〠》
37+
2438
### Overall
25-
A good understanding of all the above mentioned topics. Want to check your Knowledge? Go through the [JavaScript Fundamentals README](/fundamentals) and research/ ask for help (Slack!) with the concepts that are not entirely clear.
39+
A good understanding of all the above mentioned topics. Want to check your Knowledge? Go through the [JavaScript Fundamentals README](https://github.com/HackYourFuture/JavaScript/tree/master/fundamentals) and research/ ask for help (Slack!) with the concepts that are not entirely clear.
2640

2741

Week0/README.md

Lines changed: 30 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,36 @@
22

33
```
44
In week one we will discuss the following topics:
5-
• Git
5+
• The first part of the day Unmesh will talk about CLI (Command Line Interface)
6+
• Intro JavaScript (What is it, where can you use it for)
7+
• Variables [var, let, const]
8+
• Basic Data types [Strings, Numbers, Arrays, Booleans]
9+
• Operators
610
```
711

8-
### Here are resources that we like you to read as a preparation for the coming lecture.
912

10-
- In you next lecture **Unmesh** will give you your first Git session, please look through the [GIT](https://github.com/HackYourFuture/Gitrepository) and read the learning goals.
11-
- Please watch [Up Running with Bash Scripting](https://www.lynda.com/Bash-tutorials/Up-Running-Bash-Scripting/142989-2.html)
12-
as a recap on the cli classes you have had (1 hour and 25 min).
13-
- Please watch the first 5 chapters of the [Git essential training](https://www.lynda.com/Git-tutorials/Git-Essential-Training/100222-2.html)
13+
## How to get started
14+
1. Download and install the latest Current version of NodeJS - from https://nodejs.org/en/download/current/
15+
To test that it was installed and running properly, go to your terminal and run the command: node -v You should get the node version printed on your terminal, for example, v8.8.0
16+
2. Although you are free to make you own choice of text/code editor to use during class and homework, we have good experiences with Microsoft's free VSCode editor, which is supported on Windows, Mac and Linux. Please refer to our [VSCode Tips](../VSCodeTips/README.md) for more information.
17+
18+
### Here are resources that we like you to read as a preparation for the coming lecture:
19+
20+
Please watch the following parts of the course, [Programming Foundations Fundamentals](https://www.lynda.com/Programming-Foundations-tutorials/Welcome/83603/90426-4.html) on Lynda.com (if you don't have access to Lynda yet ask Gijs):
21+
22+
Only watch the below chapters:
23+
24+
0. Introduction
25+
1. Programming Basics
26+
2. Core Programming Syntax
27+
3. Variables and Data Types
28+
29+
- Read this ~ http://speakingjs.com/es5/ch01.html read up to and including the *Strings* chapter (it’s okay if you don’t understand all of it yet, we will cover these concepts in class as well. Do make sure to write or document the questions you have so we can discuss them in class)
30+
31+
- Read the entire JavaScript Introduction at MDN~ https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Introduction
32+
33+
- Helpful resource: http://jsbooks.revolunet.com/ (here you can find tons of free JavaScript books online)
34+
35+
:star: You can also already go through the [review](https://github.com/HackYourFuture/JavaScript/blob/master/Week1/REVIEW.md) of the upcoming lecture.
36+
37+
_Please go through the material and come to class prepared!_

Week1/MAKEME.md

Lines changed: 163 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,46 +1,183 @@
11
## Homework week 1:
22

3+
>[Here](/Week1/README.md) you find the readings you have to complete before the second lecture.
4+
5+
## Before you start with the homework:
6+
7+
1. Go through the review of [week 1](/Week1/REVIEW.md)
8+
2. Watch: [What is programming](https://www.khanacademy.org/computing/computer-programming/programming/intro-to-programming/v/programming-intro) Just watch the 2 min video, you do not have to do the entire JavaScript course (It could be useful later on though).
9+
3. Please watch the following parts of the course, [Programming Foundations Fundamentals](https://www.lynda.com/Programming-Foundations-tutorials/Welcome/83603/90426-4.html) on Lynda.com (if you don't have access to Lynda yet ask Gijs):
10+
0. Introduction
11+
1. Programming Basics
12+
2. Core Programming Syntax
13+
3. Variables and Data Types
14+
15+
## Step 1: Command Line
16+
17+
_Deadline Tuesday_
18+
19+
>We covered a bit of command line usage in the first class and got a program running which is great. If you need a refresher for the command line please have a look here: https://github.com/HackYourFuture/CommandLine
20+
21+
1. Create a `.js` file that prints `Hello` when you run it from the command line. (Hint: `node` is the program that can run your JavaScript files.)
22+
323
```
4-
Topics discussed in class this week:
5-
• Git
24+
Write commands to do following:
25+
1. create a directory. Enter a directory. Create an empty file named blank.
26+
2. Then write the content `"Hello"` five times to the file greetings.txt.
27+
Then copy the file greetings.txt and paste its contents into 1.txt, 2.txt, 3.txt, 4.txt and 5.txt.
28+
3. Then write the text "cat" to pets.txt
29+
Then append the text "dog" to pets.txt
30+
Then append the text "hamster" to pets.txt
31+
4. Then write the text "cat" to commands.txt
32+
Then append the text "ls" to commands.txt
33+
Then append the text "pwd" to commands.txt
34+
5. Then find unique strings from these two files pets.txt and commands.txt
35+
and store the unique strings in lovelyCommands.txt
636
```
737

8-
>[Here](/Week1/README.md) you find the readings you have to complete before the fifth lecture.
938

10-
## Step 1: Share a useful resource
39+
## Step 2: Feedback
1140

12-
_Deadline Monday_
41+
_Deadline Wednesday_
1342

14-
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).
43+
Provide feedback on the HTML-CSS assignments (week 3) of one of your fellow students. You will be assigned to one of the assignments by the class lead of this week.
1544

16-
## Step 2: Feedback
45+
## Step 3: JavaScript
1746

18-
_Deadline Monday_
47+
_Deadline Thursday_
1948

20-
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.
49+
> For all the following exercises create a new .js file. Try to find a proper name for each file or make a small comment about what it does inside for future reference. All these
2150
22-
Step3
51+
1\. Write a `console.log` statement saying "Hello World!" for each language that you know.
2352

24-
## Step 3: Git homework
53+
For example:
54+
```
55+
Halo, dunia! // Indonesian
56+
Ciao, mondo! // Italian
57+
Hola, mundo! // Spanish
58+
```
2559

26-
_Deadline Wednesday_
60+
2\. Consider the following code:
61+
```
62+
console.log('I'm awesome');
63+
```
64+
2\.1 Copy the code in your `.js` file and run it. You will see that you will get a SyntaxError. Find a solution for this error, Hint read the error message carefully, it also gives an indication of where the problem is.
65+
66+
3\. Declare a variable `x` and initialize it with an integer.
67+
3\.1 First, _declare_ your variable `x`.
68+
3\.2 Add a console.log statement that explains that explains in words what _you think_ the value of `x` is, like in this example:
69+
```js
70+
// TODO -> here you initialize your variable
71+
console.log('the value of my variable x will be: whateverYouThinkItWillLog');
72+
```
73+
3\.3 Add a console.log statement that logs the value of `x`.
74+
3\.4 Now _initialize_ your variable `x` with an integer.
75+
3\.5 Now add a console.log statement that explains what _you think_ the value of `x` is.
76+
3\.6 Add a console.log statement that logs the value of `x`.
77+
Steps to be taken:
78+
79+
```js
80+
// TODO -> here you declare your variable
81+
console.log('the value of x will be: whateverYouThinkItWillLog');
82+
// TODO -> log the actual value of x
83+
// TODO -> here you initialize your variable
84+
console.log('the value of x will be: whateverYouThinkItWillLog');
85+
// TODO -> log value of x again
86+
```
2787

28-
Git homework for this week:
88+
4\. Declare a variable `y` and assign a string to it.
89+
4\.1 Write a console.log statement in which you explain in words what _you think_ the value of the string is.
90+
4\.2 Now console.log the variable `y`.
91+
4\.3 Now assign a new string to the variable `y`.
92+
4\.4 Just like you did before write a console.log statement that explains in words what you think will be logged to the console.
93+
4\.5 Now console.log `y` again.
94+
```js
95+
// TODO -> here you declare AND assign your string
96+
console.log('the value of my string will be: whateverYouThinkItWillLog');
97+
// TODO -> log the actual value of the string to the console
98+
// TODO -> assign a new value to your variable x
99+
console.log('the value of my string will be: whateverYouThinkItWillLog');
100+
// TODO -> log the actual value of the string to the console
101+
```
102+
103+
5\. How do you round the number 7.25, to the nearest integer?
104+
5\.1 Declare a variable `z` and assign the number 7.25 to it.
105+
5\.2 Console.log `z`.
106+
5\.3 Declare another variable `a` that has the value of z but rounded to the nearest integer.
107+
5\.4 Console.log `a`.
108+
5\.5 So now we have `z` and `a` find a way to compare the two values and store the highest of the two in a new variable.
109+
5\.6 Console.log the highest value.
110+
111+
6\. *Arrays!*
112+
6\.1 Declare an empty array.
113+
6\.2 Write a console.log statement that explains in words what you think the value of the array is.
114+
6\.3 Console.log your array.
115+
6\.4 Create an array that has your favorite animals inside (you can decide on how to call it yourself, but read on a bit here and see if you can find a good name that exactly describes what this variable will hold).
116+
6\.5 Log your array.
117+
6\.6 Add a statement that adds Daan's favorite animal (baby pig) to the *existing array*.
118+
6\.7 Log your new array!
119+
120+
7\. *More strings*
121+
7\.1 Let's consider the following string: `let myString = "this,is,a,test"`.
122+
7\.2 Add the string to your file and console.log it.
123+
7\.3 Find a way to get the length of `myString`.
124+
7\.4 Console.log the length of `myString`.
125+
126+
8\. Write a program that checks the types of two variables and prints out `SAME TYPE` if they are the same type.
127+
8\.1 First declare at least four variables and assign them different data types.
128+
8\.2 For each variable write a `console.log` statement that logs the value
129+
```js
130+
let foo = 3;
131+
console.log('The value of my variable foo is: ' + foo);
132+
```
133+
8\.3 Now write a console.log statement wherein you first explain in words what you think the _type_ of your variables is.
134+
8\.4 Now use `typeof` to log the actual _type_ of your variables.
135+
8\.5 Now compare the types of your different variables with one another.
136+
8\.6 Make sure to also show a message when the variables you are comparing are not the same type.
137+
138+
For example:
139+
140+
```js
141+
let x = 9;
142+
let y = 'Hello';
143+
144+
if () {
145+
console.log('SAME TYPE');
146+
}
147+
// TODO -> add a way of giving feedback if your variables don't have the same type
148+
```
29149

30-
Pair up with another student in your class. The homework requires two people to work together. Let us call them admin and user.
150+
9\. If `x` equals 7, and the only other statement is `x = x % 3`, what would be the new value of `x`?
151+
9\.1 Add at least 3 `console.log` statements in which you show that you understand what `%` does.
31152

32-
1. admin creates a new repository on github called “animals” (without quotes).
33-
2. admin adds a file called “zoo.txt” with some animal generally found in a zoo.
34-
3. admin commits and pushes his changes (in master branch)
35-
4. admin adds user as a collaborator (find out how to add a collaborator to a git repository)
36-
5. user clones a repository from admin (find out how to clone a repository. Note that `git init` is not required when you clone a repository)
37-
6. user makes a new branch called user-dev
38-
7. user adds another file called “pets.txt” with some animals generally found in a home.
39-
8. user commits and pushes his branch to remote
40-
9. admin pulls the branch crated by user (find out how to pull changes from the repository)
41-
10. admin submits the link to his github repository (named animal), where unmesh should be able to see the collaborator’s (i.e. user’s) branch along with his commits.
153+
10\. Write a program to answer the following questions:
154+
10\.1 Can you store multiple types in an array? Numbers and strings? Make an example that illustrates your answer.
155+
10\.2 Can you compare infinities? (Not in Eyad's world) - does 6/0 === 10/0? How can you test this?
156+
10\.3 Add console.log statements to the above program's in which you show that you understand the concepts (just like you've done in the above assignments).
157+
158+
### Step 4: **Some freeCodeCamp challenges (10 hours):**
159+
160+
Deadline Saturday_
161+
162+
On freeCodeCamp.com please do the [Basic JavaScript](https://www.freecodecamp.com/challenges/learn-how-free-code-camp-works) exercises up and until the __"Shopping List"__ exercise (there are some topics we did not cover but you can do it).
163+
164+
### How to hand in Homework:
165+
```
166+
steps:
167+
• Create a Github account
168+
• Create a new repository (name it something like hyf-javascript1) make sure you select the option: initialize with README
169+
• inside this repository create a folder "week1"
170+
• Upload the files you created on your computer inside the week1 folder, write a description for this “commit”
171+
• Open the file in your README to check if this all worked
172+
173+
• Create a new repository "hyf-javascript1". Also create a new folder "week1" inside this repository.
174+
• Upload your homework files inside the week1 folder and write a description for this “commit”.
175+
• Your hyf-javascript1/week1 should now contain all your homework files.
176+
• Place the link to your repository folder in Trello.
177+
```
42178

43-
Note:
179+
### Hint
180+
If you solve the FreeCodeCamp challenges and they are new concepts to you and you would like to take a look at them later on in the program, Copy your answers from FCC in a `.js` file and upload them to Github in a repository for future reference. In this way you build your own little documentation, if you look back at them first try to understand what it does before you run them.
44181

45-
The *user* is *not supposed to fork* the admin’s repository. *admin* is supposed to add user as a collaborator and *user* should just *clone* the repository (i.e. *user* will only have the local copy of the repository). Only *admin* will have the *github* server copy of the repository. Of course, admin will have its local copy of the repository too.
182+
:star: Additional resources and review: [here](/Week1/REVIEW.md) (work in progress):star:
46183

0 commit comments

Comments
 (0)