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
270
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
1
430
The Complete Guide to building In-App Notifications in Web Apps
unicodeveloper
0
280
The Golden Ticket: Becoming a Superstar & Impactful Open Source Contributor
unicodeveloper
0
120
Optimizing Developer Workflow with Sourcegraph
unicodeveloper
0
160
Code Search with Laravel and Sourcegraph
unicodeveloper
1
270
Lightning Talk - JAMStack
unicodeveloper
0
620
Engineering Faster Web Experiences in Plain Sight
unicodeveloper
0
190
Authentication & Authorization in GraphQL
unicodeveloper
5
1.7k
Authentication & Authorization in Next.js
unicodeveloper
3
720
Other Decks in Programming
See All in Programming
検証も兼ねて個人開発でHonoとかと向き合った話
hanetsuki
1
930
GitHub Actionsで泣かないためにやっておきたい設定 / Recommended GHA settings to avoid crying
pinkumohikan
3
530
大規模Reactアプリのリアーキテクチャ~8万行のTanStack Query移行の軌跡~
kj455
4
960
Komplexe Oberflächen mit SVG und der Web Animation API
joergneumann
0
670
Tailwind CSSを本気でカスタマイズする方法
fsubal
13
5.3k
⼤規模⾔語モデルの拡張(RAG)が 終わったかも知れない件について
nearme_tech
23
15k
FigmaとPHPで作る1ミリたりとも表示崩れしない最強の帳票印刷ソリューション
ttskch
43
19k
TCAとKMPを用いた新規動画配信アプリ 「ABEMA Live」の設計
tomu28
1
110
Let's learn code review
riofujimon
2
330
try! Swift Tokyo 2024 参加報告 / try! Swift Tokyo 2024 Report
hironytic
0
210
SIMD Parallel Programming with the Vector API
josepaumard
0
170
if constexpr文はテンプレート世界のラムダ式である
faithandbrave
3
650
Featured
See All Featured
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
21
1.6k
KATA
mclloyd
15
12k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
2
1.3k
VelocityConf: Rendering Performance Case Studies
addyosmani
320
23k
The Invisible Side of Design
smashingmag
294
49k
How To Stay Up To Date on Web Technology
chriscoyier
782
250k
Scaling GitHub
holman
457
140k
StorybookのUI Testing Handbookを読んだ
zakiyama
13
4.6k
Producing Creativity
orderedlist
PRO
337
39k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
244
20k
Fashionably flexible responsive web design (full day workshop)
malarkey
398
65k
Building Flexible Design Systems
yeseniaperezcruz
319
37k
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!