In this talk, Martin covers how an All-JavaScript approach with MongoDB, Express, React and Node.js (MERN) enables iterating fast, picking the example of the quickly growing product 'myOnboarding' by Haufe-Lexware. He touches on the pros and cons of this technology stack, how the technology ties in to the product's microservices architecture, and how the product team leverages CI/CD to be able to act, and react, fast and securely. The talk further touches on how the product team setup and customer feedback is crucial to iterate fast, in the right direction.

1. sli.do/xxxx
Iterating fast with MERN

2. sli.do/xxxx
whoami
C:> WINDOWS.EXE
C/C++/C# Background
10+ years
$ docker ps
Containers & Kubernetes
Since ~4 years
wicked.haufe.io maintainer
OSS API Management
Solution Architect
(CTO Office)
Developer
since 2006
Twitter/GitHub: donmartin76
Ask me
something!

3. sli.do/xxxxsli.do/xxxx
Haufe
–

4. sli.do/xxxxsli.do/xxxx
HaufemyOnboarding
–
Die Web-App
fürneueMitarbeiter
Die App
fürneueMitarbeiter
DasContent-undTaskmanagement
(ab iOS 9 & Android 6)

5. sli.do/xxxx
WhymyOnboarding?
1
Signed
Contract
2
FirstWor-kingDay
3
End ofprobation
Employee motivation/
Productivity increase
Time
Withoutonboarding
Quitting Threshold
EmployeeMotivation/Productivitiy
Withoutonboarding
Risk of leavingcompany
2-3 months 6 months

6. sli.do/xxxx
TeamSetup
Development+UX/Design
Barcelona and Freiburg
Product Management
Product and MarketingIntrapreneurs
Freiburg
MarketingManagement
Freiburg
Business Development
Management
Freiburg
Sales Support
Implementation
Consulting
(external partner)
Core Team:
Daily/Bi-WeeklyExchange
(Mostly) SharedOKRs
Fully Responsible Product Team

7. sli.do/xxxx
MERN – The Tech Stack

8. sli.do/xxxx
MERN –What?
MEAN

9. sli.do/xxxx
Actually, MERNKUPFWKPGBP…
Ibet 50%is missing…

10. sli.do/xxxx
JS(ON) all the waydown… (1)
PayloadsarealwaysJSON,
noneed tothink
JSONhandlednatively
bynode.jsandbrowsers
MongoDBstores(and indexes)
JSONnatively.How convenient.
Programminglanguage
isalwaysJavaScript

11. sli.do/xxxx
JS(ON) all the waydown… (2)
Increased
Productivity
Moving betweenfrontend
andbackendisless challenging
Tooling similarfor
FrontendandBackend
EntireStackeasilyruns
ona developerlaptop
SameTech forsharing
libraries(npm) everywhere
Lightweightprogramming,
Fastfirstimplementations

12. sli.do/xxxx
Drawbacks
Technology Major Drawback
JavaScript No Type Safety ( TypeScript)
MongoDB Schemaless (which is the point…)
React Very fastmoving, incoherent styles
Express.js --

13. sli.do/xxxx
Architecture

14. sli.do/xxxx
Client Types
CMS and Web App
React Single Page
Applications
Served via nginx
static web server
Mobile App
Mobile App iOS/Android
via react-native
Cross compiled to
iOS and Android
Similar programming
as CMS/Web App
Communicatewith
Backend via REST API
Secured via OAuth2 SSO Support
Integration Clients
myOnboarding Command
LineInterface
Integration with other
Haufe solutions
Custom Integrations via
API Management

15. sli.do/xxxx
Architecture
Kubernetes (Azure AKS-Engine)
CMS
APIGateway(wicked/kong)
Auth Server
People
Content
Grafana
Notific-ations
Sche-duler
Permis-sions
Integ-ration
Plans
Prome-theus Alertmanager
WebApp
MongoDB
(Atlas, managed service)
IngressController(SSL)
Tasks Media
System
Compo-nent
Nginx
Static Micro-
Service
Browser
MobileApp
OAuth2.0
Integrations(mO
CLI,Umantis,…)
No state inside
k8scluster!

16. sli.do/xxxx
Service
Service
Key Design Principles
API
Client
APIGateway
Service
IntegrationMobileClient
Bounded Context
Functionality
Functionality
Functionality
MongoDB

17. sli.do/xxxx
Here‘s
“Here‘s a picture of the microservices and theirunderlyingshared database.”

18. sli.do/xxxx
Risks
„I just need that piece of data from the other service, let‘s go to the database andfetch it.“
Default values?
Known data issues
Bounded Context? On-the-flydata
migrations?
Code Duplication

19. sli.do/xxxx
templates
{“_id“:“def“} …
MongoUsage
Mongo
Globals
TenantA
TenantC
TenantB
…
people
{“_id“:“def“} …
plans
{“_id“:“def“} …
tasks
{“_id“:“def“} …
org_imports
{“_id“:“def“} …
…
Databases CollectionsCluster

