Introduction

[00:00:00]
>> Hi everyone, welcome to this workshop on design patterns. I'm Lydia Hallie, I'm a staff developer advocate at Vercel. And in my free time, I really enjoy writing about technical concepts, especially JavaScript. And I like to do that in kinda like visualized way, so creating animations to get a better understanding of what's actually going on under the hood.

[00:00:19]
And back in 2020, I collaborated together with Addy Osmani on a project called Patterns. And this is actually related to a book that he published back in 2012, which was incredible. But as you can imagine, back in 2012 or the JavaScript ecosystem was pretty different than what it is nowadays.

[00:00:36]
So I collaborated with him to kind of give this a modern perspective using the ES15 syntax, and also including React patterns, design patterns, rendering patterns, performance patterns. So in this workshop, I'll be covering design patterns, React patterns, performance patterns, and rendering patterns. And for this workshop I've created a website hosted on javascriptpatterns.vercel.app.

[00:01:00]
So if you want to follow along and do the exercises, make sure to visit this website. And for the exercises, I'm using StackBlitz. Now, you don't need to have an account for that, which is pretty nice. I just didn't wanna have to deal the environment setup, all of that stuff.

[00:01:15]
So when you're doing an exercise and you wanna get it on a bigger screen, just to quickly show, you can just click on here and you actually see it open up a bit bigger, bigger font size and all that stuff. So design patterns are concepts that we can use to solve or at least solve in a performant way, commonly recurring issues in software architecture.

[00:01:36]
Now, before I get started with all the patterns that we'll be covering today, they aren't just a checklist. It's not like, these are the patterns that will make your app performant, so just implement this in your app right away, that's not how it works. I'm just here kind of to raise awareness, hey, these patterns exist.

[00:01:52]
These are commonly recurring issues or minor problems that might affect your app's performance pretty badly. So maybe in the future, if you ever run into an issue with your software architecture, you're like, hey, wait a second, I've learned this, I've heard about this issue, I believe I can use this pattern to solve this.