JavaScript Design Patterns

20 Patterns for Advancing Your JavaScript Skills

   Watch Promo

You're passionate about your creation, you're hungry to create an amazing program. Don't waste time reinventing the wheel. JavaScript design patterns are one of the most powerful ways you can supercharge your capabilities as a creative developer.

This comprehensive video course empowered hundreds of developers to create better applications. Knowing what design patterns are and how to work with them enables you to become part of a developer community. In this course you will learn the language, understand its meaning and know when to use 20 of the most commonly used design patterns in JavaScript.

Why will this course supercharge your capacities?

When you know how to work with design patterns you gain access to years of experience of other developers.

Why will you gain access to years of experience of other developers?

Design patterns are in many ways the language that summarizes the advancement in developer thoughts. In many ways design patterns are the science of evolution in programming. By understanding how they work you gain the experience of millions of developers into your own projects.

What makes design patterns the science of evolution in programming?

Design patterns is the theory behind problem solving in programming. By knowing the different challenges developers face and commonly accepted solutions you elevate your personal capabilities to solve more advanced problems.

Why does knowing how to work with Design Patterns elevate your personal capabilities in solving complex problems?

When you drive a car it does not mean you can't walk anymore but it means you can now drive a car(and go faster and longer distances). Knowing design patterns is moving into the drivers seat in programming enabling you to not solve every problem on your own but instead rely on existing theory that has been tested out 1000s, and sometimes millions, of times.

Why do design patterns put you in the driver seat?

