Micro Frontends - Devops POV

Slide 1

Slide 1 text

Micro Frontends DevOps POV

Slide 2

Slide 2 text

Avi Zurel

Slide 3

Slide 3 text

@KensoDev

Slide 4

Slide 4 text

A bit of motivation The 4 minute mile https://en.wikipedia.org/wiki/Four-minute_mile

Slide 5

Slide 5 text

A bit of motivation Roger Banister 1954 3:59.4 https://en.wikipedia.org/wiki/Four-minute_mile

Slide 6

Slide 6 text

New Benchmark!

Slide 7

Slide 7 text

Be successful!

Slide 8

Slide 8 text

Application Templates

Slide 9

Slide 9 text

Application Templates - Most presentation pitch you Angular and React together. Don't do that - Application should look *The same* - Templates for actions/components/css - src/lib for extraction candidates - Internal libraries - Decision on libs - Axios vs Fetch - Css next vs SCSS App X should *feel* like App Y

Slide 10

Slide 10 text

CI conﬁguration

Slide 11

Slide 11 text

CI conﬁg - All application should have the same CI conﬁguration. - npm run build:prod - npm start - npm run lint - etc...

Slide 12

Slide 12 text

Nginx conﬁg

Slide 13

Slide 13 text

Nginx / Web server - /configs/{}.json proxies to local configuration files - Application configuration should be dynamic. Applications are promoted through environments transparently. - Caching of JS/CSS images etc..

Slide 14

Slide 14 text

Logging and monitoring

Slide 15

Slide 15 text

Logging - Decision on logging format - Instrumentation how/why? - Statistics and usage

Slide 16

Slide 16 text

Modules loading

Slide 17

Slide 17 text

Modules loading - Whatever you choose should be consistent. - You can choose a manifest and load JS ﬁles from endpoints of have iframes that will use native history. - Loading of modules should be fail- safe. No app should bring the system down

Slide 18

Slide 18 text

Releasing

Slide 19

Slide 19 text

Releases - Releasing an application should be as easy as building on CI and having a ready-made module - You can promote/remove from the manifest at any given time.