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
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
Otemuyiwa Prosper
August 13, 2017
Programming
330
6
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Design Patterns
Otemuyiwa Prosper
August 13, 2017
More Decks by Otemuyiwa Prosper
See All by Otemuyiwa Prosper
A.I (Artificial Intelligence) for the rest of us
unicodeveloper
2
630
The Complete Guide to building In-App Notifications in Web Apps
unicodeveloper
0
360
The Golden Ticket: Becoming a Superstar & Impactful Open Source Contributor
unicodeveloper
0
180
Optimizing Developer Workflow with Sourcegraph
unicodeveloper
0
230
Code Search with Laravel and Sourcegraph
unicodeveloper
1
420
Lightning Talk - JAMStack
unicodeveloper
0
840
Engineering Faster Web Experiences in Plain Sight
unicodeveloper
0
320
Authentication & Authorization in GraphQL
unicodeveloper
5
2.2k
Authentication & Authorization in Next.js
unicodeveloper
3
920
Other Decks in Programming
See All in Programming
ADKを使って簡単にAIエージェントを作ってみよう
k1mu21
0
290
OS アップデート対応の取り組み方がもっと共有されてほしい
andpad
0
110
Vue × Nuxt × Oxc どこまで使える?実運用の現在地
andpad
0
360
Webフレームワークの ベンチマークについて
yusukebe
0
200
例外の正しい扱い方 そのエラー try-catchして大丈夫?
jinwatanabe
0
340
SREは、MCPとSRE Agentをこう使え!
kazumax55
0
150
なぜ型を書くのか? TSKaigi2026で改めて考える #tskaigi_smarthr
kajitack
0
210
Performance Engineering for Everyone
elenatanasoiu
0
260
TSKaigi Night Talks 2026_TypeScriptでサプライチェーンの整合性を型に閉じ込める
geekplus_tech
0
430
Generative UI & AI-Assistants for Your Angular Solutions
manfredsteyer
PRO
0
140
Snowflake Summitでの新機能 CoCo / CoWork / snowflake-summit-2026-overall-what-new-coco
tatsuhiro
1
220
AIキャラアプリkaiwaの低遅延音声通話基盤をどう作ったか - AWS Gravitonで支える低遅延・低コストAI Agent基盤
mogamit
0
160
Featured
See All Featured
Leading Effective Engineering Teams in the AI Era
addyosmani
9
2.1k
[RailsConf 2023] Rails as a piece of cake
palkan
59
6.7k
Art, The Web, and Tiny UX
lynnandtonic
304
22k
Amusing Abliteration
ianozsvald
1
220
How to Align SEO within the Product Triangle To Get Buy-In & Support - #RIMC
aleyda
2
1.6k
Leadership Guide Workshop - DevTernity 2021
reverentgeek
1
320
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
28
3.5k
Redefining SEO in the New Era of Traffic Generation
szymonslowik
1
350
How GitHub (no longer) Works
holman
316
150k
Digital Projects Gone Horribly Wrong (And the UX Pros Who Still Save the Day) - Dean Schuster
uxyall
1
1.9k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
35
2.5k
Side Projects
sachag
455
43k
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!