Ein Praktikum bei codecentric: Teil 2

Und weiter geht die Reise…

Vor neun Monaten begann ein anderes Ich als Praktikant bei der codecentric: Ein Praktikum bei codecentric: Teil 1 . Wollte ich mich doch beruflich verändern, so hat dies letztendlich zu einem steten Wandel von allem geführt – mich selbst eingeschlossen. In der Zwischenzeit sind unglaublich interessante und vielfältige Dinge geschehen, so dass ich schon jetzt bedaure, dass mir nur diese wenigen Worte bleiben, um davon zu erzählen und meine Dankbarkeit auszudrücken. Denn meine Prüfung ist bestanden, die Umschulung absolviert und das Abschlussprojekt abgeschlossen. Meine Reise nähert sich wieder einem neuen Abschnitt, auch wenn ich aktuell noch nicht weiß wohin sie mich führen wird…

Meine Zeit bei codecentric stellte den berufspraktischen Teil meiner Umschulung dar. Dieser wird von der IHK mit einer Dauer von einem halben Jahr definiert. Um die variablen Prüfungstermine der IHK auszugleichen, wurde der Praktikumsvertrag von meinem Bildungsträger allerdings über neun, statt der üblichen sechs Monate abgeschlossen. Da ich mich von Anfang an wohl fühlte, behielten wir dann im gegenseitigem Einverständnis das Praktikumsverhältnis bei, welches üblicherweise mit dem erfolgreichen Bestehen der Prüfung endet. Deshalb durfte ich letztendlich ganze neun Monate mit den Kollegen vom Berliner Standort der codecentric AG verbringen. Und allen die während meiner Zeit zu Besuch waren.

Da der berufspraktische Teil einer Umschulung zum „Specialised Computer Scientist: Subject Software Development“ (zu deutsch: „Fachinformatiker: Fachrichtung Anwendungsentwicklung“) mit der Durchführung eines Abschlussprojekts verbunden ist, möchte ich auch dieses vorstellen.

Wer hören will, darf fühlen: Das AUA-Tool

Alle Changes sind gepushed. Der letzte Commit reviewed und die Accounts migriert. Die Dinge befinden sich im Abschluss und meine Zeit nähert sich dem Ende. Was bleibt nach neun Monaten? – Mein IHK-Projekt, das „Analysis of User Acceptance” – Tool.

Die IHK definiert im Rahmenlehrplan als Abschlussarbeit die Planung und Durchführung eines Softwareentwicklungs-Projekts. Meine Anwendung soll sich dabei einem ganz bestimmten Punkt widmen, der sogenannten Nutzerakzeptanz. Diese wird grundsätzlich durch die Analyse statistischer Nutzerdaten von Anwendungen oder Features kontrolliert und kann im Kontext des Controlling auch als KPI von Applikationen dienen. Um ein simples Beispiel zu geben:

Für eine Anwendung wird ein neues Feature veröffentlicht, welches es ermöglicht einer To-Do-App eine neue Art von Listenpunkt hinzuzufügen. Nun kann man in der Datenbank die Anzahl der erstellten Listenpunkt nach der Veröffentlichung überprüfen. Stellt man diese dann z.B. im nächsten Schritt ins Verhältnis zu früheren Veröffentlichungen neuer Features, so kann man Aussagen über die Beliebtheit bei Nutzern, bzw. die „Akzeptanz“ dieses neuen Features treffen.

Simpel ausgedrückt: Wer zuhören will, bzw. Wert auf eine gute UX/UI-Erfahrung legt, darf davon profitieren, das Nutzer sich wohl fühlen. So kann speziell durch Monitoring, bzw. das Einholen von Feedback in der Entwicklungsphase (mein Kollege Oliver hat erst kürzlich einen Artikel zu dieser Thematik verfasst) und durch ständige Analyse der Nutzerakzeptanz nach Veröffentlichung der Anwendung, die Chance für eine erfolgreiche Zukunft der Applikation stark erhöht werden. Mein Tool analysiert hierbei die Nutzerakzeptanz eines internen, von Kollegen entwickelten und angewendeten Tools für dezentralisierte Sprint-Reviews.

Spring is Back(-end)!

Um mir im Kontext meiner Umschulung möglichste viele Lerninhalte zu ermöglichen, plante mein Projektbetreuer Oliver Hoogvliet eine modulare Anwendung mit mir. Deshalb entwarfen wir ein soweit wie möglich entkoppeltes Java-Backend und ein JavaScript-Frontend. Dabei durfte ich Dank meiner Kollegen Methoden wie Test-Driven-Design, Clean Code und Convention-over-Configuration kennen lernen. Außerdem grundlegende Prinzipien und Werte moderner und agiler Softwareentwicklung, wie die des Manifest für agile Software-Entwicklung . Natürlich wurde mit Scrum auch das Thema Projektmanagement bedient.