Knowing how to drive does not involve you knowing how to build cars ( or how to fix them). By driving a car you rely on the wisdom of others to improve your capabilities. Same is true with the programming language that your working in (your not using 0101 to code - that's the language of computers). Instead, you rely on JavaScript a language designed to make interactive scripting easy. In the same way, getting to know the common problems developers face and the best solutions to them (according to millions of people) enables you to solve problems without needing to understand them, enabling you to build upon the solutions of others and solve more complex problems.

Why you shouldn't want to solve every single problem on your own?

Solving problems is probably the most fun things you can do in life - and in programming. Solving problems is my personal meditation. Yet, if I tried to solve every problem without relying on pre-existing solutions the time I would need to spend on every project would make it impossible for me to create advanced projects (as I would always need to solve problems that take a lot of time - that have been solved many times before by others).

Why saving your time is important?

Your time is one of most valuable resource(and among the most expensive ones for corporations). If you solve every single problem without relying on common knowledge your time will be more expensive making you less profitable for the companies you work for. Imagine my time is worth $20 an hour, and I choose to solve a problem that million have solved already before - let's say it takes me about 100 hours to solve the problem - in other words just spent $2,000.

By working with a design pattern and advancing my skills to cut down the time it takes me to develop applications I increase the value of my time. In other words my hour just got more valuable to the companies I work for. Advanced developers make up to $500 an hour because they solve problems fast. While $500 an hour might sound like a lot, but if you can solve the same problem in 1 hour that someone else needs 100 – that actually makes your $500 an hour a bargain. Gain the wisdom of others, become a faster developer and ask for a raise.

Mediocre is okay, but mastery is better. Become a JavaScript Design Patterns master developer who understands the wonderful world of design patterns. Join 10,000 other students that have gained skills that change lives.

student reviews of JSDP ...I am instantly writing code differently...
Benjamin Cortes
All the information is very useful and actionable.
Marlene Lawal


Design patterns are intelligent, reusable strategies for solving common development problems faced by developers. For Web developers working with JavaScript, design patterns provide a tested, methodical plan of attack for tackling challenges that arise in real-world application development.

JavaScript Design Patterns: 20 Design Patterns for Expert JavaScript Programming will immerse you in the world of intelligent JavaScript programming , demonstrating to Web developers how to mobilize design patterns and presenting key programming concepts and common solutions to frequently occurring programming problems.

Reviews of JavaScript Design Patterns Taking my Javascript to the next level!
Sean Esteva
...I'm glad I took the course.
Chuck King

Exploring 20 different design patterns, this video course demonstrates the internal logic of each, while providing examples and real-world scenarios that developers can adopt and implement when programming in JavaScript.

The course opens by introducing the conceptual logic behind design patterns: what they are; what they are not; what makes a pattern; major pattern types; and what role they play in the bigger picture of Web development. We then dive straight into a real-world case study, building a mock application with in-built issues that design patterns can solve.

Following on from this introduction, the course quickly expands into exploring the core design patterns underlying the major JavaScript design pattern types: Creational, Structural, and Behavioral patterns. With the knowledge delivered throughout this course, you will be armed with a powerful skills arsenal for solving a wide array of different JavaScript programming problems.

review of JavaScript Design Patterns Course The course gives a strong explanation and practical application of the design patterns presented...
Bogdan Nenu

What you will learn from this video course

  • Master the logic behind the major design patterns, and wield them confidently for JavaScript programming
  • Understand how to modularize and condense code, optimize memory, and negotiate design problems
  • Explore Creational design patterns including the Singleton, Factory, and Prototype
  • Implement greater abstraction into application design, and control multiple objects sharing APIs with the help of Structural design patterns
  • Chain objects together and manage events and states using Behavioral design patterns
  • Ultimately deepen your understanding of JavaScript and understand how design patterns can make you a better, more effective programmer.

Is this course for you?

This course was designed for experienced JavaScript developers that want to upgrade their skills and become really amazing developers. As such, this course assumes you are comfortable with JavaScript and have familiarity with JavaScript OOP concepts.

If you want to become a better, smarter and better looking* developer this course is for you. Start learning now JavaScript Design Patterns.

*this Isn't legally binding. Yet, imagine how relaxed you would be if you could tap into the wisdom of millions of developers that have confronted the same problems you are confronting now days – that's got to be good for the skin.

Style and approach

This course adopts a problem-solution approach, demonstrating how to solve a wide array of real-world JavaScript programming problems using different design patterns. Replete with code examples and detailed explanations of the logic at play, the course helps viewers understand and practice the lessons taught.

Author biography

Ben Fhala discovered his passion for data visualization while he was working at Parsons in New York, in their data visualization department, PIIM. He is the owner of the online video training school,, and an Adobe ACP. He enjoys spending most of his time learning and teaching and has a love for visual programming and visualization in general. Ben has had the honor of developing applications for members of the US Congress, Prime Ministers, and Presidents around the world.

He has built many interactive experiences for companies such as Target, AT&T, Crayola, Marriott, Neutrogena, and Nokia. He has technically directed many award-winning projects and has been part of teams that have won three Agency of the Year awards. Among Ben's publications are Packt's HTML5 Graphing and Data Visualization Cookbook.

Your Instructor

Packt Publishing
Packt Publishing

Over the past ten years Packt Publishing has developed an extensive catalogue of over 3000 books, e-books and video courses aimed at keeping IT professionals ahead of the technology curve. From new takes on established technologies through to the latest guides on emerging platforms, topics and trends – Packt's focus has always been on giving our customers the working knowledge they need to get the job done. Our courses continue this tradition, bringing you comprehensive yet concise screencast tutorials straight from the experts.

Course Curriculum

Frequently Asked Questions

When does the course start and finish?
The course starts now and never ends! It is a completely self-paced online course - you decide when you start and when you finish.
How long do I have access to the course?
How does lifetime access sound? After enrolling, you have unlimited access to this course for as long as you like - across any and all devices you own.
Why are design patterns important?
Design patterns are the best way for developers to communicate common problems and solve them quicker. Instead of creating everything from scratch developers can share among them a rich library of common solutions to common problems. Using established design patterns many times simplifies your code making it easier for others to read and for yourself in the future. Even if you don't plan to use design patterns, Understanding when to use them and how they work will elevate your understandings as a developer.
When should I use design patterns?
One of the most common mistakes beginner developers have is not using design patterns at all or overusing them as a solution to every problem. In this course we will walk through the 20 most common design patterns and explain when are they a good idea to use and when would be harm your development. Development is an art so there is no hard-line answer, but as your experience grows through this training in our community so will your choices of when to use what design pattern and when to use none at all.
Is this course suitable for beginner developers?
No. This course is by far the most advanced course I've created to date. Be sure you have a solid foundation in JavaScript and object-oriented programming or get ready to dive really deep. Many students have mentioned that it took watching each video several times to really comprehend all the information provided. With that said, the course comes with unlimited community and teacher support through our commenting system. By mastering this course you will open up the gate to the most advanced programming techniques in JavaScript.

What are Design patterns?

The nature of progress is to try to find the easy way out of problems. Developers as problem solvers aim to create solutions that can be reusable. Some solutions are so specific that their code can be transported from one project to the next (and in many ways that's one of the major benefits behind Object Oriented Programming).

Yet not every problem can be solved into tangible code that can be reused many times; these solutions are concepts that have been scrutinized by the community of developers for a common problem facing their work. As such, design patterns are not a finished solution that is easily transferable but instead are a template to solve a problem that is common in development.

Some problems are so common that they relate to many languages while other patterns are more specifically related to the language and type of interface and situation.

A secondary advantage of knowing and working with design patterns is they create a common vocabulary enabling you to describe a very complex problem many times in one word.

Why is having a common language is important?

When developers speak in the same language it enables them to describe complex issues in one word. When you can describe a problem in a word or two you can more easily find solutions to problems. As such, building a common language among developers helps you develop better and gain the wisdom of the masses with little effort. In most scenarios, you will be able to find a solution to your problem with a quick search online (once you are armed with the name of the problem you are facing).

This common language enables more developers to scrutinize and test out the idea (find its problems and amend them) while documenting online possible solutions to these problems.

In this course you will learn what design patterns are and how to work with the 20 most common JavaScript design patterns.

JavaScript design pattern categories

There are hundreds of different design patterns. Yet in general we can categorize most design patterns into three separate groups. These groups are: creational, structural and behavioral.

Creational Design Patterns

Creational patterns are the focus of our first cluster of design patterns that we cover in the second chapter. Creational design patterns are design patterns that relate to the creation of objects. In this section, we will explore the core creational design patterns and among them the Singleton, Factory, Abstract Factory, Builder, and Prototype design patterns.

  • The Singleton Design Pattern
  • The Factory Design Pattern
  • The Abstract Factory Design Pattern
  • The Builder Design Pattern
  • The Builder Design Pattern Continued
  • The Prototype Design Pattern

Structural Design Patterns

While creational design patterns focus on one object at a time, strong world design patterns relate to the structure of your application holistically. Chapters 3 and 4 dive deep into the world of structural design patterns. The main objective of structural design patterns is to help communicate between different objects, by facilitating and enabling modular development. In other words, structural design patterns facilitate in connecting and replacing objects within an application.

  • Abstracting Our Singleton
  • The Adapter Design Pattern
  • The Composite Design Pattern
  • The Decorator Design Pattern
  • The Fly Weight Design Pattern
  • The Façade Design Pattern
  • Getting Things Working Again
  • The Bridge Design Pattern
  • The Proxy Design Pattern

Behavioral Design Patterns

While the two previous categories related to objects and the way they are positioned structurally within an application, behavioral design patterns focus on how objects communicate with each other and with that interface. The last chapter of this course is dedicated for behavioral design patterns. Behavioral design patterns focus on interactions between classes. In this section, we will only cover a handful of these types of design patterns, but there are many more of them.

  • The Chain of Responsibility – Part 1
  • The Chain of Responsibility – Part 2
  • The Observer Design Pattern – Adding and Dispatching Events
  • The Observer Design Pattern – Removing Events
  • The State Design Pattern

Course Key features

  • A deep exploration of 20 JavaScript design patterns.
  • Understand how to adopt and apply design patterns to a wide range of real world development scenarios.
  • Definitive coverage of the Creational, Structural, and Behavioral pattern types.
  • Take your JavaScript programming to an advanced level by understanding design patterns in depth.
  • Join a learning developer community of over 10,000 students.

Get started now!