Nomnoml language preview

1. Request path

an actor, a service, and a database

horizon-dark

#direction: right
#stroke: #33322E

[<actor> Customer] -> [Web]
[Web] -> [API|checkout(); refund()]
[API] -:> [<database> Orders]

atom-one-dark

#direction: right
#stroke: #33322E

[<actor> Customer] -> [Web]
[Web] -> [API|checkout(); refund()]
[API] -:> [<database> Orders]

github-dark

#direction: right
#stroke: #33322E

[<actor> Customer] -> [Web]
[Web] -> [API|checkout(); refund()]
[API] -:> [<database> Orders]

dracula

#direction: right
#stroke: #33322E

[<actor> Customer] -> [Web]
[Web] -> [API|checkout(); refund()]
[API] -:> [<database> Orders]

nord

#direction: right
#stroke: #33322E

[<actor> Customer] -> [Web]
[Web] -> [API|checkout(); refund()]
[API] -:> [<database> Orders]

github

#direction: right
#stroke: #33322E

[<actor> Customer] -> [Web]
[Web] -> [API|checkout(); refund()]
[API] -:> [<database> Orders]

2. Decorator pattern

a frame with generalization arrows

horizon-dark

#direction: down
[<frame> Decorator pattern|
  [<abstract> Component||+ operation()]
  [Decorator|- next: Component|+ operation()]
  [Decorator]<:-[Component]
  [ConcreteDecorator|- state|+ operation()]
  [ConcreteDecorator]<:-[Decorator]
]

atom-one-dark

#direction: down
[<frame> Decorator pattern|
  [<abstract> Component||+ operation()]
  [Decorator|- next: Component|+ operation()]
  [Decorator]<:-[Component]
  [ConcreteDecorator|- state|+ operation()]
  [ConcreteDecorator]<:-[Decorator]
]

github-dark

#direction: down
[<frame> Decorator pattern|
  [<abstract> Component||+ operation()]
  [Decorator|- next: Component|+ operation()]
  [Decorator]<:-[Component]
  [ConcreteDecorator|- state|+ operation()]
  [ConcreteDecorator]<:-[Decorator]
]

dracula

#direction: down
[<frame> Decorator pattern|
  [<abstract> Component||+ operation()]
  [Decorator|- next: Component|+ operation()]
  [Decorator]<:-[Component]
  [ConcreteDecorator|- state|+ operation()]
  [ConcreteDecorator]<:-[Decorator]
]

nord

#direction: down
[<frame> Decorator pattern|
  [<abstract> Component||+ operation()]
  [Decorator|- next: Component|+ operation()]
  [Decorator]<:-[Component]
  [ConcreteDecorator|- state|+ operation()]
  [ConcreteDecorator]<:-[Decorator]
]

github

#direction: down
[<frame> Decorator pattern|
  [<abstract> Component||+ operation()]
  [Decorator|- next: Component|+ operation()]
  [Decorator]<:-[Component]
  [ConcreteDecorator|- state|+ operation()]
  [ConcreteDecorator]<:-[Decorator]
]

3. Pirate and ship

compartments, a range, and implementation

horizon-dark

[Pirate|eyeCount: Int|raid(); pillage()|
  [beard]--[parrot]
  [beard]-:>[foul mouth]
]

[<abstract> Marauder]<:--[Pirate]
[Pirate]- 0..1 [Ship]

atom-one-dark

[Pirate|eyeCount: Int|raid(); pillage()|
  [beard]--[parrot]
  [beard]-:>[foul mouth]
]

[<abstract> Marauder]<:--[Pirate]
[Pirate]- 0..1 [Ship]

github-dark

[Pirate|eyeCount: Int|raid(); pillage()|
  [beard]--[parrot]
  [beard]-:>[foul mouth]
]

[<abstract> Marauder]<:--[Pirate]
[Pirate]- 0..1 [Ship]

dracula

[Pirate|eyeCount: Int|raid(); pillage()|
  [beard]--[parrot]
  [beard]-:>[foul mouth]
]

[<abstract> Marauder]<:--[Pirate]
[Pirate]- 0..1 [Ship]

nord

[Pirate|eyeCount: Int|raid(); pillage()|
  [beard]--[parrot]
  [beard]-:>[foul mouth]
]

[<abstract> Marauder]<:--[Pirate]
[Pirate]- 0..1 [Ship]

github

[Pirate|eyeCount: Int|raid(); pillage()|
  [beard]--[parrot]
  [beard]-:>[foul mouth]
]

[<abstract> Marauder]<:--[Pirate]
[Pirate]- 0..1 [Ship]