raw notes lesson plans w1-3

Noer Paanakker · Noer Paanakker · commit 9b69c262bb26 · 2019-11-04T17:27:37.000+01:00
diff --git a/Week1/LESSONPLAN.md b/Week1/LESSONPLAN.md
@@ -0,0 +1,47 @@
+# Lesson Plan JavaScript3 Week 1
+
+## Agenda
+
+The purpose of this class is to introduce to the student:
+
+- What are `APIs` and how to interact with them
+- What is `AJAX` and how to apply it (`XMLHttpRequest`)
+- How to use libraries (`axios`)
+
+## Core concepts
+
+FIRST HALF (12.00 - 13.30)
+
+1. What are APIs and how to interact with them
+
+Notes:
+
+- Part of an application that can be communicated with from an outside source
+- Connect to it using "endpoints"
+- Mostly used to request data from some service
+
+**Show examples**
+
+2. What is `AJAX` and how to apply it (`XMLHttpRequest`)
+
+Notes:
+
+- It's a technique, not a technology
+- `AJAX` stands for Asynchronous JavaScript and XML
+- Nowadays we use `JSON` instead of `XML`
+- Fetch data without reloading the page
+
+**Do exercise**
+
+SECOND HALF (14.00 - 16.00)
+
+3. How to use libraries (`axios`)
+
+Notes:
+
+- A library is a code solution a developer (or a team) has written to a common problem
+- Usually open-source
+- Helps to solve a problem within an application
+- Read the documentation on how to use it
+
+**Do Exercise**
diff --git a/Week2/LESSONPLAN.md b/Week2/LESSONPLAN.md
@@ -0,0 +1,42 @@
+# Lesson Plan JavaScript3 Week 2
+
+## Agenda
+
+The purpose of this class is to introduce to the student:
+
+- How to use the `fetch` API to do AJAX calls
+- The structure and use of `Promises`
+- The `this` keyword and its relationship with `scope`
+
+## Core concepts
+
+FIRST HALF (12.00 - 13.30)
+
+1. The structure and use of `Promises`
+
+Notes:
+
+- It's the accepted solution to [callback hell](http://callbackhell.com/)
+- It's a way to introduce asynchronicity to your application
+- Makes asynchronous code read like it's synchronous
+
+**Show examples**
+
+2. How to use the `fetch` API to do AJAX calls
+
+Notes:
+
+- Modern replacement of XMLHttpRequest
+- Uses Promise structure
+- The Fetch API is defined in the browser
+- Only modern browsers support it (show [caniuse.com](https://caniuse.com/#feat=fetch))
+
+**Do exercise**
+
+SECOND HALF (14.00 - 16.00)
+
+3. The `this` keyword and its relationship with `scope`
+
+Notes: 
+
+- 
diff --git a/Week3/LESSONPLAN.md b/Week3/LESSONPLAN.md
@@ -0,0 +1,43 @@
+# Lesson Plan JavaScript3 Week 3
+
+## Agenda
+
+The purpose of this class is to introduce to the student:
+
+- The purpose and use of `async/await`
+- What is `Object-Oriented Programming` (OOP) is and how it's applied to JavaScript
+- How to use ES6 `classes`
+
+## Core concepts
+
+1. The purpose and use of `async/await`
+
+Notes:
+
+- It's an upgrade to `Promises`
+- Makes writing an asynchronous function more readable
+
+**Do exercise**
+
+2. What is `Object-Oriented Programming` (OOP) is and how it's applied to JavaScript
+
+Notes:
+
+- It's a programming style; it defines how to organise your application
+- In OOP each program would be split up into self-contained objects, that then communicate with each other
+- Each object represents a part of the application: it contains its own data and logic
+- OOP is meant to make thinking about your applications easier, by having each object represent a real-life entity (i.e. Users, Profiles, Products)
+
+**Show examples**
+
+FIRST HALF (12.00 - 13.30)
+
+3. How to use ES6 `classes`
+
+Notes:
+
+- `classes` are a modern way of creating objects in JavaScript
+- It's `syntactical sugar` for object constructors
+- A `class` is a blueprint of an object, that can be instantiated
+
+**Do exercise**
