React war gestern – Front-End Applikationen mit Web-Components

Einleitung

Der de-facto Standard bei der Entwicklung von Front-End-Applikationen sind Frameworks wie Angular, VueJS oder React. Inzwischen ist die Browser-Plattform jedoch mächtig genug, sodass es viele dieser Frameworks mit ihren Abstraktionen nicht mehr braucht.

Das neue Motto ist: use the platform! Entwickler sollten heute keine React- oder Angular-Entwickler, sondern wieder Web-Entwickler mit Fokus auf Browser-APIs und -Standards sein.

Programm

Gemeinsam mit den Teilnehmern bauen wir eine Single-Page-Applikation (SPA) mit modernen Standards und Tools. Gemäss dem Motto „Weniger ist mehr“ verzichten wir auf einen Build (z.B. mit Webpack oder Rollup) und verwenden ausschliesslich die bestehenden Browser-APIs.

Unsere Applikation zeigt alle Restaurants im Umkreis des Benutzers oder eines anderen Standorts. Zu jedem Restaurant können zusätzliche Informationen abgerufen sowie eine Wegbeschreibung angezeigt werden. Als Datenquelle verwenden wir OpenStreetMap. Am Ende des Workshops publizieren wir die Applikation in der Cloud.

Kursziel

– Einführung und Verwendung von Webkomponenten und modernen Browser-APIs
– Einführung und Verwendung von leichtgewichtigen Webkomponenten-Abstraktionen (lit-html & LitElement)
– Kennenlernen von Tools, um möglichst ohne einen „Build“ auszukommen
– Slots, CSS Properties, open-wc, ES-Modules, Snowpack sowie SOLID sind keine Fremdwörter mehr
– Deployment von SPAs in die Cloud

Adressaten

Alle Entwickler mit Interesse und/oder Fokus auf moderne Web-Applikationen und -Front-Ends. Der Workshop ist sicher auch für alle interessant, die über den Tellerrand der Applikationsentwicklung mit gängigen Frameworks blicken möchten.

Voraussetzungen

– HTML, CSS + JavaScript Know-how
– Erfahrung mit Node, NPM und Git von Vorteil

Infrastruktur

– Lauffähige Node + NPM Umgebung
– Code Editor / IDE
– Moderner Webbrowser
– evtl. GitHub-Account