Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Design Patterns
Search
Otemuyiwa Prosper
August 13, 2017
Programming
5
300
Design Patterns
Otemuyiwa Prosper
August 13, 2017
Tweet
Share
More Decks by Otemuyiwa Prosper
See All by Otemuyiwa Prosper
A.I (Artificial Intelligence) for the rest of us
unicodeveloper
2
580
The Complete Guide to building In-App Notifications in Web Apps
unicodeveloper
0
330
The Golden Ticket: Becoming a Superstar & Impactful Open Source Contributor
unicodeveloper
0
150
Optimizing Developer Workflow with Sourcegraph
unicodeveloper
0
190
Code Search with Laravel and Sourcegraph
unicodeveloper
1
360
Lightning Talk - JAMStack
unicodeveloper
0
780
Engineering Faster Web Experiences in Plain Sight
unicodeveloper
0
270
Authentication & Authorization in GraphQL
unicodeveloper
5
2.1k
Authentication & Authorization in Next.js
unicodeveloper
3
860
Other Decks in Programming
See All in Programming
AIコーディングエージェント(Gemini)
kondai24
0
220
マスタデータ問題、マイクロサービスでどう解くか
kts
0
100
バックエンドエンジニアによる Amebaブログ K8s 基盤への CronJobの導入・運用経験
sunabig
0
160
ID管理機能開発の裏側 高速にSaaS連携を実現したチームのAI活用編
atzzcokek
0
230
sbt 2
xuwei_k
0
300
Findy AI+の開発、運用におけるMCP活用事例
starfish719
0
360
Building AI Agents with TypeScript #TSKaigiHokuriku
izumin5210
6
1.3k
dotfiles 式年遷宮 令和最新版
masawada
1
770
20251212 AI 時代的 Legacy Code 營救術 2025 WebConf
mouson
0
160
愛される翻訳の秘訣
kishikawakatsumi
3
320
251126 TestState APIってなんだっけ?Step Functionsテストどう変わる?
east_takumi
0
320
Cap'n Webについて
yusukebe
0
130
Featured
See All Featured
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
How To Stay Up To Date on Web Technology
chriscoyier
791
250k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
130k
Typedesign – Prime Four
hannesfritz
42
2.9k
Bootstrapping a Software Product
garrettdimon
PRO
307
120k
Large-scale JavaScript Application Architecture
addyosmani
515
110k
The Cost Of JavaScript in 2023
addyosmani
55
9.3k
Statistics for Hackers
jakevdp
799
230k
Code Reviewing Like a Champion
maltzj
527
40k
Bash Introduction
62gerente
615
210k
For a Future-Friendly Web
brad_frost
180
10k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.8k
Transcript
Design Patterns Ruby Conf. Nigeria
❖ Software Developer ❖ Consultant at Auth0 ❖ Open Sourcerer
❖ Self-Acclaimed Developer Evangelist ❖ Community Builder ❖ Jollof Rice Ambassador ❖ Google Developer Expert ❖ Homeless Man
@unicodeveloper - GitHub - Twitter
...When no design pattern is involved.
None
...After you involve design patterns.
None
..A few things to note, thou developer
1. Design patterns are not a silver bullet to all
your problems.
2. Design patterns was made for man, not man for
design patterns.
3. They can prove to be a savior, or else
they can make you & your code a mess.
Design Patterns Grouped 1 2 ❖ Behavioral ❖ Creational ❖
Structural
Behavioral Design Patterns 1 3 ❖ Mediator ❖ Observer ❖
Strategy ❖ Visitor ❖ Iterator ❖ Command
Creational Design Patterns 1 4 ❖ Builder ❖ Prototype ❖
Singleton ❖ Factory ❖ Abstract Factory
Structural Design Patterns 1 5 ❖ Facade ❖ Composite ❖
Decorator ❖ Flyweight ❖ Adapter ❖ Bridge
..Know JavaScript? I’ll use it as an example to explain
the common design patterns that you should know & take advantage of in your codebase.
Singleton Pattern
Goals 1. Ensure that only one instance of a class
is created. 2. Provide a global point of access to the object.
Singleton 1 9
Singleton 2 0 What makes the Singleton is the global
access to the instance.
Prototype Pattern
Goals 1. Specify the kind of objects to create using
prototypical instance. 2. Create new objects by copying this prototype
Prototype 2 3
Prototype 2 4
Command Pattern
Goals 1. Encapsulate the request in an object 2. Allow
the parameterization of clients with different requests.
Command 2 7
Command 2 8 What if the core API of carManager
changed? What happens?
Facade Pattern
Goals 1. Outward appearance to the world which hides a
different reality. 2. Simpler public interface to avoid calling many internal methods to get some behavior working. 3. Ability to directly interact with subsystems in a way that can be less prone to accessing it directly.
Facade 3 1
Facade 3 2 JQuery’s document.ready() function is being powered by
bindReady()
Factory Pattern
Goals 1. Creates objects without exposing the instantiation logic to
the client. 2. Refer to newly created object through a common interface.
Factory 3 5
Factory 3 6
The Mixin Pattern
Goals 1. Allow objects to borrow functionality with a minimal
amount of complexity.
Mixin 3 9
Mixin 4 0
Decorator Pattern
Goals 1. Similar to Mixins. Aim to promote code reuse
2. Offer ability to add behaviour to existing classes in a system dynamically.
Decorator 4 3 Simple Use case
Decorator 4 4
Decorator 4 5 Decorating objects with multiple decorators
Module Pattern
Goals 1. Emulate the concept of classes. 2. Shield particular
parts from global scope and make everything simple.
Module 4 8
Module 4 9
Observer Pattern
Goals 1. Define a one to many dependency between objects
so that when one object changes state, all its dependents are notified and updated automatically.
Observer 5 2
Observer 5 3
Observer 5 4
Observer 5 5
Observer 5 6
Observer 5 7
Learning Resource http://www.oodesign.com/observer-pattern.html https://addyosmani.com/resources/essentialjsdes ignpatterns/book/
Thank You!