Laying the Foundation: Command Line and NPM
  • Command Line Crash Course
  • Set up NPM
  • Install NPM Packages
  • Use NPM Packages
  • Everything about NPM Package Versions
  • Everything You Need to Know about JSON
Babel 7
  • Installing Babel 7
  • Configure and use Babel 7
  • babel.config.js VS. .babelrc
  • Babel Polyfill
  • Babel Plugins
  • Babel 7 Review
Webpack 4 Stage 1: Basics and devServer
  • Get the starter files
  • Webpack 4 Set-up
  • Config file
  • Style Loader and CSS Loader
  • File Loader and publicPath
  • Plugins
  • Emergency update about the clean-webpack-plugin
  • watch mode, dev server, HMR
  • Use Packages
Stage 1 Review & Practice
  • Stage 1 Review
  • Get starter files
  • Stage 1 Practice 1: Set up Webpack
  • Stage1 Practice 2: Loaders
  • Stage 1 Practice 3: Plugins
  • Stage 1 Practice 4: Project Review
  • Stage 1 Practice 5: devServer & HMR
Webpack 4 Stage 2: Bundling for Higher Efficiency
  • Tree Shaking
  • Side Effects False
  • Merge Config File
  • Minifying CSS
  • Code Split
  • Lazy Loading
Stage 2 Review and Practice
  • Stage 2 Review
  • Stage 2 Practice 1: Minifying CSS
  • Stage 2 Practice 2: Code Splitting
  • Stage 2 Practice 3: Lazy Loading
Webpack Stage 3: Webpack + Babel
  • Shimming: adding GLOBAL objects
  • Babel-loader
  • Webpack + LESS
Stage 3 Review and Practice
  • Stage 3 Review
  • Stage 3 Practice 1: Babel-loader & Surprise
Get Source Code
  • Get Source Code
Important JavaScript Syntax
  • Difference between VAR and LET
  • Everything you need to know about LET
  • Constant
  • Temporal Dead Zone of LET and CONST
  • Application of LET
  • Closure
  • Application of Closure
  • Syntax of arrow function
  • THIS in an arrow function
  • Double-edged sword: problems solved and caused by arrow functions
Destructuring Assignment
  • Destructure array
  • Destructure object
  • Destructure string
  • Destructure number, boolean, null and undefined
  • Destructure function arguments
CommonJS and ES6 Module
  • What is CommonJS
  • The mechanism of CommonJS: the module object
  • Circular dependency
  • How CommonJS handles cache: require.cache
  • ES6 import and export
  • The difference between named export and dynamic export: dynamic reference
  • How to "import"
  • Named export
  • Default export