Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Design Patterns
Search
Otemuyiwa Prosper
August 13, 2017
Programming
5
290
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
550
The Complete Guide to building In-App Notifications in Web Apps
unicodeveloper
0
310
The Golden Ticket: Becoming a Superstar & Impactful Open Source Contributor
unicodeveloper
0
130
Optimizing Developer Workflow with Sourcegraph
unicodeveloper
0
180
Code Search with Laravel and Sourcegraph
unicodeveloper
1
320
Lightning Talk - JAMStack
unicodeveloper
0
740
Engineering Faster Web Experiences in Plain Sight
unicodeveloper
0
240
Authentication & Authorization in GraphQL
unicodeveloper
5
2k
Authentication & Authorization in Next.js
unicodeveloper
3
820
Other Decks in Programming
See All in Programming
エンジニアが挑む、限界までの越境
nealle
1
340
AIコーディングエージェントを 「使いこなす」ための実践知と現在地 in ログラス / How to Use AI Coding Agent in Loglass
rkaga
4
1.5k
Duke on CRaC with Jakarta EE
ivargrimstad
1
240
監視 やばい
syossan27
12
10k
In geheimer Mission: AI Agents entwickeln
joergneumann
0
120
JAWS DAYS 2025 re_Cheers: WEB
komakichi
0
120
AWS Summit Hong Kong 2025: Reinventing Programming - How AI Transforms Our Enterprise Coding Approach
dwchiang
0
150
事業KPIを基に価値の解像度を上げる
nealle
0
150
iOSアプリで測る!名古屋駅までの 方向と距離
ryunakayama
0
160
“技術カンファレンスで何か変わる?” ──RubyKaigi後の自分とチームを振り返る
ssagara00
0
150
파급효과: From AI to Android Development
l2hyunwoo
0
170
AIコーディングの本質は“コード“ではなく“構造“だった / The essence of AI coding is not “code” but "structure
seike460
PRO
2
530
Featured
See All Featured
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
41
2.3k
A Tale of Four Properties
chriscoyier
159
23k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
160
15k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
5
620
Build your cross-platform service in a week with App Engine
jlugia
231
18k
Building a Scalable Design System with Sketch
lauravandoore
462
33k
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
233
17k
The Language of Interfaces
destraynor
158
25k
For a Future-Friendly Web
brad_frost
177
9.7k
GitHub's CSS Performance
jonrohan
1031
460k
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!