Maximilian Berghoff Mayflower GmbH

„Es gibt absolut keinen Grund mehr, sich im Backend oder Frontend zu verstecken. Es ist mit einfachen Mitteln möglich, eine Web-App samt API und Docker-Container aufzusetzen.“

Ob nun für einen Prototyp, für den Start eines neuen Green-Field-Projekts oder einfach nur um dem Kunden die Möglichkeiten einer Funktion aufzuzeigen – eine Web-App samt API und einer Containerumgebung hochziehen zu können, sollte in jedem Team zum Grundwissen gehören. In den folgenden Abschnitten erfahren Sie, wie man förmlich in Minuten eine App aus dem Boden stampft.

Die Zeiten von reinen Backend-Entwicklern sind vorbei. Das soll nicht heißen, dass wir uns nur noch oberflächlich Fachwissen aneignen. Es bleibt weiter dabei, dass der Eine mehr ein Faible für das Frontend und der Andere für reinen Backend-Code hat. Doch wir sollten wissen, wie die anderen Teile funktionieren und im Team alle Aufgaben lösen können, die eine Applikation an uns stellt. Darum will ich Ihnen hier einen kompletten Durchstich vom Frontend über das Backend bis hin zu der Idee einer Containerumgebung aufzeigen. Eine solche Web-App wird unweigerlich deutlich mehr Frontend-Anteile beinhalten, weil wir in diesem Bereich mehr Geschwindigkeit und Freiraum in die Entwicklung der eigentlichen Funktion bekommen. Komplexere Features, wie zum Beispiel die Bestellstrecke in einem Shop, die Führung durch einen Workflow, wie wir ihn früher in Formularketten kannten, oder einfach nur der Ersatz einer Administrationsoberfläche, können durch eine Single-Page-Applikation deutlich einfacher umgesetzt werden. Selten ist die Aufgabe so geradlinig, dass man es in einfachen, in Request-Response basierten Anwendungen umsetzen kann. Administrationsoberflächen fallen immer wieder in einen CRUD-Ansatz zurück, der in den seltensten Fällen das gewünschte Verhalten widerspiegelt. Ich würde sogar so weit gehen, dass ich eine kleine Singular-App einem Wireframe vorziehe, wenn es darum geht, einen Prozess zu skizzieren, denn Code lässt sich einfacher schreiben als das umständliche Klicken durch eine Anwendung.

Die App

Viele Tutorials fangen mit einer Art To-do-App an. Dieser langen Liste möchte ich mich ungern anschließen. Damit Sie als Leser direkt sinnvolle Beispiele vor sich haben, möchte ich kurz Emma vorstellen. Hierbei geht es um den Rewrite der Emma. Bei der App handelt es sich um Unterstützung für die ehrenamtlichen Helfer der Tafel in Duisburg, die vielen Sprachen und Kulturen gegenüberstehen. Natürlich könnte man hier in Echtzeit Phrasen und Textblöcke aufnehmen und übersetzen lassen, doch hier soll es um eine einfache Lösung gehen. Darum haben mein Kollege Roland Golla und ich die ursprüngliche App-Idee wieder aufgegriffen und mit aktuellen Techniken versehen.

Um solch ein Unterfangen schnell auf die Beine stellen zu können, greife ich immer auf ein Framework zurück. Auch wenn solche Entscheidungen meist kontrovers diskutiert werden, sollte man sich hier immer zunächst auf den Use Case konzentrieren. Ein zweiter Punkt ist das Know-how im Team. Wenn hier schon Grundwissen vorhanden ist, kann das zur Beschleunigung der Prozesse beitragen. Ich entscheide mich bei vollständigen Applikationen immer wieder für Angular, das inzwischen in der Version 6 zur Verfügung steht. Für ein Projekt dieser Art beginne ich mit folgender Ordnerstruktur:

├── my-app
│   ├── src
│   │ ├── backend
│   │ └── frontend
│   └── docker-compose.yml

Da die meisten Tools, die wir hier verwenden, die Ordner selbständig anlegen, reicht es, den Ordner für src/ anzulegen. Tools? Ja genau, wir werden im Folgenden einige CLI-Anwendungen kennenlernen, die uns die Arbeit erleichtern. Alles, was wir dazu am Anfang benötigen, ist ein Node.js samt npm und PHP. Am Ende kann uns das auch der Container liefern, sodass wir lokal nur Docker brauchen.

Den vollständigen Artikel lesen Sie in der Ausgabe:

PHP Magazin 6.18 - "Web-App Quickstart: Web-App samt API und Docker-Container"

Alle Infos zum Heft
579858110Einfacher als gedacht: Web-App mitsamt API und Docker-Container aufsetzen
X
- Gib Deinen Standort ein -
- or -