The short story of moving from .NET Monolith to Node.js Microfrontends and how did it affect our organisation. This presentation is a case study. You can find here some helpful resources about frontend microservices, how to start your project, how to find people to work with and some tips based on our experience.

1. How to change mindset of coworkers?
The short story of moving from .NET Monolith to
Node.js Microfrontends and how did it affect our
organisation

2. Pracuj.pl
3 mln active users
85 IT employees
62 mln page views per month

3. What would you like to know?
Pros and cons
How it works
What are the benefits
What is the danger

4. Timeline
Idea

5. Have you ever had an idea that would
change the world?

6. SO YOU WANT TO CARRY OUT
A REVOLUTION
HOW DO YOU START?

7. Timeline
Idea
People

8. Start with people

9. Start with people
TECH LEADER
PRODUCT
MANAGER
THE FUN OF BEING THE
PART OF PROJECT WITH
OTHERS
KPI TECHNOLOGY EXPERIENCE
POSITIVE ONES

10. Feelings about the project at very beginning
POSITIVE NEUTRAL NEGATIVE

11. Timeline
Idea
People
POC
#1

12. Proof of concept

13. POC #1

14. POC #1

15. Feelings after first iteration
POSITIVE NEUTRAL NEGATIVE

16. Timeline
Idea
People
POC #1
Stakeholders’
requirements

17. Stakeholders’ requirements
BACKEND NFRFRONTEND NFR PRODUCT NEEDS

18. Non-functional requirements
Dictate clear organisation’s standards
Stand for critical system mission
Should help, not limit development

19. Timeline
Idea
People
POC #1
Stakeholders’
requirements
POC #2

20. Change of our mindset

21. What we had to learn and implement being Frontend Developer?

22. The stress tests with Gatling

23. What helped us?
NFR made expectations clear
Regular group code checks
All kind of developers

24. Feelings after second iteration
POSITIVE NEUTRAL NEGATIVE

25. Timeline
Idea
People
POC #1
Stakeholders’
requirements
POC #2
Production
A/B Test

26. Our first production deploy

27. Our first production deploy

28. A/B Test results
Improved performance
6% more applications on Desktop
18% more applications on Mobile Web
15 developers working simultaneously

29. Timeline
Idea
People
POC #1
Stakeholders’
requirements
POC #2
Production
A/B Test
Improvements

31. Improvements

32. Improvements
& MONOREPO

33. Improvements

34. Improvements

35. Improvements
4GB 500MB
yarn workspaces

36. Improvements

37. Improvements
Architecture Decision Record

38. Timeline
Idea
People
POC #1
Stakeholders’
requirements
POC #2
Tooling
Improvements
Today

39. Today

40. Benefits we can see after one year
Ease of collaboration with other teams
A/B Testing
Technology agnostic
SEO Friendly
Reusable frontend microservices

41. Feelings now
POSITIVE POSITIVE POSITIVE

42. Takeaways
People are essential
Revolution is possible and can be safe
Meet expectations of your stakeholders
You will have more work than you think
Be open for solutions and changes

43. Useful resources
https://www.mosaic9.org/
https://micro-frontends.org/
https://martinfowler.com/articles/micro-frontends.html
https://github.com/ChristianUlbrich/awesome-microfrontends
https://malloc.fi/performance-cost-of-server-side-rendered-react-node-js
https://arkwright.github.io/
https://github.com/lerna/lerna
https://www.flaticon.com/packs/people-avatars-2
https://requirejs.org/
https://pm2.keymetrics.io/
https://nodemon.io/
https://github.com/joelparkerhenderson/architecture_decision_record

44. Special thanks to
Dawid Winiarczyk Patrycjusz Szydło
dawid.winiarczyk@pracuj.pl
https://github.com/morriq
in/dawidwiniarczyk/
patrycjusz.szydlo@pracuj.pl
https://github.com/pats
in/patrycjusz-szydlo/

45. Wojciech Jureczka
wojciech.jureczka@pracuj.pl
https://github.com/wjureczka
in/wojciech-jureczka/
Frontend Developer at Grupa Pracuj