Das Backend wurde hierbei mit Spring Boot, einer Erweiterung des Spring Frameworks speziell für die schnelle Entwicklung von Enterprise-tauglichen Java-Anwendungen, realisiert. Spring ist ein quelloffenes Java-Framework bei welchem die Entkopplung der Anwendungskomponenten priorisiert wird. Dies wird über einen aspektorierten Programmieransatz (AOP) und Prinzipien wie Dependency Injection (DI), sowie eine MVC-Architektur umgesetzt. Zur Laufzeit bildet den einzigen Verbindungspunkt zum Frontend eine RESTful Web-API, welche ein formatiertes JSON bereitstellt. Wie so oft bietet das JSON-Format den Vorteil der hohen Kompatibilität und der einfachen Manipulation im Frontend.

Besagtes JSON-Objekt wird im Frontend meiner Anwendung mit dem JavaScript-Framework Vue.js visualisiert. Wer sich für dieses UI-Framework interessiert, dem möchte ich die umfangreichen Artikel meines Kollegen Toni Haupt zu Vue.js, beginnend mit: Vue.js – it’s simple until you make it complicated empfehlen. Er geht auch näher darauf ein wie bei Änderungen in Produktion mit “Diffing” über das Virtual-DOM ein performantes, modulares Hot-Reloading der betroffenen Komponente ausgelöst wird und welche Vor- und Nachteile Vue.js gegenüber vergleichbaren Frameworks aufweist.

Um dann Spring-Applikationen in Verbindung mit Vue.js zu nutzen, empfiehlt sich die speziell für Vue.js vorhandene vue-cli . Diese wird einfach in das erstellte Java-Projekt integriert. Diese Lösung bietet dabei einen ganz entscheidenden Vorteil für meinen speziellen Anwendungsfall, und zwar Dank der Chart.js-Bibliothek.

Alles hat ein (Front-)Ende, nur Chart.js hat 8

Die Bibliothek Chart.js kann nur eine Sache. Die dafür so richtig gut. Mithilfe von acht vor-implementierten Tabellen-Typen kann man in Sekundenschnelle, die passende Datenstruktur vorausgesetzt, Statistiken visualisieren und anpassen. Es erfüllt außerdem mit einer guten Performance, sowie der Kompatibilität zu den Frameworks jQuery und Angular, für die Frontend-Entwicklung wichtige Anforderungen. Natürlich ist es auch responsiv. Dies alles wird über das HTML5-Element <>, JSON und komponentenbasierte Architektur realisiert. Den passenden Wrapper für Vue.js, genannt Vue-Chart.js gibt es natürlich auch.

Zunächst benötigt Chart.js hier als Verbindungspunkt eine Instanz der „Chart class“. Sobald man diese implementiert hat und ein entsprechend formatiertes JSON zur Verfügung stellt, importiert man den gewünschten Tabellen-Typ. Für ein Balkendiagramm z.B. „Bar“, mit dem folgenden Befehl: „import { Bar } from ‚vue-chartjs‘;“. Diese Vue-Komponente wird dann über den Befehl „export default Bar.extend()“ angepasst und exportiert.

Der Clou an der Sache: Möchte man die visualisierten Daten am Ende doch lieber als Liniendiagramm realisieren, ist alles was man tun muss, den Im- und Export entsprechend anzupassen: „import { Line } from ‚vue-chartjs‘;“, sowie „export default Line.extend()“. Diese Möglichkeit erleichtert den Wechsel zwischen den verschiedenen Tabellentypen ungemein, so dass sie während der Entwicklung buchstäblich in Sekundenschnelle verändert werden können. Fügt man dem Ganzen noch einen hübschen Gradienten hinzu kann das Ergebnis folgendermaßen aussehen:

Der Vollständigkeit halber sei gesagt, dass die IHK ein weiteres Kriterium zur Durchführung des Projekts definiert. Das Anfertigen einer ca. 40-seitigen Projekt-Dokumentation. Um auch bei diesem Aspekt etwas neues zu lernen integrierte ich als letzten Schritt parallel zur Anfertigung der schriftlichen Dokumentation das quelloffene Framework Swagger in meinem Projekt. Um genau zu sein ein Tool von Springfox , eine automatisierte API-Dokumentation,  speziell zugeschnitten für die Dokumentation von API in Spring-Applikationen. Swagger hieß der ursprüngliche API Standard, heute OpenAPI mit dem Springfox arbeitet. Über Annotationen wie „@Api“ und „@ApiResponses“ wird für Springfox der Kontext der API definiert. Zur Laufzeit wird dann von Springfox die Swagger-Beschreibung, die sogenannte Swagger-UI generiert und stellt eine HTML-Visualisierung unter einem definierten Port, standardmäßig dem “localhost:8080/swagger-ui.html” zur Verfügung. Diese kann dann über den gesamten Lebenszyklus der Applikation durch simples Anpassen besagter Annotationen und der /swagger.yaml bzw. /swagger.json, aktualisiert und gepflegt werden. So wird eine dauerhafte, konsistente Dokumentation der API unterstützt.

