Design Patterns in JavaScript
4.4 (255 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
2,714 students enrolled

Design Patterns in JavaScript

Discover the modern implementation of design patterns in JavaScript
4.4 (255 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
2,714 students enrolled
Created by Dmitri Nesteruk
Last updated 6/2019
English
English [Auto-generated]
Current price: $64.99 Original price: $99.99 Discount: 35% off
1 day left at this price!
30-Day Money-Back Guarantee
This course includes
  • 10 hours on-demand video
  • 74 downloadable resources
  • 22 coding exercises
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • Recognize and apply design patterns
  • Refactor existing designs to use design patterns
  • Reason about applicability and usability of design patterns
Course content
Expand all 103 lectures 10:03:10
+ Introduction to Object-Oriented JavaScript
2 lectures 09:35

A look at what we're going to learn in this course.

Your first lecture is outside of a section. Create a section to hold this lecture. — umm, no, no I won't.

Preview 06:17

Some info about JavaScript, Node.js, Jasmine and WebStorm — the things used to present this course.

Preview 03:18
+ SOLID Design Principles
7 lectures 01:07:08

An overview of the SOLID design principles.

Overview
00:52

SRP: a class should have one reason to change.

Single Responsibility Principle
09:10

OCP: classes should be open for extension, but closed for modification.

Preview 17:46

LSP: if a function or method takes a parent type, it should be able to take a derived type and continue working properly.

Liskov Substitution Principle
10:15

ISP: don't put too much into interfaces. Then again, JS doesn't have interfaces.

Interface Segregation Principle
11:17

DIP: high-level modules should not depend on low-level modules; they should instead depend on abstractions.

Dependency Inversion Principle
15:22

A summary of the things we've learned about SOLID. Admittedly, some of them are less applicable to JavaScript than others.

Summary
02:26
+ Builder
5 lectures 35:36

A brief note about the three categories of design patterns: creational, structural and behavioral.

Gamma Categorization
03:36

An overview of the Builder design pattern.

Overview
01:20

A look at the implementation of the Builder pattern.

Builder
16:47

Multiple builders working together.

Builder Facets
12:52
Builder Coding Exercise
1 question

A summary of the things we've learned about the Builder design pattern.

Summary
01:01
+ Factory
5 lectures 34:20

An overview of the Factory design pattern.

Overview
02:43

We look at why a factory method can be more convenient than a constructor.

Factory Method
09:42

If we move all the factory methods into a separate class, we get... a factory!

Factory
04:44

Hierarchies of types can have corresponding hierarchies of factories. And yes, JS doesn't have 'abstract' classes.

Abstract Factory
16:08
Factory Coding Exercise
1 question

A summary of the things we've learned about the Factory design pattern.

Summary
01:03
+ Prototype
5 lectures 31:17

An overview of the Prototype design pattern.

Overview
01:54

The most direct way of cloning objects is to do it manually. But does it scale?

Explicit Copying
07:39

Serializers help us write entire object graphs to a string. So a serialize-deserialize cycle lets us fully clone an object including all its members.

Preview 13:39

A factory that makes it convenient to reuse prototypes.

Prototype Factory
07:21
Prototype Coding Exercise
1 question

A summary of all that we've learned about the Prototype design pattern.

Summary
00:44
+ Singleton
5 lectures 31:37

An overview of the Singleton design pattern.

Overview
03:31

A basic implementation of Stringleton that basically gets the constructor to return one instance on each call.

Singleton Implementation
05:48

A weird (and not very practical) implementation of Monostate that lets you make multiple instances but they all share the same data.

Monostate
05:01

A look at why the Singleton is so hated and how these problems can be overcome.

Singleton Problems
15:07
Singleton Coding Exercise
1 question

A summary of the things we've learned about the Singleton design pattern.

Summary
02:10
+ Adapter
4 lectures 20:22

An overview of the Adapter design pattern.

Overview
01:12

Let's build an adapter for a (somewhat contrived) scenario!

Adapter
11:02

Some adapter generates temporary objects. Let's see how we can avoid extra work using caching.

Adapter Caching
07:12
Adapter Coding Exercise
1 question

A summary of what we've learned about the Adapter design pattern.

Summary
00:56
+ Bridge
3 lectures 15:07

An overview of the Bridge design pattern.

Overview
04:19

Let's go build a Bridge!

Bridge
09:12
Bridge Coding Exercise
1 question

A summary of the things we've learned about the Bridge design pattern.

Summary
01:36
+ Composite
4 lectures 23:50

An overview of the Composite design pattern.

Overview
02:27

Grouping geometric shapes is something you'd do in a drawing app. Let's implement this and get the Composite pattern in it, too!

Geometric Shapes
08:26

Instead of using a base class, let's see if we can get scalars to behave as collections.

Neural Networks
11:06
Composite Coding Exercise
1 question

A summary of what we've learned about the Composite design pattern.

Summary
01:51
+ Decorator
3 lectures 14:20

An overview of the Decorator design pattern.

Overview
02:35

Let's build a Decorator!

Decorator
10:37
Decorator Coding Exercise
1 question

A summary of the things we've learned about the Decorator design pattern.

Summary
01:08
Requirements
  • Good understanding of JavaScript
  • Familiarity with latest JavaScript language features
  • Good understanding of object-oriented design principles
  • A computer with latest JS and NodeJS versions and (hopefully) an IDE
Description

Course Overview

This course provides a comprehensive overview of Design Patterns in JavaScript from a practical perspective. This course in particular covers patterns with the use of:

  • The latest versions of the JavaScript programming language

  • Use of modern programming libraries and frameworks

  • Use of modern developer tools such as JetBrains WebStorm

  • Discussions of pattern variations and alternative approaches

This course provides an overview of all the Gang of Four (GoF) design patterns as outlined in their seminal book, together with modern-day variations, adjustments, discussions of intrinsic use of patterns in the language.

What are Design Patterns?

Design Patterns are reusable solutions to common programming problems. They were popularized with the 1994 book Design Patterns: Elements of Reusable Object-Oriented Software by Erich Gamma, John Vlissides, Ralph Johnson and Richard Helm (who are commonly known as a Gang of Four, hence the GoF acronym).

The original book GoF book used C++ and Smalltalk for its examples, but, since then, design patterns have been adapted to every programming language imaginable: C#, Java, Swift, Python and now — JavaScript!

The appeal of design patterns is immortal: we see them in libraries, some of them are intrinsic in programming languages, and you probably use them on a daily basis even if you don't realize they are there.

What Patterns Does This Course Cover?

This course covers all the GoF design patterns. In fact, here's the full list of what is covered:

  • SOLID Design Principles: Single Responsibility Principle, Open-Closed Principle, Liskov Substitution Principle, Interface Segregation Principle and Dependency Inversion Principle

  • Creational Design Patterns: Builder, Factories (Factory Method and Abstract Factory), Prototype and Singleton

  • Structrural Design Patterns: Adapter, Bridge, Composite, Decorator, Façade, Flyweight and Proxy

  • Behavioral Design Patterns: Chain of Responsibility, Command, Interpreter, Iterator, Mediator, Memento, Observer, State, Strategy, Template Method and Visitor

Who Is the Course For?

This course is for JavaScript developers who want to see not just textbook examples of design patterns, but also the different variations and tricks that can be applied to implement design patterns in a modern way. For example, the use of Symbol.iterator allows objects (including iterator objects) to be iterable and lets scalar objects masquerade as if they were collections.

Presentation Style

This course is presented as a (very large) series of live demonstrations being done in JetBrains WebStorm and presented using the Kinetica rendering engine. Kinetica removes the visual clutter of the IDE, making you focus on code, which is rendered perfectly, whether you are watching the course on a big screen or a mobile phone. 

Most demos are single-file, so you can download the file attached to the lesson and run it in WebStorm, Atom or another IDE of your choice (or just run them from the command-line).

This course does not use UML class diagrams; all of demos are done via live coding.

Who this course is for:
  • Software engineers
  • Web developers
  • Designers
  • Architects