Slide 1

Slide 1 text

Design Patterns Ruby Conf. Nigeria

Slide 2

Slide 2 text

❖ Software Developer ❖ Consultant at Auth0 ❖ Open Sourcerer ❖ Self-Acclaimed Developer Evangelist ❖ Community Builder ❖ Jollof Rice Ambassador ❖ Google Developer Expert ❖ Homeless Man

Slide 3

Slide 3 text

@unicodeveloper - GitHub - Twitter

Slide 4

Slide 4 text

...When no design pattern is involved.

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

...After you involve design patterns.

Slide 7

Slide 7 text

No content

Slide 8

Slide 8 text

..A few things to note, thou developer

Slide 9

Slide 9 text

1. Design patterns are not a silver bullet to all your problems.

Slide 10

Slide 10 text

2. Design patterns was made for man, not man for design patterns.

Slide 11

Slide 11 text

3. They can prove to be a savior, or else they can make you & your code a mess.

Slide 12

Slide 12 text

Design Patterns Grouped 1 2 ❖ Behavioral ❖ Creational ❖ Structural

Slide 13

Slide 13 text

Behavioral Design Patterns 1 3 ❖ Mediator ❖ Observer ❖ Strategy ❖ Visitor ❖ Iterator ❖ Command

Slide 14

Slide 14 text

Creational Design Patterns 1 4 ❖ Builder ❖ Prototype ❖ Singleton ❖ Factory ❖ Abstract Factory

Slide 15

Slide 15 text

Structural Design Patterns 1 5 ❖ Facade ❖ Composite ❖ Decorator ❖ Flyweight ❖ Adapter ❖ Bridge

Slide 16

Slide 16 text

..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.

Slide 17

Slide 17 text

Singleton Pattern

Slide 18

Slide 18 text

Goals 1. Ensure that only one instance of a class is created. 2. Provide a global point of access to the object.

Slide 19

Slide 19 text

Singleton 1 9

Slide 20

Slide 20 text

Singleton 2 0 What makes the Singleton is the global access to the instance.

Slide 21

Slide 21 text

Prototype Pattern

Slide 22

Slide 22 text

Goals 1. Specify the kind of objects to create using prototypical instance. 2. Create new objects by copying this prototype

Slide 23

Slide 23 text

Prototype 2 3

Slide 24

Slide 24 text

Prototype 2 4

Slide 25

Slide 25 text

Command Pattern

Slide 26

Slide 26 text

Goals 1. Encapsulate the request in an object 2. Allow the parameterization of clients with different requests.

Slide 27

Slide 27 text

Command 2 7

Slide 28

Slide 28 text

Command 2 8 What if the core API of carManager changed? What happens?

Slide 29

Slide 29 text

Facade Pattern

Slide 30

Slide 30 text

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.

Slide 31

Slide 31 text

Facade 3 1

Slide 32

Slide 32 text

Facade 3 2 JQuery’s document.ready() function is being powered by bindReady()

Slide 33

Slide 33 text

Factory Pattern

Slide 34

Slide 34 text

Goals 1. Creates objects without exposing the instantiation logic to the client. 2. Refer to newly created object through a common interface.

Slide 35

Slide 35 text

Factory 3 5

Slide 36

Slide 36 text

Factory 3 6

Slide 37

Slide 37 text

The Mixin Pattern

Slide 38

Slide 38 text

Goals 1. Allow objects to borrow functionality with a minimal amount of complexity.

Slide 39

Slide 39 text

Mixin 3 9

Slide 40

Slide 40 text

Mixin 4 0

Slide 41

Slide 41 text

Decorator Pattern

Slide 42

Slide 42 text

Goals 1. Similar to Mixins. Aim to promote code reuse 2. Offer ability to add behaviour to existing classes in a system dynamically.

Slide 43

Slide 43 text

Decorator 4 3 Simple Use case

Slide 44

Slide 44 text

Decorator 4 4

Slide 45

Slide 45 text

Decorator 4 5 Decorating objects with multiple decorators

Slide 46

Slide 46 text

Module Pattern

Slide 47

Slide 47 text

Goals 1. Emulate the concept of classes. 2. Shield particular parts from global scope and make everything simple.

Slide 48

Slide 48 text

Module 4 8

Slide 49

Slide 49 text

Module 4 9

Slide 50

Slide 50 text

Observer Pattern

Slide 51

Slide 51 text

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.

Slide 52

Slide 52 text

Observer 5 2

Slide 53

Slide 53 text

Observer 5 3

Slide 54

Slide 54 text

Observer 5 4

Slide 55

Slide 55 text

Observer 5 5

Slide 56

Slide 56 text

Observer 5 6

Slide 57

Slide 57 text

Observer 5 7

Slide 58

Slide 58 text

Learning Resource http://www.oodesign.com/observer-pattern.html https://addyosmani.com/resources/essentialjsdes ignpatterns/book/

Slide 59

Slide 59 text

Thank You!