Practical Web App Patterns with Vanilla JS

Practical Web App Patterns with Vanilla JS

English | MP4 | AVC 3840×2160 | AAC 44KHz 2ch | 34 Lessons (4h 25m) | 1.70 GB

Spend a full day learning practical web application design patterns in Vanilla JS

In this workshop, you will learn design patterns for frontend projects using JavaScript. You will understand the advantages and challenges of design patterns, and how to implement many design patterns to improve readability, reusability, modularity, and scalability of your Vanilla JavaScript projects.

You will understand how to implement classic and modern design patterns applicable in frontend development, achieving better scalability in data and app state management, and improving the user experience.

The agenda includes design patterns for SPAs, MPAs, data, state management, and some advanced ideas that you can start implementing in your projects if applicable.

You’ll learn:

  • Write reusable and more maintainable code
  • Improve the developer experience of writing web apps
  • Learn the classic and modern design patterns you can apply in frontend apps
  • Get better scalability in data and app state management
  • Improve the user experience when using Vanilla JavaScript
Table of Contents

1 Introduction
2 What are Design Patterns
3 Components of a Design Pattern
4 Design Patterns for VanillaJS Web Apps
5 Classic Patterns
6 Singleton Factory Patterns
7 Decorator Pattern
8 Adapter Mixin Value Object Patterns
9 Observer Template Method Patterns
10 Memento Command Patterns
11 Todo Masters Project Setup
12 ECMAScript Modules globalThis
13 Observer Pattern with Mixins
14 Creating the Data Classes
15 Adding TodoList Methods
16 Add Delete Commands
17 Rendering TodoList Items
18 Saving Todos in LocalStorage
19 Adding Keyboard Shortcuts
20 Undo with Memento Pattern
21 Single Page Application Patterns
22 Coffee Masters Project Tour
23 Lazy Loading JavaScript Components
24 View Transitions
25 Morphing Elements Between Pages
26 HTML Template Interpolation
27 Routing Metadata
28 Multi-Page Application Patterns
29 Cooking Masters Project Tour
30 Prefetch Prerender
31 Promisify Flux Redux Patterns
32 Lazy Sync Proxy Middleware Patterns
33 Advanced Ideas
34 Wrapping Up

Homepage