Essentials in JavaScript ES6 - A Fun and Clear Introduction

webpack is a module bundler that runs babel, converting es6 into browser-ready javascript, and bundles files into one bundle.js with a live-reloading dev server.

Set up a Webpack 4 project from scratch, create a src/index.js, configure npm scripts for start and build, and bundle code into dist/main.js to run in the browser.

Configure Babel with Webpack to transpile ES6 to ES5, install Babel core, Babel loader, and env preset, set up .babelrc and Webpack rules, and verify the local development server.

Learn ES6 by coding together, using a GitHub repo for reference, and exploring the lectures folder to uncomment code, tackle exercises, and reuse the Webpack and package.json setup.

Discover how ES6 introduces let, replaces var for mutable variables, and enables block scoping with standalone blocks, including private-like variables demonstrated by a salary example.

Master the ES6 spread operator to manipulate arrays and objects, replace concat with spread, and simplify function arguments by gathering into arrays.

Destructuring assignment extracts values from arrays into separate variables, assigning them in order. It can pair with the spread operator to capture the remaining elements.

Master destructuring assignment with objects in es6 by extracting magical and power from a wizard object using shorthand syntax and matching left-hand names to object keys.

Explore arrow functions in ES6, highlighting their anonymous by default nature and how named identifiers can reference them, with examples using set timeout and a blastoff invocation.

Explore the map function in ES6 to create an array by applying a callback to each element, with add-one example on 10, 20, 30 and arrow function demonstrating one-line return.

Learn the ES6 filter method, using arrow functions to filter an array of scores to those >= 70, and compare it with map and other helper methods.

Explore JavaScript modules in ES6 by exporting and importing variables across files, using an example with a students array and a total count, and verifying results with console.log.

Explore exporting data and functions in ES6 by creating a calculator module with add and multiply, importing them, and using a default export for the main function.

Learn how to declare an ES6 class with a constructor and parameters, access properties with this, add a greet method using a template string, and create an instance with new.

Learn inheritance in ES6 classes by extending an entity into a Hobbit, using super to set name and height, and overriding greet with a Shire-specific message.

Explore ES6 in a practical mini React app, focusing on JSX, component rendering with ReactDOM, and setting up the project with npm install and babel preset.

Explore ES6 promises in a React app by fetching weather data from OpenWeatherMap for a city, using an API key, componentDidMount, and updating the description via state.