braindump

Modern JS: Curso para Egghead en español

Declaracion de variables

Pains

• What is the scope of variables in JavaScript? - Stack Overflow
  • not knowing the scope of a variable
• Difference between variable declaration syntaxes in Javascript (including global variables)? - Stack Overflow
  • very extensive explanation of variable declarations
• What does the construct x = x || y mean? - Stack Overflow

Information to cover

• var
• let
• const
• block scope
• logical operators in variable assignment (||, ??)
• optional chaining

• event loop

• [[template-literals]]
• [[tagged-template-literals]]
• [[trimming-and-padding]]

Possible topics to write about

• difference between arrow functions and function expressions
  • Arrow Functions in JavaScript - ui.dev
• WTF is the this keyword
  • Understanding the “this” keyword, call, apply, and bind in JavaScript - ui.dev
• clean your function with default parameters
• Understanding JavaScript scopes
• Hoisting
  • The Ultimate Guide to Hoisting, Scopes, and Closures in JavaScript - ui.dev
• use babel to see to what the new features translate to (es2020 → es5)
• JavaScript Modules: Do we need to explain IFEES in 2021?
  • JavaScript Modules: From IIFEs to CommonJS to ES6 Modules - ui.dev
• function expressions vs function declarations
  • Shorthand Property and Method Names in JavaScript | ES6 - ui.dev
  • difference in the chrome devtools
• ES Modules
  • ES Modules in Depth - ui.dev
• Template literals
  • Template Literals (Template Strings) in JavaScript - ui.dev
• JavaScript prototype
  • A Beginner’s Guide to JavaScript’s Prototype - ui.dev
  • JavaScript Inheritance and the Prototype Chain - ui.dev
• Async JavaScript
  • Async JavaScript: From Callbacks, to Promises, to Async/Await - ui.dev
• JS Class Fields
  • JavaScript Private and Public Class Fields - ui.dev
• variable types
  • var vs let vs const in JavaScript - ui.dev
• Composition vs Inheritance
  • JavaScript Inheritance vs Composition - ui.dev
• Computed Property names (obj[‘foo’])
  • Computed Property Names in JavaScript - ui.dev
• create your own implementation of X
  • Creating your own implementation of Array - ui.dev

Keywords

• Lexical scope or static scoping
• Closures
• Scope: region of a codebase over whichan identifier is valid

Resources & References

• https://twitter.com/hhg2288/status/1390247754828599298
• Short-circuit evaluation - Wikipedia
• Optional chaining (?.) | MDN
• JavaScript: What is short-circuit evaluation? | by Brandon Morelli | codeburst
• [[Getting Started with JavaScript, v2 with Kyle Simpson]]
• Functional-Light JavaScript, v3 with Kyle Simpson
• Compiling vs Polyfills with Babel (JavaScript) - ui.dev
• How to check for undefined in JavaScript - ui.dev
• How to add an item to the end of an Array in JavaScript - ui.dev
• Primitive vs Reference Values in JavaScript - ui.dev
• ES Modules in Depth - ui.dev

next steps

• break down the outline into lessons
• create the actual content
• follow Matias structures
  • por leccion
    • intro
    • primeros pasos
    • objetivos
    • ejercicio
    • puntos extra
    • feedback
      • make it very actionable
• focus on the content
• workshop format
  • intro
  • challenge
  • show the solution
• write down all the lesson goals first

example:

• pilar 1
  • lesson 1
  • lesson 2
  • lesson 3
• pilar 2
  • lesson 4
  • lesson 5
  • lesson 6 …