Code Days München 2019: Wir prügeln den Monolithen ins Web

7252086bae9203045dd7f5664fd96a07?s=47 Manuel Meyer
January 23, 2019

Code Days München 2019: Wir prügeln den Monolithen ins Web

In Projekten für unsere Kunden treffen wir heutzutage immer wieder die gleiche Situation an: Die Kernapplikation der Unternehmung ist über mehrere Jahrzehnte und verschiedene Technologien zu einem funktionalen aber hässlichen Monolithen herangewachsen. Allen ist klar, dass eine Modernisierung nötig ist. Aber wie? Mehrere Modernisierungsprojekte sind bereits katastrophal gescheitert. In dieser Session beleuchten wir einen Ausweg aus der Misere. Wir zeigen einen Ansatz, bei welchem hochkomplexe Desktop-Applikationen allen Problemen zum Trotz schrittweise ins Web überführt werden können. Wir plaudern aus dem Nähkästchen und erzählen, wie wir für unseren Kunden die Migration von VB/C#/WinForms/WPF nach Angular geschafft haben.

7252086bae9203045dd7f5664fd96a07?s=128

Manuel Meyer

January 23, 2019
Tweet

Transcript

  1. BASEL BERN BRUGG DÜSSELDORF FRANKFURT A.M. FREIBURG I.BR. GENF HAMBURG

    KOPENHAGEN LAUSANNE MÜNCHEN STUTTGART WIEN ZÜRICH Wir prügeln den Monolithen ins Web! Code Days München 23.01.2019 Thomas Gassmann, thomas.gassmann@trivadis.com Manuel Meyer, manuel.meyer@trivadis.com @gassmannT @manumeyer1
  2. Wer sind wir? Thomas Gassmann Consultant, Trainer, Speaker thomas.gassmann@trivadis.com @gassmanT

    www.thomasgassmann.net Manuel Meyer Consultant, Trainer, Speaker manuel.meyer@trivadis.com @manumeyer1 www.manuelmeyer.net
  3. Agenda 1. Die Ausgangslage 2. Die Herausforderungen 3. Wo ist

    eigentlich das Problem? 4. Der Lösungsansatz 5. Probleme (und Lösungen) aus der Praxis.
  4. Die Ausgangslage

  5. „…Projekt…“ „…vom Desktop ins Web…“ „…Migration läuft nicht…“ „…brauchen Unterstützung…“

    Der Kunde ruft an:
  6. None
  7. None
  8. MACINTOSH Performa 550 LC (mit Ethernet!) (und Tetris!!!)

  9. „Wie lange ist 26 Jahre wirklich?“

  10. None
  11. None
  12. None
  13. Die Herausforderungen

  14. None
  15. Anpassbarkeit

  16. Effiziente Bedienbarkeit

  17. Informationsdichte

  18. Wo ist eigentlich das Problem?

  19. „Das ist so alt, dass muss man doch komplett neu

    schreiben!“
  20. None
  21. None
  22. None
  23. „Die Utopie der grünen Wiese“ --Manuel & Thomas

  24. --Joel Spolsky Things you should never do: https://www.joelonsoftware.com/2000/04/06/things-you-should-never-do-part-i/ „The worst

    strategic mistake is rewriting code from scratch“
  25. --Udi Dahan „The integration Problem“ & „The black hole of

    coupling“ Own the Future: https://www.youtube.com/watch?v=2iYdKQXGY2E Slides: https://www.slideshare.net/udidahan/own-the-future
  26. Quelle: https://www.slideshare.net/udidahan/own-the-future

  27. --Udi Dahan „The integration Problem“ & „The black hole of

    coupling“ Own the Future: https://www.youtube.com/watch?v=2iYdKQXGY2E Slides: https://www.slideshare.net/udidahan/own-the-future
  28. Ziele des Lösungsansatzes ▪ Kein Big Bang ▪ Keine grüne

    Wiese ▪ Den User nicht überfordern ▪ Exploratives testen & ablösen ▪ Agile Entwicklung.
  29. Der Lösungsansatz

  30. None
  31. Step by Step

  32. Kommunikation zwischen der alten und der neuen Welt

  33. Was ist SignalR? ▪ Ist eine Bibliothek für ASP.NET ▪

    Ermöglicht die Kommunikation vom Server zum Client (der im Browser läuft) ▪ Basiert auf WebSockets ▪ Bietet Fallback-Mechanismen z.B. Long-Polling ▪ Server- sowie Clientseitige Frameworks vorhanden.
  34. Wieso Angular? ▪ Typescript als Programmiersprache ▪ Funktionalität / Anpassbarkeit

    ▪ Gutes Tooling (Angular CLI) ▪ Grosse Community und Google ▪ NgRx Bibliothek für State Management ▪ Hohe Performance, im Kundenprojekt: Initial load ~193 Request < 2 sec Page switch < 0.5 sec.
  35. NgRx: Redux Component Action Reducers State Rest Service Dispatch Notify

    Send Create new state Effect
  36. Master / Slave Beziehung ▪ Das alte System ist das

    Master System ▪ Der Master startet das Slave System ▪ Der Master verwaltet das Login/Logout der User im Slave-System ▪ Das Slave-System erhält vom Master einen Identity Token ▪ Mittelfristig wird das neue System zum Master.
  37. None
  38. None
  39. Das Veto-Recht ▪ Jede Applikation sollte ein Veto-Recht haben ▪

    Beispiel: Während System A einen Datensatz bearbeitet, darf in System B nicht auf einen anderen gewechselt werden.
  40. None
  41. Demo https://github.com/AngularAtTrivadis/WebWinFormsInteraction

  42. 4 Probleme aus der Praxis (mit Lösungen)

  43. Problem 1 „Die Spezifikation ist die alte Anwendung.“

  44. Lösung 1

  45. hoto credit: Mark Spearman on VisualHunt.com / CC BY Und

    tschüss…
  46. Photo credit: zoetnet on Visual Hunt / CC BY

  47. Problem 2: «Excel im Browser» „Das muss im Web genau

    so aussehen wie jetzt…“
  48. None
  49. Photo credit: Chris Blakeley on Visualhunt / CC BY-NC-ND

  50. Lösung 2 ▪ Einen Partner für UX & UI Design

    involvieren ▪ Muss können: «Web User Experience Design» ▪ Muss können: «Web User Interface Design» ▪ Muss können: CODE liefern! ….sonst…
  51. None
  52. Problem 3: Das DatePicker Problem

  53. Lösung 3 ▪ «Schau im alten System wies funktioniert» reicht

    nicht als Spezifikation. ▪ Die Kunst der Anforderungsaufnahme muss beherrscht werden. ▪ Nicht alles selbst bauen!
  54. Problem 4 „Bei Google geht’s doch auch. Schau mal auf

    meinem Handy…“
  55. Lösung 4

  56. Zusammenfassung ▪ Die Big Bang Migration und die grüne Wiese

    sind Illusionen ▪ Die Ablösung muss als normale Evolution des Produkts angeschaut werden ▪ Der gezeigte Lösungsansatz bietet einen Weg aus der Misere ▪ Aber: Das Web ist und bleibt eine andere Welt.
  57. Dankeschön! Manuel Meyer Consultant, Trainer, Speaker manuel.meyer@trivadis.com Thomas Gassmann Consultant,

    Trainer, Speaker thomas.gassmann@trivadis.com @gassmanT www.thomasgassmann.net @manumeyer1 www.manuelmeyer.net