
VISYT Guide: Das Take Away & Lieferdienst-Portal
02. April 2020 – Die Corona-Krise trifft die Wirtschaft enorm und insbesondere auch kleine lokale Geschäfte. Wir durften ein spannendes Projekt entwickeln, das betroffenen Unternehmen hilft.
mexan AG
info@mexan.ch
Luzern
Hirschmattstrasse 36
6003 Luzern
041 500 01 01
Temporäre Adresse bis Juli 2020
c/o Coworking Luzern
Winkelriedstrasse 45
6003 Luzern
Aus ganz Europa pilgerten am ersten Tag über 750 und am zweiten Tag sogar über 1000 Webentwickler in die holländische Hauptstadt um die neuesten Errungenschaften der JavaScript-Frameworks zu entdecken und erlernen, aber auch um mit der Community zu diskutieren, sich auszutauschen und zu verbinden. Auch Tanja und ich waren dabei. In den nächsten paar Absätzen nehmen wir euch mit auf eine Tour durch die zwei Tage, berichten über die vielen verschiedenen Talks und geben am Schluss eine kleine Empfehlung für den kommenden Event ab.
Dieser Event war natürlich auch bei Tanja und mir fett im Kalender vermerkt und ein Blick auf die Liste der Themen und Sprecher machte Lust auf zwei interessante Tage in Amsterdam. Amsterdam ist ja auch für seine Kultur berühmt, weswegen wir uns neben der Konferenz auch mit den Van-Gogh-Museum, dem Anne-Frank-Haus, der Kirchenvielfalt und mehr beschäftigt haben.
Die Konferenz fand im «Amsterdam Theater» statt. Die Location war perfekt und der Vortragssaal war eine Mischung aus Kinosaal, Vorlesungssaal und Partytempel. Besonders beeindruckend war dabei die riesige 180° Leinwand. Auch die Organisation war bemerkenswert. Speditiv und ohne übertriebenes Schlange stehen wurden wir Teilnehmer mit «Geschenksäckchen» und Teilnehmerausweisen ausgestattet. Die Wartezeit bis zum Opening wurde mit Kaffee, Getränken und kleinen Snacks versüsst. Alle 3 Talks gab es eine kurze Kaffeepause, die auch dem Networking diente. Ausserdem gab es ein Inhouse-Catering zur Mittagszeit, das alle Bedürfnisse abdeckte und neben Salaten und DIY-Burgern auch typische holländische Pommes Frites im Angebot hatte.
JavaScript-Frameworks, welche den Frontendend-Entwickler davor bewahren, das Rad ständig neu zu erfinden, gibt es heute wie Sand am Meer und als Webagentur hat man die Qual der Wahl, wenn man sich für eines entscheiden soll.
In dieser Menge an Frameworks kristallisieren sich die drei folgenden Hauptvertreter heraus:
Und so ist es nicht verwunderlich, dass am ersten Tag des Events der Schwerpunkt auf genau diese drei Frameworks gelegt wurde, ohne dass diese sich gegenseitig konkurrenziert hätten. So konnte man sich ein eigenes Bild von den jeweiligen Technologien machen und ggf. auf die individuellen Anwendungsfälle schliessen.
Sarah ist ein wahrer Animationsexperte und ausserdem ein Mitglied des Vue.js-core-Teams. In ihrem Vortrag stellte sie Best Practices vor, um Webapplikationen mit kleinen, fast unmerklichen Komponentenübergängen zu versehen, um dadurch die User Experience deutlich zu erhöhen.
Wir kommen beide ursprünglich aus der React.js-Ecke, bevor wir uns in der mexan AG mit Vue.js auseinandergesetzt haben. Daher war es für uns besonders spannend, über den aktuellen Stand dieses Frameworks informiert zu werden, seitdem wir uns das letzte Mal damit auseinandergesetzt haben. Dieser Talk war jedoch eher eine generelle Einführungsvorlesung und ging auch nicht wirklich auf den Slogan «Framework for the mind» ein.
Auch wenn wir (v.a. Tanja) überhaupt keine Angular Fans sind, konnten wir viel aus diesem Talk mitnehmen. Zum einen, weil Simone eine mitreissende, kompetente Rednerin war, zum anderen, weil des Thema «Progressive Web Apps» gut abstrahiert wurde und dadurch viele Inputs für andere Frameworks gegeben wurden.
Dieser Talk gehörte zur etwas langatmigeren Sorte, zumal der Redner nicht ganz so mitreissend war wie andere. Auch das Thema «Mobx» liess die Abgrenzung zu den ähnlichen State-Management-Systemen «Flux» und «Redux» vermissen.
Ein sehr interessanter Vortrag der beiden Chopin Brüder, mit dem Ziel Vue.js als ernstzunehmende Alternative zu jQuery vorzustellen, was ihnen auch definitiv gelungen ist. Auch die mexan AG ist dabei jQuery durch Vue.js abzulösen um Technologieüberschneidungen innerhalb einer Applikation zu vermeiden.
Unserer Meinung nach zeigte vor allem dieser (stark mit Eigenwerbung gespickte) Talk die teilweise unnötige Komplexität von Angular und bestärkte uns klar darin, für unsere Anwendungsfälle weiterhin mit Vue.js zu arbeiten.
Ein weiterer React-Talk: dieser war wirklich sehr interessant und gab einen hervorragenden Überblick über die deutlich vorangeschrittene Weiterentwicklung des Frameworks. Beim Ausblick auf den bevorstehenden grossen Versionssprung bekamen wir direkt Lust darauf, mal wieder ein Projekt mit React.js zu realisieren.
Mit dem Ziel aufzuzeigen, dass Vue.js auch für grosse Applikationen geeignet ist, beschäftigte sich dieser Vortrag vor allem mit dem «Öko-System» um das Framework herum und betrachtete Lösungen wie «vue-router» und «vuex». Da wir selbst schon lange auf diese Lösungen setzen führte der einführende Charakter des Talks zu nicht vielen neuen Erkenntnissen, bestätigte uns aber, dass unsere Vorgehensweisen «State of the Art» sind.
Ein weiterer Angular Talk, welcher aufgrund des speziellen Themas nicht heruntergebrochen werden konnte. Dennoch nett zu hören, wie sich Angular mit State-Management beschäftigte.
Da die Themen der folgenden Talks nicht zu unseren Hauptschwerpunkten gehörten und wir für den darauffolgenden Event Tag möglichst fit sein wollten, beschlossen wir uns zu verabschieden und noch etwas von der Amsterdam-Stimmung mitzunehmen, um den Kopf wieder etwas frei zu kriegen.
Wenngleich die Talks meist spannend und unterhaltsam waren, muss der hohe Informationsgehalt erstmal verdaut werden, vor allem an einem Konferenztag, der so viele unterschiedliche Bereiche behandelt hat.
Unser eigentliches Highlight fand am zweiten Tag statt, wo wir uns ausschliesslich mit Vue.js und dessen Ökosystem beschäftigten. Da die mexan AG dieses Framework als Kerntechnologie einsetzt, versprachen wir uns vor allem von diesen Talks zahlreiche Tipps, Tricks und Inputs für unsere zukünftigen Arbeitsweisen.
Auch hier möchten wir die sehr gute Organisation zum Einlass loben. Die Organisatoren hatten sowohl Timing wie auch Teilnehmeransturm wieder gut im Griff.
Eingeleitet wurde der Tag vom Erfinder des Frameworks selber. Evan You erzählte in seiner Rede über die Vergangenheit, die Gegenwart und die Zukunft von Vue.js und stellte uns die Vue CLI in der Version 3.0 vor, die soeben den Beta-Status erreicht hat.
Erfahrungsgemäss werden im Arbeitsalltag selten Projekte von Grund auf neu realisiert, stattdessen wird die Optimierung eines vorhandenen Stacks gewünscht. Roman zeigte Best Practices, um Vue.js in vorhandene Applikationen und Umgebungen zu integrieren und thematisierte ausserdem die Realisierung als reine Single-Page-App (SPA) oder und den Aufbau als Multipage-App (MPA).
Auch wenn die mexan AG hauptsächlich eigene und dadurch hochkonfigurierbare Backends/APIs via Laravel entwickelt, war dieser Blick über den Tellerrand für uns sehr interessant. Mittels GraphQL-Server und dem Client Apollo können API-Zugriffe bis ins kleinste Detail standardisiert und validiert werden.
Für Entwicklungsgeschwindigkeit, User Experience, vor allem aber für die Suchmaschinenfreundlichkeit ist das Meta-Framework Nuxt.js von grosser Bedeutung. Neben einer hervorragenden Struktur und zahlreichen Hilfen bietet es vor allem die Möglichkeit zum «server-side-rendering» oder der Auslieferung von statischen Seiten, damit auch asynchrone Inhalte für die Suchmaschinen verfügbar werden.
Eduardo löste sich in seinem Animationsvortrag von den klassischen CSS-basierten Animationen und beschäftigte sich mit «dos and don’ts» bei State basierten Vue-Animationen. Zahlreiche Demoprogramme sorgten für einen unterhaltsamen und eindrücklichen Talk.
Wir sind überzeugt, hier eine Werbeveranstaltung eines Sponsors gehört zu haben. Es ging hier weniger darum, Best Practices für wiederverwendbare Komponenten zu liefern, sondern eher um die Darstellung des eigenen Frameworks, das Kendo-Komponenten vue konform ausliefert. Wie sinnvoll es ist, ein Komponentenframework in ein komponentenbasiertes Framework zu integrieren, muss jeder selbst für sich entscheiden.
Ein ungeliebtes, aber sehr wichtiges Thema ist das Testen einer Applikation, und hierbei unterscheidet sich die Frontendentwicklung stark von der Backendentwicklung, die weitestgehend linear durchgetestet werden kann. Aus dem Vue-Umfeld wurden die «vue-test-utils» vorgestellt, die mittels Testumgebung und zahlreichen Helferfunktionen das einfache Testen von Frontenddarstellungen ermöglichen.
Dieser Talk vom Entwickler des «Nuxt.js»-Meta-Frameworks behandelte die rein technische Sicht des «server-side-rendering» und war vermutlich der anspruchsvollste Vortrag des gesamten Events. Der gemeine Entwickler wird vermutlich immer ein vorgefertigtes Hilfsmittel dazu verwenden, dennoch war es sehr spannend und informativ, diesen Blick hinter die Kulissen zu erhalten.
Gerard – ein absoluter Angular Anhänger – wurde vom Veranstalter «genötigt», ein erstes Vue-Projekt zu realisieren, und der Community seine Erfahrungen mitzuteilen. Trotz wenig brauchbarem Informationsgehalt, war der Talk unterhaltsam und bestätigte uns erneut, die richtige Wahl mit unserer aktuellen Kerntechnologie getroffen zu haben.
Einer der unterhaltsamsten Vorträge des Events des enorm talentierten Ives van Hoorne, der seiner Online Entwicklungsumgebung «Codesandbox» präsentierte. Codesandbox unterstützt die Entwicklung u.a. mit React.js, Angular und Vue.js und berücksichtigt dabei Technologien wie npm, unterschiedliche Bundleprogramme, Babel, jest, uvm. Eine Lösung also, um immer und überall entwickeln zu können.
Mobile Development gehört nicht zu unserem alltäglichen Kernprogramm, vielleicht aber schon bald: Jen Looper führte aus, wie sich Vue.js zur Entwicklung mobiler Applikationen einsetzen lässt und berücksichtigte dabei auch die Unterschiede zur Web-Version der Applikation.
Sarah verliess für einmal ihr gewohntes Animationsumfeld und stellte uns die Arbeitsweise im serverlosen Umfeld vor, wobei «serverlos» eher mit «ohne einen Server betreuen zu müssen» übersetzt werden muss. Wie bereits erwähnt, bauen wir in der mexan AG die Backends meist selbst, aber mit den geballten Einsatzinformationen aus diesem Talk kann das Applikationsangebot doch deutlich weiterentwickelt werden.
Auch wenn sich der erste Event Tag nur einführend mit unserer Kerntechnologie Vue.js beschäftigte, war der Blick auf die anderen Möglichkeiten sehr wichtig. Zum einen währt keine Technologie ewig, zum anderen kann aus dem Ökosystem wie auch von den Stärken und Schwächen der anderen Frameworks viel gelernt werden. Der zweite Tag zeigte uns, dass sowohl die mexan AG wie auch die Arbeitsweise von uns Webentwicklern zeitgemäss und auf dem richtigen Weg ist. Allerdings gab er uns aber auch viele Inputs mit, die unseren Umgang mit dem Framework stark optimieren werden und den Vue-Horizont um ein Vielfaches erweitert haben. Die Teilnahme am Event ist von unserer Seite eine klare Empfehlung: Die Vielschichtigkeit der Redner und Themen, die tolle Location, die geniale Organisation und auch die grossartige Stadt Amsterdam haben die zwei Tage zu einem einzigartigen Erlebnis gemacht.
Alles in allem zwei sehr interessante und herausfordernde Tage mit vielen neuen Inputs und schönen Eindrücken aus Amsterdam.
02. April 2020 – Die Corona-Krise trifft die Wirtschaft enorm und insbesondere auch kleine lokale Geschäfte. Wir durften ein spannendes Projekt entwickeln, das betroffenen Unternehmen hilft.
23. März 2020 – Der Begriff Mobile First ist in aller Munde und für Web-Projekte immer mehr von Kunden gewünscht. Doch ist dieser Ansatz wirklich immer die richtige Vorgehensweise?
18. März 2020 – Das mexan-Team erlebte aufgrund eines erfolgreichen Projekts ein geselliges Weihnachtsessen in einer einmaligen Brauerei.
12. Februar 2020 – Mit dem Aufkommen von Trends verändert sich die Welt um uns herum ständig und mit ihnen auch die Art und Weise wie Websites oder Apps daherkommen.