Lehre einen Mann zu fischen…

…und du ernährst ihn für sein Leben. Schon Konfuzius beschrieb mit dieser Weisheit die Tatsache, dass nichts so wertvoll ist wie Bildung. Dieser Grundsatz hat mich über die letzten Jahre stets begleitet. Doch kein Umfeld unterstützte mich bisher in dieser Hinsicht wie codecentric und die Menschen, die über die letzten Monate meine Kollegen waren. Erfreulicherweise durfte ich diese Kollegen bereits auf dem „Offsite“ im August, einer firmeninternen Un-Konferenz gefüllt mit Open-Space-Themen und Workshops, abseits vom beruflichen Alltag, kennen lernen. Dies hat mir ermöglicht meine Kollegen auf eine Art und Weise kennen zu lernen, welche mir bisher unbekannt war. Natürlich strahlt über einen Zeitraum von neun Monaten nicht jeden Tag die Sonne. Doch immer wieder Wert auf ein gutes Miteinander zu legen ist letzten Endes nicht nur anstrengend. Es führt auch zu positiven Ergebnissen. Und so zum ersten Mal in meinem Leben auf eine rundum positive berufliche Erfahrung zurück blicken.

Durch meinen Praktikumsbetreuer Marcel Wolf hatte ich einen unglaublichen Mentor, welcher meine Bemühungen in die richtige Richtung lenkte. Die Standort Bibliothek mit Fachbüchern mit allen Themen rund um Programmierung habe ich mehr als nur einmal genutzt. Ich war auf Meetups, Usergroup-Treffen und Konferenzen. Konnte netzwerken, lernte andere Unternehmen der Berliner IT-Landschaft und Ihre Mitarbeiter kennen. Durfte lernen was es heißt in einem modernen Unternehmen Software zu entwickeln und kollaborativ zu arbeiten. Lernte Paradigmen, Prinzipien, Methoden, Communities, Philosophien und Konzepte kennen.  Erhielt von verschiedensten Seiten Input zu jedem Thema, das man sich vorstellen kann. Vielleicht erscheinen manch einem Leser diese Dinge selbstverständlich. Für mich sind sie es nicht, deshalb bin ich dankbar dafür. Und mehr bleibt auch nicht zu sagen.

export default Paul;

Vielen, vielen Dank. Euch allen. Mein letzer Tag ist gekommen und es ist Zeit, dass meine Reise weitergeht. Ich wünsche Euch alles Gute und freue mich auf jeden Tag an dem wir uns wieder sehen. Ich möchte mich bei Rainer Vehns und Mirko Novakovic bedanken, die mit der codecentric AG ein Unternehmen ins Leben gerufen haben, in dem ich einen Platz finden konnte und zu dem ich eines Tages vielleicht wieder zurückkehre. Wer die codecentric kennt weiß, dass ich beileibe nicht der einzige Mensch bin der unterstützt wurde. Projekte wie Devugees, Traineeships und das offene Wesen der Mitarbeiter geben immer wieder Menschen eine berufliche Chance. Ich persönlich finde das bei weitem nicht selbstverständlich und habe gelernt, dass mir diese Unternehmenskultur und Philosophien sowie die damit verbundenen Werte wichtig sind.

Bei den Kollegen des Berliner Standorts möchte ich mich bedanken, dass sie jeden Tag aufs neue versuchen, diese Werte zu leben. Meinen besonderen Dank auch an meinen Projektbetreuer Oliver Hoogvliet, für all die Dinge die er mir beigebracht hat und die Gespräche, welche selbst zwischen Tür und Angel manches Mal so interessant wurden, dass sie buchstäblich Stunden dauerten. (An dieser Stelle eine anonyme Entschuldigung meinerseits an Alle, die Oliver hat warten lassen für mich).

Toni Haupt gilt mein Dank für all die Mühe, welche er sich gemacht hat, um mir Frontend-Entwicklung beizubringen. Mir auch Prinzipien wie Atomic Design oder Maintainable CSS zu vermitteln und mir dabei zu helfen im Strudel der JavaScript Frameworks und zwischen den Wirbeln der modernen Webentwicklung die Übersicht zu behalten.

Bei Raimar Falke und Daniel Hill bedanke ich mich für Ihre Unterstützung und dafür, dass Sie mir zur Verfügung standen für Schulungen. Auch Armin Hallim-Schneider. Er weiß wieso.

Und nicht zuletzt bei allen Kollegen. Für Ihr Feedback, Ihren Input und für meinen Alltag, der fast immer schön war.

Danke.