La modularité au (micro) service de l’espace client Orange

En 2017, l'espace client web d'Orange était une application monolithique capable de gérer 15 millions de visiteurs uniques par mois, avec un fonctionnel vaste, allant de la récupération du code puk à la souscription de nouvelles options. Au fil des années passées et des évolutions, la complexité et la dette technique se sont accumulées sur ce monolithe. Il affichait alors ses limites pour adresser la multicanalité et ne permettait plus d'absorber les évolutions dans un délai raisonnable.

Lorsqu'une application devient trop grosse, le découpage en micro-services est une bonne alternative. Mais comment casser un monolithe pour en faire des micro-services tout en évitant le big bang et en garantissant le maintien des performances ? Que se passe-t-il lorsque l’on pousse la démarche jusqu’au front pour obtenir un découpage en micro-frontends ?

Dans ce talk, nous vous racontons l'histoire de la transformation de l'espace client Orange, qui a permis de réconcilier différents fronts et différents backs dans une architecture modulaire de bout en bout.

Transcript

1. #DevoxxFR Frédéric Demany Sylvain Marcelaud 1 La modularité au (micro) service de l’espace client Orange
2. #DevoxxFR 2
3. Orange depuis 2010 @SMarcelaud Tech. Lead Orange et Moi /whois 3 @FredericDemany Orange depuis 2010 Kotlin, Angular, Sécurité Archi espace client Android, iOS
4. 40 Millions de visites par mois
5. 200 personnes impliquées
7. Périmètre fonctionnel 7
8. Des utilisateurs heureux et satisfaits 8
9. #DevoxxFR 9
10. 2009 2021 2018 2015 2012 2006
11. #DevoxxFR 11 L’espace client ? 2009 2021 2018 2015 2012 2006
12. App Web 2009 2021 2018 2015 2012 2006
13. Architecture de l’espace client web 13 SI Orange 2009 2021 2018 2015 2012 2006
14. Architecture de l’espace client web 14 SI Orange 2009 2021 2018 2015 2012 2006
15. #DevoxxFR 15 2009 2021 2018 2015 2012 2006
16. Du côté des smartphones 16 2009 2021 2018 2015 2012 2006 Samsung Galaxy iPhone 3GS
17. #DevoxxFR 17 L’espace client ? 2009 2021 2018 2015 2012 2006
18. App Web 2009 2021 2018 2015 2012 2006 ?
19. 2009 2021 2018 2015 2012 2006
20. 2009 2021 2018 2015 2012 2006
21. Nouveau besoin à solution ? 21 SI Orange 2009 2021 2018 2015 2012 2006 ?
22. Pourquoi ? 22 Une architecture tournée vers l’avenir La volonté de ne pas impacter le business existant La stratégie d’Orange va dans ce sens
23. Nouvelle architecture de l’espace client 23 SI Orange 2009 2021 2018 2015 2012 2006 Conso Offre Facture Equipement
24. Et dans la mise en œuvre ? 24 2009 2021 2018 2015 2012 2006
25. 😀 Et dans la mise en œuvre ? 25 2009 2021 2018 2015 2012 2006 Copie blanche ✅
26. 😐 Et si on souhaite mutualiser un comportement ? Et dans la mise en œuvre ? 26 2009 2021 2018 2015 2012 2006 Copie blanche ✅
27. 😓 Et si on souhaite mutualiser un comportement ? Et dans la mise en œuvre ? 27 2009 2021 2018 2015 2012 2006 Copie blanche Ça fait combien de livrables ? ✅
28. 😱 Et si on souhaite mutualiser un comportement ? Et dans la mise en œuvre ? 28 2009 2021 2018 2015 2012 2006 Copie blanche Ça fait combien de livrables ? Et pour l’hébergement ? ✅
29. Et dans la mise en œuvre ? 29 2009 2021 2018 2015 2012 2006
30. 2009 2021 2018 2015 2012 2006
31. 😅 Et si on souhaite mutualiser un comportement ? Et dans la mise en œuvre ? 31 2009 2021 2018 2015 2012 2006 Copie blanche Ça fait combien de livrables ? Et pour l’hébergement ? ✅ ✅
32. 🙂 Et si on souhaite mutualiser un comportement ? Et dans la mise en œuvre ? 32 2009 2021 2018 2015 2012 2006 Copie blanche Ça fait combien de livrables ? Et pour l’hébergement ? ✅ ✅ ✅
33. 🤔 Et si on souhaite mutualiser un comportement ? Et dans la mise en œuvre ? 33 2009 2021 2018 2015 2012 2006 Copie blanche Ça fait combien de livrables ? Et pour l’hébergement ? ✅ ✅ ✅ ☑
34. 2 architectures en parallèle, mais un objectif atteint. 34 SI Orange 2009 2021 2018 2015 2012 2006 Conso Offre Facture Equipement
35. #DevoxxFR 35 On veut (encore) accélérer 2009 2021 2018 2015 2012 2006
36. 2009 2021 2018 2015 2012 2006
37. Pour répondre aux enjeux business 37 SI Orange 2009 2021 2018 2015 2012 2006 Conso Offre Facture Equipement FT FT FT FT ? ? ? ?
38. #DevoxxFR 38 2009 2021 2018 2015 2012 2006
39. Pour répondre aux enjeux business 39 SI Orange 2009 2021 2018 2015 2012 2006 Conso Offre Facture Equipement
40. Et dans la mise en œuvre ? 40 2009 2021 2018 2015 2012 2006 • On a appris de nos erreurs • On a fait un POC • Mais on a aussi galéré (encore) • mutualisation • Cohérence UX/UI ? • SEO ? • Performances ? • CORS ? • devops • hébergement
41. Côté App 41
42. Côté Web 42
43. #DevoxxFR 43 Aujourd’hui 2009 2021 2018 2015 2012 2006
44. #DevoxxFR 44 Le monolithe est encore vivant 2009 2021 2018 2015 2012 2006 (mais plus pour longtemps) (enfin on espère)
45. #DevoxxFR 45 Les micro-services ce n’est pas magique
46. #DevoxxFR 46 Les micro-frontends ce n’est pas magique
47. #DevoxxFR 47 L’architecture et l’organisation sont liées (loi de Conway)
48. #DevoxxFR 48 L’opportunité business crée l’opportunité de transformer
49. #DevoxxFR 49 Et la suite ? 2009 2021 2018 2015 2012 2006 Aller au bout du modèle micro-frontends Amélioration continue de notre organisation
50. #DevoxxFR Merci 50 @SMarcelaud @FredericDemany