Wie man von gut nach großartig kommt

Dies ist eine Einführung in eine mehrteilige Serie, in der wir untersuchen, wie Front-End-Entwicklungsprozesse effizienter und skalierbarer gestaltet werden können, um ein besseres Produkt schneller zu machen.

„Eine Gruppe von Menschen, die über einen Laptop und Papier nachdenken“ von Štefan Štefančík auf Unsplash

Ein großartiges Produkt zu bauen, ist oft kein Alleingang. Die aufwändigsten Setups würden mehrere Teams aus Kreativ-, Marketing-, Produkt- und Technologieteams umfassen. Selbst wenn Sie ein Unternehmen sind, müssen Sie mit Ihren Benutzern interagieren, um deren Feedback zu den Funktionen für sie zu erhalten. Dieser iterative Rahmen des zyklischen Entwurfsprozesses zur Verbesserung von Qualität und Funktion wird allgemein als agiler Iterations-Workflow bezeichnet.

Je schneller Sie iterieren können, desto besser wird Ihr Produkt.

Bei StashAway hatten wir, als das Front-End-Team mit der Entwicklung des webbasierten Produkts begann, eine kürzere Einführungszeit und weniger strenge Produktentwicklungs- und Managementprozesse. Jetzt, da das Produkt ausgereift ist und mehr Funktionen erforscht und hinzugefügt werden, möchten wir unseren Prozess zum Aufbau einer besseren und skalierbareren Front-End-Architektur für das Produkt verbessern und straffen. Unser derzeitiges Setup würde es uns nicht ermöglichen, in Bezug auf Funktionsangebote und Ländererweiterungen effektiv zu skalieren.

Um ein großartiges Produkt zu erstellen, müssen wir den Iterations-Workflow perfektionieren. Es gibt viele Literatur zum Produktmanagement, und das ist nicht der Umfang dieser Artikelserie. Was wir untersuchen möchten, ist, wie wir mit Iterationen in der Prototypen- und Bauphase schneller arbeiten können. Dazu müssen wir die internen Entwicklungs- und Genehmigungsprozesse unseres Teams formalisieren, damit wir effizienter mit unseren Kreativ- und Produktteams zusammenarbeiten können . Wir glauben, dass wir dies erreichen können, indem wir die kontinuierliche Integration und den Lieferfluss in Verbindung mit dem weiter oben beschriebenen Workflow für die Produktiteration nutzen.

Letztendlich wollen wir uns dem deklarativen Programmierparadigma nähern, das ausdrückt, was wir in unseren Anwendungen tun möchten, anstatt das Wie zwingend zu codieren. Dazu müssen wir die Grundlagen für die Erstellung unserer Bausteine ​​legen.

Wir beginnen damit, die Trennung zwischen Benutzeroberfläche und Anwendungslogik zu erweitern, sodass die Entwicklung von Benutzeroberflächenkomponenten zu einer separaten Aktivität wird. Es wird ein eigenes zentrales Repository sowie gemeinsame Dienstprogramme, eine eigene Suite von Unit-, Akzeptanz- und Regressionstests haben. Unsere UI-Komponenten können nun für Variationen von Websites und Web-Apps wiederverwendet, komponiert und themenbezogen werden. In Verbindung mit Storybook können wir eine interaktive Musterbibliothek erstellen.

Wir können darauf vertrauen, dass unsere UI-Komponenten genau so aussehen und sich so verhalten, wie es sollte, damit wir uns auf die unterhaltsamen und wichtigen Dinge konzentrieren können - die Anwendungen und deren Verhalten. Wir können den gleichen Prozess mit unseren UI-Komponenten auf unsere anwendungsspezifischen Projekte anwenden, mit spezifischeren Testsuiten, um die Abdeckung zu maximieren. Nur mit diesen Testsuiten können wir das Vertrauen der Entwickler in das Pushen und Bereitstellen von Code erhöhen und im Gegenzug die Iterationsgeschwindigkeit erhöhen.

Mit diesem zentralen Repository komponierbarer Komponenten können wir Ideen für Prototypen- und Flurbenutzertests erstellen und sogar neue Funktionen schneller bereitstellen.

Software-Teststufen

Sie werden bemerkt haben, dass wir die Botschaft, dass Testen wichtig ist, nach Hause gehämmert haben. Das Testen von Software ist ein großes Thema in der Softwareentwicklung, aber konzentrieren wir uns auf die vier Testebenen, die für den reibungslosen Ablauf eines kontinuierlichen Lieferprozesses von entscheidender Bedeutung sind - Einheit, Integration, System und Akzeptanz.

Mit Unit-Tests validieren wir einzelne Komponenten, die kleinsten testbaren Einheiten, in einer Software. In unserem Fall sind dies normalerweise die UI-Komponenten oder Hilfsprogrammmethoden. Integrationstests finden statt, wenn die einzelnen Komponenten als Gruppe getestet werden. Dies könnte beispielsweise eine Funktion wie einen Taschenrechner bedeuten, in dem Sie Schaltflächen und einen Anzeigebildschirm haben und sicherstellen, dass bei einem Tastendruck die richtige Nummer angezeigt wird. Bei der API kann ein Endpunkt eine Datenbankverbindung herstellen, um einen Datensatz abzurufen.

Unit- und Integrationstests beseitigen in der Regel die gröbsten Fehler, bevor wir mit der Staging-Bereitstellung beginnen. Dies spart Zeit für interne und externe Tester, die das fertige und integrierte System auf Übereinstimmung mit den Funktions- und Geschäftsanforderungen prüfen - Bereiche für System- und Abnahmetests. Sobald die Software die vier Testebenen bestanden hat, können wir sie in der Produktion bereitstellen.

Dies ist ein kleiner Vorgeschmack darauf, wie wir die Prozesse unseres Front-End-Teams effizienter gestalten möchten. Wir werden in den folgenden Beiträgen über die Front-End-Entwicklung bei StashAway ausführlicher auf die Implementierung eingehen. Bleib dran!

Wir sind ständig auf der Suche nach großartigen technischen Talenten für unser Team - besuchen Sie unsere Website, um mehr zu erfahren, und wenden Sie sich an uns!