From b01bf027b1b27d6f46c1da303dc8101af1247b8a Mon Sep 17 00:00:00 2001
From: Charles-Axel Dein <ca@d3in.org>
Date: Tue, 21 Jul 2020 12:08:28 +0200
Subject: [PATCH] Add README for training

---
 training/front-end/01-modern-javascript.md    | 26 +++++++++++++++++++
 .../05-front-end-development-practices.md     |  3 +++
 training/front-end/{00-intro.md => README.md} | 12 ++++++---
 3 files changed, 37 insertions(+), 4 deletions(-)
 rename training/front-end/{00-intro.md => README.md} (82%)

diff --git a/training/front-end/01-modern-javascript.md b/training/front-end/01-modern-javascript.md
index efb4b2b..a26b329 100644
--- a/training/front-end/01-modern-javascript.md
+++ b/training/front-end/01-modern-javascript.md
@@ -127,6 +127,21 @@ const person2 = { ["first" + "Name"]: "Olympe" };
 console.assert(_.isEqual(person2, { firstName: "Olympe" }));
 // Btw, you can include quotes although nobody does this
 console.assert(_.isEqual(person2, { firstName: "Olympe" }));
+
+// Short form function
+const es5Object = {
+  say: function () {
+    console.log("hello");
+  },
+};
+es5Object.say()
+
+const es6Object = {
+  say() {
+    console.log("hello");
+  },
+};
+es6Object.say()
 ```
 
 ### Array
@@ -226,6 +241,16 @@ console.assert(myFunctionToBeShortenedArrowV2(1) === 1);
 
 ## Template literals
 
+```javascript
+const longString = `multi
+line
+string`;
+
+const name = "Louis";
+// Template interpolation
+const hello = `Hello ${name}`;
+```
+
 ### Template tags
 
 ## Loops
@@ -256,3 +281,4 @@ ES Module syntax:
 ## References
 
 - [ES5 to ESNext — here’s every feature added to JavaScript since 2015](https://www.freecodecamp.org/news/es5-to-esnext-heres-every-feature-added-to-javascript-since-2015-d0c255e13c6e/)
+- [ES2015 / ES6: Basics of modern Javascript](https://www.slideshare.net/WojciechDzikowski/es2015-es6-basics-of-modern-javascript)
diff --git a/training/front-end/05-front-end-development-practices.md b/training/front-end/05-front-end-development-practices.md
index 5460e39..ee78431 100644
--- a/training/front-end/05-front-end-development-practices.md
+++ b/training/front-end/05-front-end-development-practices.md
@@ -5,6 +5,7 @@
 - [Front-end development practices](#front-end-development-practices)
   - [Testing](#testing)
   - [Code style](#code-style)
+  - [Dependency management: npm or yarn](#dependency-management-npm-or-yarn)
 
 <!-- END doctoc generated TOC please keep comment here to allow auto update -->
 
@@ -13,3 +14,5 @@
 ## Testing
 
 ## Code style
+
+## Dependency management: npm or yarn
diff --git a/training/front-end/00-intro.md b/training/front-end/README.md
similarity index 82%
rename from training/front-end/00-intro.md
rename to training/front-end/README.md
index 6cec0c0..5aa25ea 100644
--- a/training/front-end/00-intro.md
+++ b/training/front-end/README.md
@@ -15,7 +15,7 @@
 
 ## Goal of this training
 
-This training was developed for back-end and infra developers.
+This training was developed for back-end and infra developers. It is meant to be used as a support for an oral presentation.
 
 I am not an expert in front-end development. This should only be considered an introduction.
 
@@ -25,7 +25,8 @@ Assumed knowledge:
 
 - HTTP
 - Basics about browser
-- Basic about HTML/CSS/JS
+- Basics about HTML and CSS
+- Basics about programming languages
 
 ## To do before the course
 
@@ -33,8 +34,11 @@ Read the [grab/front-end-guide](https://github.com/grab/front-end-guide) to get
 
 ## Curriculum
 
-1. Modern Javascript/TypeScript development
-2. Intro to React
+1. Modern Javascript
+2. TypeScript
+3. Intro to React
+4. CSS/HTML restart
+5. Front-end development practices
 
 ## Inspiration