HTML und CSS sind integraler Bestandteil der täglichen Arbeit von Softwareentwicklern. Vielen fehlt aber leider das Detailwissen. Zudem lässt sich speziell CSS mit keiner anderen Technik vergleichen.
Es ist also an der Zeit, die Grundkonzepte der beiden wichtigen Frontend-Techniken zu vermitteln. Wir schauen uns die Semantik von HTML an, reden über Browsertests. Wichtig ist natürlich ein Verständnis der Kaskade, der Spezifität, dem Geltungsbereich von Styles. Wir reden über Floats und schauen uns die Funktionsweise von Grids an.
Es soll viel Platz und Zeit für eigene Experimente sein. Alle Teilnehmer sind aufgefordert, offene Fragen mitzubringen. Dieser Workshop ist der beste Ort, sie zu klären.
Das JavaScript-Ökosystem entwickelt sich mit rasender Geschwindigkeit weiter und selbst wer jeden Tag mit Webtechnologien arbeitet, kann sich schnell abgehängt fühlen – gerade auf einer Konferenz über die neuesten heißen Tools und Techniken! Dieser Workshop schafft Abhilfe. Im Crashkurs-Verfahren lernt ihr alles, was es über modernes idiomatisches JavaScript des Jahres 2019 zu wissen gibt. Die neuesten syntaktischen Erweiterungen (z. B. Klassen und Destructuring) sind ebenso Thema wie die neuesten Must-Have-Features um asynchrone Programmierung (Promises und asynchrone Funktionen) und die aktuellen Standards und Hilfsmittel zur Organisation von Projekten (ECMAScript-Module und TypeScript). Dieser Workshop macht euch fit für den Rest der Konferenz. Er ist für Frontend-Webentwickler und Kenner von dynamischen Scriptsprachen wie etwa PHP ausgelegt. Falls ihr eher in Java oder C# zu Hause seid, seid ihr im zeitgleich stattfindenden Workshop „JavaScript für Softwareentwickler – für Einsteiger und Umsteiger“ besser aufgehoben.
Sie entwickeln Applikationen in Java oder C#, Klassen und Funktionen sind für Sie alte Bekannte, aber die Tiefen von JavaScript sind Ihnen noch nicht so geläufig? Dann ist dieser Workshop genau das Richtige für Sie. Wir behandeln alle wichtigen Themen, die Ihnen als Entwickler in der JavaScript-Welt begegnen. Von den grundlegenden Konzepten wie Datentypen, Schleifen und Bedingungen über Funktionen und Objekte bis hin zu modernen Schnittstellen wie Rest und Spread, Generatoren oder das neue Modulsystem. Ziel dieses Workshops ist es, ein Verständnis für die Sprache JavaScript und deren Konzepte wie die prototypenbasierte Objektorientierung oder den Umgang mit Asynchronität zu schaffen und zwar abseits der etablierten Frameworks. Im Workshop gehen wir zusammen auf die verschiedenen Aspekte von JavaScript ein. Sie lernen sowohl die objektorientierten als auch die funktionalen Ansätze der Sprache und natürlich jede Menge neue Sprachfeatures kennen. Der Workshop richtet sich an alle Ein- und Umsteiger in JavaScript, die schon immer wissen wollten, wie die Sprache wirklich tickt.
HTML und CSS sind integraler Bestandteil der täglichen Arbeit von Softwareentwicklern. Vielen fehlt aber leider das Detailwissen. Zudem lässt sich speziell CSS mit keiner anderen Technik vergleichen.
Es ist also an der Zeit, die Grundkonzepte der beiden wichtigen Frontend-Techniken zu vermitteln. Wir schauen uns die Semantik von HTML an, reden über Browsertests. Wichtig ist natürlich ein Verständnis der Kaskade, der Spezifität, dem Geltungsbereich von Styles. Wir reden über Floats und schauen uns die Funktionsweise von Grids an.
Es soll viel Platz und Zeit für eigene Experimente sein. Alle Teilnehmer sind aufgefordert, offene Fragen mitzubringen. Dieser Workshop ist der beste Ort, sie zu klären.
Das JavaScript-Ökosystem entwickelt sich mit rasender Geschwindigkeit weiter und selbst wer jeden Tag mit Webtechnologien arbeitet, kann sich schnell abgehängt fühlen – gerade auf einer Konferenz über die neuesten heißen Tools und Techniken! Dieser Workshop schafft Abhilfe. Im Crashkurs-Verfahren lernt ihr alles, was es über modernes idiomatisches JavaScript des Jahres 2019 zu wissen gibt. Die neuesten syntaktischen Erweiterungen (z. B. Klassen und Destructuring) sind ebenso Thema wie die neuesten Must-Have-Features um asynchrone Programmierung (Promises und asynchrone Funktionen) und die aktuellen Standards und Hilfsmittel zur Organisation von Projekten (ECMAScript-Module und TypeScript). Dieser Workshop macht euch fit für den Rest der Konferenz. Er ist für Frontend-Webentwickler und Kenner von dynamischen Scriptsprachen wie etwa PHP ausgelegt. Falls ihr eher in Java oder C# zu Hause seid, seid ihr im zeitgleich stattfindenden Workshop „JavaScript für Softwareentwickler – für Einsteiger und Umsteiger“ besser aufgehoben.
Sie entwickeln Applikationen in Java oder C#, Klassen und Funktionen sind für Sie alte Bekannte, aber die Tiefen von JavaScript sind Ihnen noch nicht so geläufig? Dann ist dieser Workshop genau das Richtige für Sie. Wir behandeln alle wichtigen Themen, die Ihnen als Entwickler in der JavaScript-Welt begegnen. Von den grundlegenden Konzepten wie Datentypen, Schleifen und Bedingungen über Funktionen und Objekte bis hin zu modernen Schnittstellen wie Rest und Spread, Generatoren oder das neue Modulsystem. Ziel dieses Workshops ist es, ein Verständnis für die Sprache JavaScript und deren Konzepte wie die prototypenbasierte Objektorientierung oder den Umgang mit Asynchronität zu schaffen und zwar abseits der etablierten Frameworks. Im Workshop gehen wir zusammen auf die verschiedenen Aspekte von JavaScript ein. Sie lernen sowohl die objektorientierten als auch die funktionalen Ansätze der Sprache und natürlich jede Menge neue Sprachfeatures kennen. Der Workshop richtet sich an alle Ein- und Umsteiger in JavaScript, die schon immer wissen wollten, wie die Sprache wirklich tickt.
Mit React-Anwendungen kommen die Buzzwords. Isomorph, Functional, Components, Progressive Web-Apps und Static Type Checking sind nur ganz wenige.
In diesem ganztägigen Workshop bringen Hans-Christian Otto und Elmar Burke Licht ins Dunkel und die Teilnehmer werden beim Bau einer Anwendung begleitet die React und TypeScript einsetzen wird. Wir konzentrieren uns auf die Grundlagen für den Umgang mit React, dazu gehört auch das Testen der Anwendungsteile.
Zielgruppe: Der Workshop richtet sich an all jene, die bisher wenig bis gar keine Erfahrung mit React haben und Lust auf Neues besitzen.
Am nächsten Tag wird auf die Ergebnisse dieses Workshops aufgebaut und das Wissen ergänzt und um weitere Konzepte erweitert.
Router sind der Dreh- und Angelpunkt der meisten Single Page Anwendungen. Die offizielle Implementierung für Angular kommt mit einigen äußerst interessanten Konzepten. Sie unterstützt Child-Routes für hierarchische Views und Aux-Routes zur Organisation mehrerer paralleler Routen. Daneben können Anwendungen mit Guards ins Routing eingreifen und so das Aktivieren bzw. Deaktivieren von Routen verhindern. Außerdem können Resolver Daten im Zuge eines Routen-Wechsels laden und unter Nutzung von Routing Events kann sich die Anwendung über die Aktionen des Routers auf dem Laufenden halten. Um die Startgeschwindigkeit bei großen Anwendungen zu erhöhen, kann der Router auch einzelne Anwendungsteile erst bei Bedarf nachladen (Lazy Loading). In diesem Workshop erfahren Sie anhand einer durchgängigen Beispielanwendung mit praxisnahen Use Cases, was sich hinter diesen Konzepten verbirgt ein und wie Sie sie in Ihren Projekten nutzen können.
Zielgruppe: Einsteiger
Angular ist das aktuelle Single-Page-Framework von Google. Es vereinfacht die Implementierung selbst großer Webanwendungen, die nicht nur im Browser, sondern auch als App auf Ihrem Smartphone oder dem Desktop ausgeführt werden können. Sie haben von Angular schon viel gehört und möchten wissen, wie damit entwickelt wird? Setzen Sie das Vorgängerframework AngularJS ein und planen den Umstieg? Oder haben Sie Angular bereits bei Projekten im Einsatz und möchten die Grundkonzepte besser verstehen? Dann sind Sie bei diesem ganztägigen Workshop genau richtig. David Müllerchen (@webdave_de) und Tobias Struckmeier (@tobmaster) rollen die Angular-Story komplett von vorne auf: Lernen Sie einige Tricks und Kniffe sowie den Unterschied zwischen Komponenten, Direktiven, Pipes und Services anhand einiger Aufgaben kennen. Sie erfahren, wie Komponenten untereinander kommunizieren können, Benutzereingaben mithilfe von Formularen erfasst oder Anwendungssichten über das Routing gezielt adressiert und parametrisiert werden. Eben von 0 auf 100!
Zielgruppe: Einsteiger
Testframeworks für JavaScript gibt es wie Sand am Meer und trotzdem sind nicht alle JavaScript-Applikationen so getestet wie sie es sein sollten. Mit diesem Workshop senken wir die Einstiegshürde ins Testen von Applikationen. Sie erfahren mehr über die Konzepte und Methoden, die den Testframeworks zugrunde liegen, sodass Sie das erworbene Wissen in verschiedenen Umgebungen anwenden können. Sie lernen Tests zu schreiben, den Umgang mit Test Doubles sowie den Einsatz von Fixtures und das Testen von asynchronen Operationen. Zum Einsatz kommen Bibliotheken wie Jasmine, Karma und Jest.
Zielgruppe: Dieser Workshop richtet sich an JavaScript-Entwickler, die die Qualität und Stabilität ihrer Applikation verbessern möchten.
Webtechnologien funktionieren. Sie sind mächtiger und umfangreicher denn je. Und dennoch sind wir mit ihnen auf das Web beschränkt. Doch dank Electron können wir uns von diesen Einschränkungen befreien und auf den Desktop wandern.
Electron ist ein Framework zur Entwicklung nativer cross-plattform Anwendung mittels Webtechnologien. In dieser Session lernen sie nicht nur, was Electron genau ist, sondern außerdem, wie sie es nutzen können um sich vom Web zu lösen und mit JavaScript, HTML, CSS und Co. eine Desktop-Applikation zu bauen. Ihr Trainer Jakob Westhoff beleuchtet hierbei nicht nur die Grundlagen, sondern wird ihnen auch die unterschiedlichen Frameworks und Helferlein vorstellen, welche Ihnen die Entwicklung mit Electron ein vielfaches leichter machen.
Schauen auch sie über den Tellerrand und brechen aus den Beschränkungen des Browsers aus.
Flexbox ist heute das Mittel der Wahl zum Anordnen und zur Ausrichtung von Komponenten. Flexbox bietet dabei genau die Flexibilität, die wir heute brauchen. Der Workshop vermittelt Ihnen alle wichtigen Techniken zum Umstieg und zur Verwendung von Flexbox.
Verschlüsselung, der Schutz der Privatsphäre und Co. sind spätestens seit den Enthüllungen von Edward Snowden ein Thema, um das sich jedes Unternehmen kümmern sollte. Die Einstiegshürden scheinen allerdings hoch: Verschiedene Arten von Verschlüsselung, zahlreiche unverständlich benannte Algorithmen, der Unterschied zwischen Verschlüsselung und Hashing, der Einsatz von Message Authentication Codes (MACs), ... all das sorgt zunächst für mehr Verwirrung als für erste Erfolge. Golo Roden führt Sie in diesem Workshop auf leicht verständliche und anschauliche Weise in das Thema Kryptografie in Verbindung mit JavaScript und Node.js ein und zeigt, was es mit den verschiedenen Arten von Algorithmen auf sich hat. Sie lernen, welches Verfahren sich wann eignet und auf welche Fallstricke und Stolperfallen Sie achten müssen.
Mit React-Anwendungen kommen die Buzzwords. Isomorph, Functional, Components, Progressive Web-Apps und Static Type Checking sind nur ganz wenige.
In diesem ganztägigen Workshop bringen Hans-Christian Otto und Elmar Burke Licht ins Dunkel und die Teilnehmer werden beim Bau einer Anwendung begleitet die React und TypeScript einsetzen wird. Wir konzentrieren uns auf die Grundlagen für den Umgang mit React, dazu gehört auch das Testen der Anwendungsteile.
Zielgruppe: Der Workshop richtet sich an all jene, die bisher wenig bis gar keine Erfahrung mit React haben und Lust auf Neues besitzen.
Am nächsten Tag wird auf die Ergebnisse dieses Workshops aufgebaut und das Wissen ergänzt und um weitere Konzepte erweitert.
Angular ist das aktuelle Single-Page-Framework von Google. Es vereinfacht die Implementierung selbst großer Webanwendungen, die nicht nur im Browser, sondern auch als App auf Ihrem Smartphone oder dem Desktop ausgeführt werden können. Sie haben von Angular schon viel gehört und möchten wissen, wie damit entwickelt wird? Setzen Sie das Vorgängerframework AngularJS ein und planen den Umstieg? Oder haben Sie Angular bereits bei Projekten im Einsatz und möchten die Grundkonzepte besser verstehen? Dann sind Sie bei diesem ganztägigen Workshop genau richtig. David Müllerchen (@webdave_de) und Tobias Struckmeier (@tobmaster) rollen die Angular-Story komplett von vorne auf: Lernen Sie einige Tricks und Kniffe sowie den Unterschied zwischen Komponenten, Direktiven, Pipes und Services anhand einiger Aufgaben kennen. Sie erfahren, wie Komponenten untereinander kommunizieren können, Benutzereingaben mithilfe von Formularen erfasst oder Anwendungssichten über das Routing gezielt adressiert und parametrisiert werden. Eben von 0 auf 100!
Zielgruppe: Einsteiger
Testframeworks für JavaScript gibt es wie Sand am Meer und trotzdem sind nicht alle JavaScript-Applikationen so getestet wie sie es sein sollten. Mit diesem Workshop senken wir die Einstiegshürde ins Testen von Applikationen. Sie erfahren mehr über die Konzepte und Methoden, die den Testframeworks zugrunde liegen, sodass Sie das erworbene Wissen in verschiedenen Umgebungen anwenden können. Sie lernen Tests zu schreiben, den Umgang mit Test Doubles sowie den Einsatz von Fixtures und das Testen von asynchronen Operationen. Zum Einsatz kommen Bibliotheken wie Jasmine, Karma und Jest.
Zielgruppe: Dieser Workshop richtet sich an JavaScript-Entwickler, die die Qualität und Stabilität ihrer Applikation verbessern möchten.
Das CSS Grid-Layout-Modul ermöglicht die intuitive Erstellung von Layouts über Rasterdefinitionen und wird in den aktuellen Versionen der wichtigsten Browsern unterstützt. Im Workshop lernen Sie die neue
Layouttechnik nutzen inklusive praktischer Einsatzmöglichkeiten und Fallback-Lösungen.
Forms are found in most web applications, and they are used as a main interaction point between the user and the system. With advancements in Web technologies we’re able to design forms for great UX. The Reactive Forms Module, written by the Angular core team, is designed with a wide range of options and an understandable API. It lets us developers manage and manipulate forms and form controls dynamically, while tracking their state of usage and validity. We can create custom, reusable form controls with sync and async validators. In this hands-on workshop we will learn how to leverage the Angular Reactive Forms for our needs.
Jeder Entwickler kennt die Stärken seiner Lieblingsframeworks und sieht gleichzeitig großzügig über deren Schwächen hinweg. Bleeding-Edge Features wechseln sich mit unerwartetem Verhalten und komplizierten APIs ab.
JavaScript, TypeScript, RxJS, Redux, Angular, React & Co bieten genug Abgefahrenes und Furchterregendes, um jeden zum Staunen zu bringen und in den Wahnsinn zu treiben.
In den letzten Versionen wurde TypeScript um diverse fortschrittliche Features erweitert, wodurch sich TypeScript zu einer vollwertigen und eigenständigen Programmiersprache entwickelt hat, die über mehr Features als beispielsweise Java verfügt. In diesem Workshop werden die fortgeschrittenen Features detailliert vorgestellt. Jeder, der Conditional Types, Intersection Types, Mapped Types oder non-nullable Types verstehen möchte, ist in diesem Workshop genau richtig. Weiterhin werden sinnvolle Einstellungen und Techniken für den Projektalltag besprochen.
Am ersten Tag zeigten Hans-Christian Otto und Elmar Burke, wie man mit React und TypeScript umgeht. In dieser Fortführung wird das Wissen vom Vortag aufgegriffen und erweitert. Aber auch Entwickler, die bereits erste Erfahrungen mit React gesammelt haben, können einsteigen.
Die Anwendung vom Vortag wird interaktiv, dazu wird auf das von Redux bekannte Pattern von Reducern zurückgegriffen. Durch CSS auf Komponenten-Basis wird die Anwendung verschönert. Außerdem beschäftigen wir uns mit der Struktur der Anwendung und lernen grundlegende Architekturen kennen. Alle Entwicklungsschritte der Anwendung werden auch mit Tests ausgestattet.
Einige Zeit ist nun vergangen, dass JavaScript (ES2016) mit neuen syntaktischen und funktionalen Features spezifiziert wurde. Aber auch heute noch werden nützliche Fähigkeiten, wie Klassen, Fat-Arrow-Functions, Async-Functions, uvm. oft noch nicht eingesetzt oder als schwarze Magie betrachtet.
Diese Session gibt einen Überblick über die gängigsten ES2016 Features, stellt neuere Vorschläge aus späteren Spezifikationen, wie Decorators vor und blickt anschließend über den Tellerrand hinaus auf TypeScript. Hierbei werden Typen, Interfaces und Co. näher beleuchtet.
Zielgruppe: Diese Session richtet sich an Entwickler, welche sich ein Bild von modernen JavaScript Features und “Spracherweiterungen”, wie TypeScript machen möchte.
Aus Angular ist RxJS kaum wegzudenken. Zahlreiche Elemente des Frameworks setzen auf diese Bibliothek, die den Umgang mit asynchroner Programmierung erheblich erleichtert. Aber nicht nur in Angular findet RxJS Anwendung. Auch mit React, Vue oder Node.js lässt sich RxJS kombinieren. Dieser Workshop behandelt die Grundlagen der Bibliothek. Außerdem erfahren Sie anhand zahlreicher praktischer Beispiele, wie Ihnen das “Observerpattern done right” bei der Implementierung Ihrer Applikation helfen kann. Zudem lernen Sie die Neuerungen der aktuellen RxJS-Version sowie hilfreiche Werkzeuge kennen und haben selbst Gelegenheit, diese ausgiebig zu testen. Den Abschluss des Workshops bildet eine praktische Übung, in der Sie RxJS in einer Angular-Applikation einsetzen.
Zielgruppe: Einsteiger
Webseiten sind keine Gesamtkunstwerke. Sie sind vielmehr eine Zusammenstellung einzelner Bestandteile, einzelner Module. Ich zeige, wie man eine Seite modular durchdenkt, aufbaut und dabei auch das CSS modular erstellt. Wir diskutieren die Ansätze OOCSS, SMACSS und BEM.
Wir schauen uns dabei konkrete Module an und diskutieren die Umsetzung mit ihren Vor- und Nachteilen. Wir sprechen über Living Styleguides und Sass, um die Nutzung von Modulen in Teams sicherzustellen. Es würde mich freuen, wenn Beispiele aus meiner Praxis durch Beispiel von Teilnehmern ergänzt werden, damit jeder für sich seinen bevorzugten Umgang mit der Materie erkennen kann.
Zielgruppe: Fortgeschritten
Egal, ob man mit Angular, React oder irgendeinem anderen Framework entwickelt – Progressive Web Apps basieren in allen Fällen auf fundamentalen Webstandards wie Promises, Service Workers und Offline-Datastores. Um genau diese PWA-Basistechnologien geht es in diesem ersten Teil des Workshops. Service Worker, Offline Cache, App Manifest und Co. werden im Detail betrachtet und anhand von Beispielen demonstriert. Auch Devtools und Debugging-Techniken sind natürlich ein Thema. Gerüstet mit dem Wissen um diese und weitere Grundlagen-Technologien ist die Entwicklung einer eigenen PWA ein leichtes… zum Beispiel im zweiten Teil des Workshops.
Am ersten Tag zeigten Hans-Christian Otto und Elmar Burke, wie man mit React und TypeScript umgeht. In dieser Fortführung wird das Wissen vom Vortag aufgegriffen und erweitert. Aber auch Entwickler, die bereits erste Erfahrungen mit React gesammelt haben, können einsteigen.
Die Anwendung vom Vortag wird interaktiv, dazu wird auf das von Redux bekannte Pattern von Reducern zurückgegriffen. Durch CSS auf Komponenten-Basis wird die Anwendung verschönert. Außerdem beschäftigen wir uns mit der Struktur der Anwendung und lernen grundlegende Architekturen kennen. Alle Entwicklungsschritte der Anwendung werden auch mit Tests ausgestattet.
Was in zwei Sekunden nicht lädt, wird nie wieder aufgerufen: Die Erwartung von Anwendern an die Performance von Webanwendungen nimmt stetig zu. Und auch nach dem Laden einer Webanwendung muss sich diese schnell und flüssig anfühlen, damit der Anwender sein Ziel erreichen kann. Mit Zones, Change-Detection- und Preloading-Strategien, Lazy Loading, Ahead-of-time-Kompilierung und Service Workern stehen in Angular verschiedene Techniken zur Verfügung, um selbst große Webanwendungen super schnell auszuführen. Christian Liebel von Thinktecture zeigt Ihnen die Stellschrauben des Frameworks, damit Sie auch für Ihre Angular-App den Turbo zünden können.
Zielgruppe: Fortgeschritten
In alten Technologien geschriebene CRUD-Anwendungen sind in die Jahre gekommen und machen uns das Leben teilweise schwer. Die Zeit ist reif für eine skalierbare, Cloud-taugliche Architektur wie CQRS in Verbindung mit einer modernen Plattform wie Node.js. Doch beginnt man, das Architekturmuster in Node.js umzusetzen, merkt man, dass das nicht ganz so leicht ist. Es gilt zahlreiche Hürden zu meistern, konzeptioneller wie technischer Natur: CAP, Eventual Consistency, Streams, Asynchronität – das sind nur einige der Aspekte, die heikel werden können. Golo Roden erklärt Ihnen in diesem Workshop, wie Sie CQRS in Node.js angehen, worauf es zu achten gilt und wie Sie die auftretenden Probleme meistern.
Bootstrap ist das wohl berühmteste UI-Framework. Seit vielen Jahren sorgt es immer wieder für leidenschaftlichen Streit über Sinn und Unsinn eines solchen UI-Frameworks und über dessen Codequalität.
Wir schauen uns die dieses Jahr neu herausgekommene Version 4 von Bootstrap genauer an. Das auf Flexbox basierende Grid ist nur eine der sehr interessanten Neuerungen. Die Auswahl an Modulen ist groß. Wir lernen die Vorteile von Prototyping kennen, indem wir Bootstrap zum Erstellen einzelner Seiten nutzen und uns mit den Modulen und der Dokumentation beschäftigen. Auch die Konfiguration von Bootstrap mittels Sass werden wir uns anschauen.
Angesichts des Umfangs des Frameworks und des darum entstandenen Ökosystems wird dies ein intensiver Workshop, für den wir nicht mehr als unseren Lieblings-Editor und einen modernen Browser benötigen.
Angular bietet sich für große Geschäftsanwendungen an. Doch wie strukturiert man sie am besten, um eine langfristige Wartbarkeit zu gewähren? Diese Session gibt unter Verwendung einer Fallstudie gleich mehrere Antworten auf diese Frage. Sie erfahren, wie Sie Anwendungen in einzelne wiederverwendbare npm-Pakete aufteilen und über eine Registry verteilen können. Zusätzlich lernen Sie den Monorepo-Ansatz kennen und sehen, wie die Idee hinter Microservices und Microfrontends weiterhilft. Am Ende haben Sie einen Überblick über die vorherrschenden Möglichkeiten und können diese vor dem Hintergrund Ihrer eigenen Projekte bewerten.
Zielgruppe: Fortgeschritten
Im zweiten Teil des PWA-Workshops gibt es keine komplizierten Slides oder langweiligen Vorträge, sondern vom Trainer unterstützte hands-on Entwicklung am konkreten Beispiel! Gemeinsam entwickeln die Teilnehmer einen Prototyp einer kleinen, offlinefähigen mobile-first PWA, entweder auf Basis einer Vorlage oder ganz nach dem persönlichen Geschmack mit dem Framework der Wahl. Der Trainer steht den Teilnehmern dabei mit Rat und Tat zur Seite. Bringen Sie Ihren Laptop mit und vielleicht – wenn Sie mögen – Ihre eigene Idee für eine kleine Progressive Web App.
Vue.js ist in aller Munde! Doch warum brauchte es schon wieder ein neues Framework und ist der ganze Hype bald schon wieder Schall und Rauch? Im Rahmen dieser Session werden wir nicht die neue Technik des Technik Willens einsetzen, sondern uns vielmehr damit beschäftigen, was die Motivation hinter Entwicklung des neuen progressiven Frameworks war, um zu verstehen, welche Probleme Vue.js löst. Einer der Hauptgründe für die Begeisterung in der Community ist die Einfachheit, doch ist das Fluch oder Segen? Und wie sieht es mit der Weiterentwicklung, Stabilität und Support in der Zukunft aus?
Wir werden die Konzepte von Single File Components und Reaktivität betrachten und uns anschließend das Vue.js Universum mit Plugins und Frameworks wie Vuex und Nuxt.js ansehen. Damit wir nicht zu abstrakt über das Thema sprechen, werden wir mit der Vue CLI 3 eine kleine Single Page Application bauen, um zu verstehen, wie das Framework tatsächlich funktioniert, welche Vorteile es mit sich bringt und welche Stolpersteine es anfangs geben könnte.
Kaum ein Bereich in der IT entwickelt sich so schnell weiter wie die Webplattform. Die vielen innovativen Konzepte, neue Browser-APIs und darauf basierende Frameworks machen es schwer, den Überblick zu behalten. Wozu braucht man Web Components? Was steckt hinter WebAssembly? Wann helfen Workers? Und wie bleibt eine Webapplikation performant? Im Workshop wird ein konzeptioneller Überblick über den aktuellen Status und über die Zukunft der Webplattform gegeben.
Wir kennen das: da nimmt man sich eine Aufgabe im Projekt, erledigt sie und weiter zur nächsten Aufgabe. Aber woran erkenne ich, ob die erste Aufgabe gelöst ist? Klar, Monkey-Test. Also selbst durchtesten. Was aber wenn jetzt durch jemand anderen (wir sind es ja selten selbst) das entwickelte Feature nicht mehr funktioniert? Klar, nach jedem Commit alle Features durchtesten. Aber das dauert. Zeit kostet. Und das nach jedem Commit. Teuer. Nein, eine bessere Lösung sind da Unit-Tests, diese testen das entwickelte Feature. Zusammen mit der CI können diese auch automatisch nach jedem Commit durchlaufen werden, ohne selbst Zeit dafür aufbringen zu müssen. Lass uns Unit-Tests schreiben und ein Feature im TDD-Style entwickeln.
React basiert auf zahlreichen Konzepten aus der funktionalen Programmierung, unter anderem Immutability und Map/Reduce. Wer React erfolgreich einsetzen will, muss diese Konzepte beherrschen. Das wiederum setzt ein grundlegendes Verständnis der funktionalen Programmierung mit JavaScript voraus: Wie funktioniert das Typsystem? Wie erreicht man Unveränderlichkeit? Was sind Closures? Was versteht man unter Funktionen höherer Ordnung? …? Der Workshop mit Golo Roden führt Sie auf anschauliche Weise in die funktionale Programmierung mit JavaScript ein und vermittelt Ihnen alle theoretischen und praktischen Kenntnisse, die Sie benötigen, um React wirklich zu verstehen und zielgerichtet einsetzen zu können.
Responsive Webseiten sind normal geworden. Zeit also, von den Grundlagen Abstand zu nehmen und die Realität anzuschauen.
Welche Seitenelemente machen uns in der Realität Probleme? Wie können wir die Kommunikation im Team optimieren? Wie funktionieren die unterschiedlichen Gridsysteme? Bedenken wir bei responsiven Seiten auch die allgemeine Zugänglichkeit (Accessibility) immer mit?
Dieser Workshop soll zum Nachbauen und Mitmachen anregen. Herausforderungen aus der Praxis können auch gerne von den Teilnehmern kommen.
Zielgruppe: Fortgeschritten
Dieser Einstieg vermittelt Ihnen nicht nur alles, was Sie brauchen, um eine Applikation mit Node.js zu entwickeln, sondern auch zahlreiche Best Practices, Tipps und Tricks im Umgang mit der serverseitigen JavaScript-Plattform. Sie lernen den Aufbau von Node.js kennen und wie Sie Ihre Applikation so strukturieren können, damit sie auch über längere Zeit wartbar bleibt. Als konkretes Beispiel bauen wir zusammen eine voll funktionsfähige Kommandozeilen-Applikation, in der Sie alles Gelernte anwenden können.
Zielgruppe: Dieser Workshop richtet sich an Entwickler, die in die Welt von Node.js einsteigen möchten. Für die Teilnahme sollte ein Grundwissen über JavaScript vorhanden sein.
Progressive Web Apps (PWA) sind ein heißes und topaktuelles Thema in der Web-Entwicklung. Dank einer ganzen Reihe von Technologien und Vorgehensweisen aus dem PWA-Umfeld lassen sich Websites und Web-Anwendungen mit einigen zentralen und relevanten Features ausstatten, die bisher ausschließlich nativen Anwendungen vorbehalten waren: Offlinefähigkeit, Push Notifications, schnelles Startverhalten und installierbar – samt Homescreen-Icon. Christian Liebel zeigt Ihnen an nur einem Tag anhand eines durchgängigen in Angular entwickelten Beispiels, wie Sie solche PWAs mit Angular erstellen und somit sanft und sacht die Schlucht zwischen reinen Websites, Web Apps und hybriden/nativen Apps schließen können.
Zielgruppe: Fortgeschritten
Progressive Web Apps sind unbestreitbar auf dem Vormarsch. Aber auch heute lässt sich nicht jede App als Web App umsetzen. In der React-Welt gibt es neben dem altbekannten Weg über Cordova einen alternativen Ansatz, um mittels Javascript Mobile Apps zu entwickeln: React Native. Das relevanteste Merkmal von React Native ist, dass nicht HTML & CSS zum Rendering verwendet werden, sondern Native UI Elemente die Darstellung der App übernehmen. Der Workshop vermittelt Grundlagen von React Native und angrenzenden Technologien. Grundlagen von React werden vorausgesetzt.
Zielgruppe: Fortgeschritten
Lange Zeit war Express die erste Wahl, wenn es um die Umsetzung von Web-Backends auf Basis von Node.js ging. Mittlerweile ist dieses Framework etwas in die Jahre gekommen. Wo sich Frontend-Frameworks wie Angular, React oder Vue rasant weiterentwickeln, tut sich im Bereich von Express wenig. Aus diesem Grund wird es nun Zeit sich nach Alternativen umzusehen. Eine der vielversprechendsten ist NestJS. Auf einem austauschbaren Webserver-Layer bietet NestJS den Komfort von Express kombiniert mit modernen Patterns die vor allem aus der Entwicklung von Angular-Applikationen bekannt sind.
In diesem Workshop bauen wir eine vollwertige Applikation mit NestJS auf und kümmern uns um Themen wie die Anbindung von Datenbanken, Authentifizierung und die Auslieferung von statischen Inhalten.
Zielgruppe: Grundkenntnisse in JavaScript, TypeScript und Node.js sollten vorhanden sein.
Im Vergleich zu anderen Mainstream-Programmiersprachen ist das Typsystem des JavaScript-Dialekts TypeScript eher ungewöhnlich. Um sich in das ansonsten eher chaotische JS-Ökosystem integrieren zu
können macht TypeScript einerseits diverse ungewöhnliche Kompromisse, erlaubt es fähigen Programmierern aber auch, sehr interessante Typ-Beziehungen auszudrücken. Dieser Workshop beleuchtet einige der dunklen Ecken von TypeScript und erforscht fortgeschrittene Features
des Typsystems, die vielen TS-Nutzern ein Buch mit sieben Siegeln sind und die für Freunde anderer Sprachen der Häresie gleichkommen. Werden auch Sie ein Lehrling der dunklen Künste und finden Sie heraus, wie Sie Ihre Kollegen mit Ihrem neuen TypeScript-Voodoo nachhaltig beeindrucken und/oder verwirren können.
Progressive Web Apps (PWA) sind ein heißes und topaktuelles Thema in der Web-Entwicklung. Dank einer ganzen Reihe von Technologien und Vorgehensweisen aus dem PWA-Umfeld lassen sich Websites und Web-Anwendungen mit einigen zentralen und relevanten Features ausstatten, die bisher ausschließlich nativen Anwendungen vorbehalten waren: Offlinefähigkeit, Push Notifications, schnelles Startverhalten und installierbar – samt Homescreen-Icon. Christian Liebel zeigt Ihnen an nur einem Tag anhand eines durchgängigen in Angular entwickelten Beispiels, wie Sie solche PWAs mit Angular erstellen und somit sanft und sacht die Schlucht zwischen reinen Websites, Web Apps und hybriden/nativen Apps schließen können.
Zielgruppe: Fortgeschritten
Angular entwickelt sich stetig weiter. Das Ökosystem wächst. Der Kern bekommt neue Features. Das CLI wird mächtiger. Den Überblick zu behalten und immer informiert zu sein, ist schwierig.
In diesem Workshop gebe ich einen Überblick was sich in Angular 7 und 8 geändert hat. Wir schauen uns die Veränderungen des CLI an und werfen einen Blick auf Bazel, den neuen Unterbau des CLI. Wir schauen uns den heiß erwarteten Ivy Renderer an und was dieser unter anderen für Angular Elements bedeutet. Und wir schauen uns an was Angular Elements eigentlich ist.
Der Einsatz von Web Animation kann helfen die User Experience einer Website deutlich zu verbessern indem man den Nutzer durch Fokus, Feedback und Kontext durch ein Interface leitet. Zusätzlich können Animation helfen Erklärungen zu vereinfachen, Abläufe zu demonstrieren oder einfach etwas Unterhaltung in ein Interface zu bringen.
Dieser Workshop richtet sich an Beginner, die lernen wollen mittels CSS und Javascript simple Animationen in ihre Interfaces einzubauen. Vorwissen zu CSS und Javascript sind hilfreich, aber alles Benötigte wird nochmal im Workshop erklärt.
Im Workshop werden folgende Bereiche behandelt: