About the course
JavaScript has evolved from a simple scripting language into a sophisticated, multi-paradigm powerhouse. To build effectively with modern frameworks like React, Vue, or Node.js, developers must move beyond legacy "jQuery-era" patterns and embrace a declarative, functional approach. This workshop provides a rigorous transition into modern development, focusing on writing clean, expressive, and high-performance code that leverages the latest ECMAScript standards.
We prioritize the Modern Toolchain and Functional Patterns. You will move from imperative logic to declarative code using advanced array methods, destructuring, and spread syntax. A significant portion of the course is dedicated to the "Asynchronous Revolution," ensuring you can manage complex data flows using Promises and Async/Await without falling into legacy callback traps. By the end of this course, you will have a deep understanding of the JavaScript engine, module resolution, and the architectural shifts required for professional-grade development.
By covering the core modern language features, essential async patterns, browser interaction, and necessary tooling, this workshop provides the fundamental knowledge and practical skills with JavaScript that serve as a great starting point for further exploration of topics such as TypeScript, backend development with Node.js, and popular frameworks like React and Angular.
Instructor-led online and in-house face-to-face options are available - as part of a wider customised training programme, or as a standalone workshop, on-site at your offices or at one of many flexible meeting spaces in the UK and around the World.
-
By the end of this course, attendees will be able to:
- Transition to Declarative Logic: Replace verbose loops and conditional logic with expressive array methods (map, filter, reduce).
- Master Scope & Context: Understand the nuances of Block Scope, Lexical 'this', and the "Temporal Dead Zone."
- Architect with ES Modules: Build modular, maintainable applications using native ESM (import/export) syntax.
- Control Asynchronous Flow: Build resilient data-fetching logic using Promises, Async/Await, and the Fetch API.
- Modern Object Manipulation: Utilize Destructuring, Spread/Rest operators, and Property Shorthands to write leaner code.
- Tooling & Environment: Understand the role of Vite, SWC/Babel, and modern runtimes in the development lifecycle.
-
This 4-day workshop is designed for experienced software developers who are new to the JavaScript language or need to update their skills to Modern JavaScript for use with contemporary frameworks like React, Angular, or Vue. It is ideal for:
Legacy JS Developers: Those comfortable with older JavaScript (ES5) looking to modernize their skillset.
Backend Engineers: C#, Java, or Python developers who need to master the unique "event-loop" nature of JavaScript.
Web Designers: Individuals with basic JS knowledge who want to progress toward framework-ready engineering.
-
Participants should have:
A solid grasp of HTML and CSS.
Basic prior experience with JavaScript or another programming language (e.g. using variables, loops, and basic functions).
Comfort using the Command Line (CLI) for basic tasks.
We can customise the training to match your team's experience and needs - with more time and coverage of fundamentals for new developers, or a swifter pace / focus on specific topics for experienced coders.
-
This JavaScript course is available for private / custom delivery for your team - as an in-house face-to-face workshop at your location of choice, or as online instructor-led training via MS Teams (or your own preferred platform).
Get in touch to find out how we can deliver tailored training which focuses on your project requirements and learning goals.
-
The Modern Foundation & Scope
The Evolution of JS: From the "Dark Ages" of ES5 to the yearly TC39 release cycle.
Variable Scoping & Memory: Master let and const, block scoping, and the "Temporal Dead Zone."
Functional Foundations: Arrow Functions, lexical this binding, and solving the "callback hell" of the past.
Template Literals & Beyond: Multi-line strings, expression interpolation, and an intro to Tagged Templates.
Enhanced Object Literals: Property shorthands, computed names, and method definitions.
Safety Patterns: Defensive coding with Nullish Coalescing (??) and Optional Chaining (?.).
Data Handling & Asynchronicity
Data Extraction Patterns: Mastery of Object and Array Destructuring (nested and aliased).
The Power of Three Dots: Spread and Rest operators for immutable data updates.
The JS Runtime Deep-Dive: Visualizing the Stack, Heap, Task Queue, and Microtask Queue.
The Event Loop: How JavaScript handles high concurrency on a single thread.
The Promise Lifecycle: Chaining, Promise.all, Promise.allSettled, and Promise.any.
Asynchronous Flow Control: Writing "Sync-style" code with async/await and robust error handling.
The Modern Fetch API: Modern patterns for RESTful communication and AbortControllers.
Functional Programming & Modern Classes
The Immutability Mindset: Why constant data structures are the key to modern UI performance (React/Vue).
Higher-Order Functions: Mastery of map, filter, reduce, find, some, and every.
Pure Functions & Side Effects: Writing code that is easy to unit test.
Practical Functional JS: Pipe and Compose patterns for processing complex JSON datasets.
Modern Class Syntax: Constructors, methods, and inheritance (extends/super).
Encapsulation & Privacy: Using the new # private field syntax for true data hiding.
Under the Hood: Understanding the Prototype Chain and how it relates to modern Class syntax.
The Modern Ecosystem & Architecture
ES Modules (ESM): Architecting apps with import/export, default vs. named exports.
Performance Optimization: Dynamic imports and code-splitting strategies.
The Modern Toolchain: Transitioning from Webpack/Babel to the high-speed world of Vite, ESBuild, and SWC.
Node.js & Runtimes: A high-level overview of JS on the server (Node vs. Bun vs. Deno).
The Framework Landscape: Choosing your path—React (Functional/Hooks), Angular (Signals), or Vue (Composition).
The TypeScript Shift: Why "Type Safety" is now the industry default for professional JS teams.
State Management Patterns: From Redux to modern "Signal-based" reactivity.
-
MDN Web Docs (JavaScript Guide and Reference): The comprehensive, canonical resource for JavaScript.
Node.js Documentation: Official documentation for the JavaScript runtime environment.
NPM Documentation: Official documentation for the Node package manager.
Babel Documentation: Official documentation for the popular JavaScript transpiler.
Jest Documentation: Official documentation for a widely used JavaScript testing framework.
Trusted by