Slide 1

Slide 1 text

The Multiplying Architecture Eder Ignatowicz Principal Software Engineer @ederign 1

Slide 2

Slide 2 text

We live in a world where web technologies have dominated software development. Default choice for most applications. 2 Software Development Landscape Landscape

Slide 3

Slide 3 text

Well though and understood set of Standards, Patterns and Techniques as a strong foundation. 3 Standards, Patterns and Techniques Foundation

Slide 4

Slide 4 text

Rich ecosystem that has been maturing over the years. 4 Ecosystem Ecosystem

Slide 5

Slide 5 text

TypeScript created the perfect compromise for Static Type Languages believers. 5 Static Typing Static Typed Language

Slide 6

Slide 6 text

Browser is now more than just the window for the internet. Browsers became part of an important trend as the mechanism to distribute any Graphical User Interface based applications. 6 Browser Everywhere Browser Everywhere

Slide 7

Slide 7 text

Architectures Architectures 7 An evolutionary architecture supports incremental, guided change as a first principle across multiple dimensions. Evolutionary Micro Frontends Serverless Microservices Architectural style that structures an application as a collection of independent services. Incorporate third-party “Backend as a Service”, and/or that include custom code run as Functions. Design approach in which a front-end app is decomposed into individual, semi-independent “microapps” working loosely together.

Slide 8

Slide 8 text

Why do we need a new architecture? 8 The Multiplying Architecture

Slide 9

Slide 9 text

Cloud Native Tooling The Multiplying Architecture 9 The components to be distributed should be preserved untouched and with avoiding feature flags. Bridge Minimize code changes It has to embrace different generations of technology stack. Multiple Distributions The origin of multiplying architecture is rooted in the need to distribute the same set of components in a myriad of platforms. requirements

Slide 10

Slide 10 text

What is Software Architecture? 10 The Multiplying Architecture

Slide 11

Slide 11 text

“Architecture is about the important stuff. Whatever that is.” 11 Ralph Johnson

Slide 12

Slide 12 text

Introducing Multiplying Architecture 12

Slide 13

Slide 13 text

What is important for the Multiplying Architecture is the abstraction. The Multiplying Architecture 13

Slide 14

Slide 14 text

View is a portable set of widgets that are exposed as an unit to the Channel through the Envelope. The Abstractions Optional section marker or title 14 Top level abstraction that represents the hosting environment, like a website or a desktop application. Channel Editor is a specialized type of View, that gets a file content as input and is able to serve the content state back to the Channel through the Envelope. Editor View Enable transparent communication between Components (View/Editor) and Channel Envelope core

Slide 15

Slide 15 text

Channel (VS Code, Desktop, Browser, …) Components Interaction 15 MyChannel Implements: Channel, MyServiceApi Consumes: MyEnvelopeApi MyEditor Implements: Editor Consumes: MyServiceApi MyEnvelope Defines: MyEnvelopeApi MyServiceApi Implements: MyEnvelopeApi Consumes: Editor

Slide 16

Slide 16 text

Envelope Advantages Context Isolation (CSS and JS) Autonomous Teams Independent Release Cycles Type Safe Communication 16 Component Isolation micro frontend

Slide 17

Slide 17 text

Multiplying Architecture In Practice 17

Slide 18

Slide 18 text

KIE Tooling - Business Automation 18

Slide 19

Slide 19 text

KIE Tooling Channels * Client side online editor 19

Slide 20

Slide 20 text

DEMO 20

Slide 21

Slide 21 text

Online Channel

Slide 22

Slide 22 text

VSCode Channel

Slide 23

Slide 23 text

VSCode Channel

Slide 24

Slide 24 text

24 The Multiplying Architecture Feature Highlights

Slide 25

Slide 25 text

Worked with Microsoft VSCode team to enable Graphical based editors. 25 The Multiplying Architecture VSCode Native

Slide 26

Slide 26 text

Read and Write content from multiple sources like GitHub, Gist, FileSystem, S3 (soon), etc. 26 The Multiplying Architecture Unified I/O API

Slide 27

Slide 27 text

27 Cross channel support for Undo, Redo, and Dirty detection. The Multiplying Architecture State Control

Slide 28

Slide 28 text

28 The Multiplying Architecture Keyboard Shortcuts

Slide 29

Slide 29 text

29 The Multiplying Architecture Guided Tour

Slide 30

Slide 30 text

30 The Multiplying Architecture Gist as storage Pure client side mechanism to store content using GitHub Gists.

Slide 31

Slide 31 text

31 The Multiplying Architecture Backend Services A pluggable infrastructure, able to augment the capabilities of the views and editors by enabling some backend dependent features.

Slide 32

Slide 32 text

32 The Multiplying Architecture Embedded Editors (soon) const dmnEditor = kieTooling.dmnEditor('targetEmbeddedDiv', {standalone:true}) const bpmnEditor = kieTooling.bpmnEditor('targetEmbeddedDiv', {standalone:true})

Slide 33

Slide 33 text

Multiplying Architecture In Detail 33 https://github.com/kiegroup/kogito-tooling-examples

Slide 34

Slide 34 text

34

Slide 35

Slide 35 text

35

Slide 36

Slide 36 text

36

Slide 37

Slide 37 text

37

Slide 38

Slide 38 text

38

Slide 39

Slide 39 text

In Practice

Slide 40

Slide 40 text

40

Slide 41

Slide 41 text

In Detail

Slide 42

Slide 42 text

Why do we need a new architecture? 42 The Multiplying Architecture

Slide 43

Slide 43 text

Goals of The Multiplying Architecture The Multiplying Architecture 43 The components to be distributed should be preserved untouched and with avoiding feature flags. Bridge Minimize code changes It has to embrace different generations of technology stack. Multiple Distributions The origin of multiplying architecture is rooted in the need to distribute the same set of components in a myriad of platforms. solve a problem

Slide 44

Slide 44 text

44 Optional section marker or title Questions

Slide 45

Slide 45 text

linkedin.com/company/red-hat youtube.com/user/RedHatVideos facebook.com/redhatinc twitter.com/RedHat 45 Thank you Eder Ignatowicz Principal Software Engineer @ederign