201525Mai

JavaScript: Alternative Konzepte zu Flux und React

Mittlerweile dürften die meisten JavaScript-Entwickler mit den Begriffen Flux oder React etwas anfangen können. Facebook hat damit neue Methoden zur Entwicklung moderner Webanwendungen geschaffen. Neben einem virtuellem DOM und einem unidirektionalen Datenfluss stehen bei React ein Klassensystem, Event-Emitter, Actions und Stores im Vordergrund der Funktionsweise. Das ganze stellt eine mögliche Lösung dar, bietet aber zugleich Raum für Weiterentwicklungen.

Flux - Application Architecture for Building User Interfaces

Inzwischen gibt es zwei Vertreter, welche die Paradigmen von Facebook analysiert und verändert haben. Zum einen hat der Entwickler Matti Lankinen eine Alternative beschrieben, die auf Bacon.js und React basiert: Hier wird also die Flux-Architektur mit ihren Konventionen aufgelöst und durch "Functional Reactive Programming (FRP)" ersetzt, bei dem Event-Streams die Grundlage bilden. Actions und Stores werden überflüssig, da eine "öffentliche API" als lokaler Dispatcher agiert und die Zustände innerhalb der Anwendung regelt. Eine beispielhafte TodoMVC-App demonstriert die Funktionsweise.
Der zweite Ansatz bezieht sich auf das UI-Framework Deku: Hierbei handelt es sich um eine funktionale Alternative zu React, die auf das Klassensystem verzichtet. ES6, JSX sowie Komponenten kommen hier weiterhin zum Einsatz, lediglich das Rendering gleicht bei dieser Idee dem einer Game-Engine.

201524Mai

JavaScript: Sonnensystem der Skriptsprache in 2015

JavaScript ist zu einer wichtigen und soliden Skriptsprache geworden, die maßgeblich zur Entwicklung des Webs beiträgt und auch für die Umsetzung mobiler Apps oder nativer Desktop-Anwendungen genutzt werden kann. ECMAScript 6 ist zwar noch nicht in allen Browsern vollständig implementiert, kann aber dank Transpiler schon jetzt genutzt werden: Für Browser, die ES6 noch nicht unterstützen, werden dann entsprechende Code-Fallbacks erzeugt.
Neben ES5-Transpilern gibt es noch andere Tools und Weiterentwicklungen, die sich derzeit im JavaScript-Ökosystem (oder -Sonnensystem) befinden.

Solar System of JS

Anlässlich der Space City JS-Konferenz hat der Entwickler Shaun LeBron das "Solar System of JS" entwickelt. Dabei handelt es sich um eine interaktive Illustration aktueller JavaScript-Technologien und -Entwicklungen. Neben Transpilern, Lintern und Modul-Systemen werden Features von ES7 und ES8 gezeigt, Tools zur statischen Typisierung (wie beispielsweise TypeScript oder Flow) sowie Sprachen, die nach JavaScript kompilieren (z.B. ClojureScript).

201514Mai

plainJS: Sammlung mit Vanilla-JavaScript-Bibliotheken

JavaScript-Code, der nicht auf externe Bibliotheken angewiesen ist, bezeichnet man auch als Vanilla-JavaScript. Die Entwicklung der Browser und Webstandards ist in den letzten Jahren soweit fortgeschritten, dass JavaScript-Frameworks wie jQuery oder Dojo immer mehr in den Hintergrund treten. Ich hatte hierzu bereits einen ausführlichen Artikel veröffentlicht. Aus diesem Grund stellt sich vielen Entwicklern die Frage, ob für das nächste Projekt überhaupt noch jQuery oder ein anderes Framework zur Vereinfachung eingesetzt werden soll: Mit ECMAScript 5 und der stärker werdenden Verbreitung moderner Browser stehen im Grunde alle Funktionen bereit, die beispielsweise mit jQuery vereinfacht werden.

plainJS - The Vanilla JavaScript Repository

Daher gibt es jetzt schon etliche Skripte, die nicht auf ein Framework setzen und sich stattdessen ES5-Features zunutze machen. Eine Sammlung solcher Skripte steht nun mit plainJS bereit, die in unterschiedliche Kategorien eingeteilt ist: UI, Eingabe, Medien, Navigation, Effekte und Sonstiges. Hier finden sich also kleine Bibliotheken für alle erdenklichen Bereiche einer modernen Website.

201506Mai

JavaScript: Einführung in die Konzepte von React.js

Mit React.js stellen die Entwickler von Facebook schon seit geraumer Zeit eine Alternative zu AngularJS oder anderen MVW-Frameworks zur Verfügung. Zuletzt wurde mit React Native sogar ein Framework vorgestellt, mit dem sich native Mobile-Apps auf der Basis des JavaScript-Frameworks entwickeln lassen.
Der Einstieg in das vielseitige Framework gestaltet sich aber nicht unbedingt einfach, da verschiedene Konzepte verwendet werden und komplexe Bereiche abgedeckt werden. Die Entwickler von RisingStack haben daher ein ausführliches Tutorial veröffentlicht, das die Welt von React besser verständlich machen soll.

React - A JavaScript library for building user interfaces

Behandelt werden in dem Artikel die grundlegenden Themen rund um die JavaScript-Bibliothek. React setzt auf ES6 (mittels Babel-Transpiler) und Komponenten, die wiederum JSX-Templates beinhalten. Bei JSX handelt es sich um eine JavaScript-Erweiterung, welche die direkte Einbindung von XML-Code in JavaScript und Zwei-Wege-Bindings ermöglicht. React verarbeitet schließlich die JSX-Views, verknüpft dynamische Daten (Backend) in einem virtuellem DOM, welches für die Präsentation sorgt und auf Änderungen wartet (unidirektionaler Datenfluss). Dieser Sachverhalt wird ausführlich in dem Artikel beschrieben und am Ende wird noch eine mögliche Anwendungsstruktur aufgezeigt.
Mittlerweile ist auch schon der zweite Teil von insgesamt drei Teilen veröffentlicht worden.