JavaScript Design Patterns for Web Apps

What are Design Patterns?

Maximiliano Firtman

Maximiliano Firtman

Independent Consultant
JavaScript Design Patterns for Web Apps

Check out a free preview of the full JavaScript Design Patterns for Web Apps course

The "What are Design Patterns?" Lesson is part of the full, JavaScript Design Patterns for Web Apps course featured in this preview video. Here's what you'd learn in this lesson:

Max explains design patterns are reusable templates for solving common software design problems, enhancing code readability and efficiency, and creating a common vocabulary.

Preview
Close
Get $100 Off
Get $100 Off!

Transcript from the "What are Design Patterns?" Lesson

[00:00:00]
>> Maximiliano Firtman: Let's get directly into the topic. So we will talk about design patterns, right? So, let's start with the definition, what's a design pattern? So, let me, before reading this, the simplest way to analyze or define a design pattern is like a recipe to solve a problem, okay?

[00:00:19]
So, but it's a reusable template for solving common software design problems, enhancing covid ability and efficiency and creating a common vocabulary. I think the last part is important, so when we are using a design pattern, we are naming that pattern. And then we can talk to our colleagues and say, hey, I'm going to implement x pattern, and the other colleague might immediately understand what I'm saying.

[00:00:48]
So, design patterns are creating vocabulary, common vocabulary among developers, okay? And that's one of the important parts of using design partners as, apart from solving the problem, right? The idea is to solve a problem. So most of the time we have a problem. And if you are a JavaScript developer and you have experience doing Vanilla JavaScript apps, then you have probably encountered a lot of problems, that you're, a lot of questions like, I have a problem here, how should I solve this?

[00:01:23]
Because when I'm using React, or when I'm using Angular, there is solved in this or that way. But now, in Vanilla JavaScript, I don't have a way to do that based on the framework, because there is no framework I can do whatever I want. So the design pattern will guide me through a path to actually solve the problem.

[00:01:45]
Design patterns are actually coming from architecture from the 70s, the term, the idea on architecture when you were building, I don't know, an apartment. You are designing an apartment, they were designed patterns for solving issues. For example, let's say, I have a corner that is really small, I need to put a bathroom there.

[00:02:09]
Okay, so someone created a design pattern for that saying, okay, maybe you should put the toilet here, and then the door there, and so on. That was the design pattern, was a recipe, okay, for architects when they were designing buildings, and apartments, and houses, the idea come from there from the 70s.

[00:02:31]
And then, actually it's exactly, I think, 30 years ago. 30 years ago, this book appear for software design patterns, element of reusable object oriented software. So, this book Took the idea of design patterns into software development, okay? It was the first one that was talking about that and if you have heard about the Gang of Four, okay?

[00:03:03]
Gang of Four is actually these four authors, authors that were actually publishing this book, and they created here a lot of the design patterns. The latest version is actually 23 design patterns on software design, so this is not our web apps, it was 30 years ago before the web, before JavaScript actually close to that.

[00:03:24]
But it's before we were actually using JavaScript for web apps. So, it was, but it was for object oriented software, okay? So, the original idea and most of these design patterns were prepared and organized for an object oriented language. Maybe I have a question for you. Is JavaScript an object-oriented language or not?

[00:03:47]
Only if you mean to it. Only if you're mean to it, well, that's a good answer, actually. So, I mean, it's not a strict object-oriented language, it's prototype-based. We can emulate most of the object-oriented ideas, most of them, not all of them. Even with modern ECMAScript, for example, you cannot quickly or easily emulate protected properties or methods, that's one thing that it's almost impossible to create.

[00:04:17]
But anyway, because JavaScript is not really an object-oriented software. If you read this book, I mean, you may want to implement some of those design patterns, and you will find some issues, okay? So have that in mind. But anyway, this book was the, let's say, initial push into talking about design patterns with web-making software.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now