20. sli.do/xxxx
Mitigations
• One Mongo collection belongs to exactlyone microservice
• Microservices communicate via APIs
• Supported by (internal) SDKs
• Bounded Context – Clear Interface
• Decoupled runtime, decoupled deployments

21. sli.do/xxxx
MongoUsage
Mongo
Globals
TenantA
TenantC
TenantB
…
people
{“_id“:“def“} …
plans
{“_id“:“def“} …
assigned
{“_id“:“def“} …
org_imports
{“_id“:“def“} …
…
Databases CollectionsCluster
people service
plans service
tasks service
templates
{“_id“:“def“} …

22. sli.do/xxxx
Common Smells
APIcall cascades
Distributed Monolith
(Dante is calling)
Changerequiresconcertedreleases
Breach of API evolution
guidelines
Functionality requires
1:nAPI calls
Bounded Context
might be“wrong”

23. sli.do/xxxx
How does this… help?

24. sli.do/xxxx
Development Strategy
Short Feature
Branches
Feature Flags
PerTenant
Features whichare still being finalized
are often already deployed to Prod!
Local
Development
Deploy/Testin
DevCluster
Mergeto
Master
Auto-Deployto
Dev,Test,Prod
Finalizing
Feature
Code
Review
Feature
GA
F E A T U R E L I F E C Y C L E

25. sli.do/xxxx
Consequences
Services independently
deployable
CI/CDin effect
mandatory(withall
requirements)
Features caneasily
betested, also
withcustomers
Feedbackloop
canbedrastically
shortened
Features canbe
implemented
iteratively
Closecontactwith
Business Development paysoff!

26. sli.do/xxxx
How To Not Break Things

27. sli.do/xxxx
Mergeto Master…
Build Docker
Image
Test Image
isolated
Deploy to
<cluster>
Runend-to-
end tests
Dev, Test, then
Prod
Unit Tests
APITests

28. sli.do/xxxx
WhyAPI Tests?
EnsureBackward
Compati-bility
Integ-rations
Reflect functio-
nality well
CanTest Docker
Images
Mobile App
Versions
Fairly Easy To
Design
RunFast Locally

29. sli.do/xxxx
Gotchas
Rollouts are only safe if
tests are pretty
comprehensive
Choosing tests (Unit,API,
E2E) efficiently is… tricky.
Writing testable code is
also… tricky.
Shortlived feature branches
crucialto not build up large
and dangerous changes

30. sli.do/xxxx
And ifyou break
things…
… make sureyourealizethatyoudid.

31. sli.do/xxxx
Monitoring
Extremelyimportant!
>50%of End-users are two
“hops” away, maybereluctant
to report issues
Haufe
Customer
Onboardee
Traffic from Mobile App only
visible via API instrumenting
Prometheus
+ AlertManager

32. sli.do/xxxx
Sample Ops Alert
Response codenot 2xxand not 404
Microservice misbehaving

33. sli.do/xxxx
LeveragingManaged Services
I probably won‘t operate things
better* thana cloud provider.
Repeat after me:
Log Management
Databases
(MongoDB, Postgres)
E-Mailsending
Push Notifications
Kubernetes
as aService
But some things just don‘t fit
(so you end upwith DIY anyway)
Grafana
Prometheus
API Gateway
(wicked/Kong)
*)safer,cheaper;
exceptionsapply

34. sli.do/xxxx
So, this works?

35. sli.do/xxxx
Ofcourse!We‘reprofessionals!
Room for
Improvements
Prioritization super
difficult
“What’s in it for
the customer?”

36. sli.do/xxxx
Tech Skills Needed
ComponentVersioning
Development,APIs and
Architecture
Mobile Development
Mobile Testing
Unit/APITesting
E2E Testing
CI/CDPipelines
Monitoring
E2E Monitoring
Support&Operations

37. sli.do/xxxx
Not-Just-Tech Skills Needed
Information Security
Complicance/
Certifications
UX
UIDesign
(Development)
Processes
Customer
Communication
Product Ownership
Customer
Expectations
Stakeholder
Management
Focus
Trans-parency

38. sli.do/xxxx
Wrap Up & Stuff

39. sli.do/xxxx
Why dowebelieve inthis approach?
Short Customer
Feedback Loop
Quickmovefrom RAD
to actual Product
Close Connect
To Marketing
MarketResponse
Shows Big Interest
Inthe Topic
Market Success
So Far – We Seem To
Get It Right
Attractive Technologies
(We‘re Hiring!)
Fast Prototyping And
Efficient Coding
Close Connect
To Sales

40. sli.do/xxxx
Questions
sli.do/xxxx

41. sli.do/xxxxsli.do/xxxx
ThankYou!