Garaio TippSpiel - JavaScript only

Techtalk
Garaio TippSpiel - JavaScript only

Digitale Webprojekte können serverseitig nicht mehr bloss mit altbewährten Programmiersprachen, wie zum Beispiel C#, JAVA, PHP oder Ruby gebaut werden. Nein, sie lassen sich heute auch mit einer Sprache umsetzen, die sowohl backend- wie auch frontendseitig genutzt werden kann. Die Rede ist von JavaScript – einer Scriptsprache, der viele Entwickler ungerechtfertigter Weise immer noch sehr skeptisch gegenüberstehen. In unserem Techtalk stellen wir ein im Rahmen der Fussball EM vom letzten Sommer umgesetztes, mandantenfähiges Tippspiel vor, welches ausschliesslich auf diese Technologie setzte.

Das Garaio–TippSpiel
Wer bereits an Online-Tippspielen teilgenommen hat, weiss, dass diese fast immer gleich aufgebaut sind. Inhaltlich bleibt nicht viel Spielraum:

Man benötigt eingetragene Matches, Teilnehmer und deren Tipps für die Spiele, eine Übersicht der Matchresultate sowie eine Rangliste für die User. Aus Entwicklersicht nichts Neues und auch nicht allzu spannend. Die Auswahl der eingesetzten Technologien, welche wir bis dahin nur schlecht bis gar nicht kannten, machte das interne Projekt jedoch zu einer interessanten Herausforderung.

Projekt Setup
Bei der Umsetzung setzten wir auf VisualStudio. Für das Setup war es notwendig, VS 2015 zu nutzen, da ab dieser Version bereits das Meiste für die Erstellung von Node.js Projekten mitgeliefert wird. Nach der Installation der kostenlosen Erweiterung „Node.js Tools for VisualStudio“ konnten wir loslegen.

Die Vorlage „Basic Node.js Express 3 Application“ ermöglichte es, in kürzester Zeit ein neues Node.js Projekt zu erstellen. Durch das in VisualStudio integrierten Node.js Package Manager (www.npmjs.com ist, laut eigener Aussage, mit über 250‘000 angebotenen Paketen, das grösste Ökosystem für Open Source Bibliotheken der Welt), konnte das Projektsetup im Handumdrehen um viele praktische Funktionen erweitert werden.

Für das Garaio–TippSpiel kam nebst den bereits vorhandenen Packages unter anderem eine Erweiterung zum Einsatz; der Funktionsumfang des Webprojekts wurde unter anderem durch Module für den Zugriff auf DocumentDBs, die Datumsberechnung, die Passwortverschlüsselung sowie verschiedene Analyse Tools erweitert.

Eingesetzte Technologien kurz erklärt

JavaScript
Im Jahre 1995 erschien eine im Netscape Browser eingebettete Scriptsprache mit dem Namen LiveScript. Noch im selben Jahr verkündeten Netscape und Sun Microsystem eine Kooperation, um LiveScript direkt mit Java-Applets interagieren zu lassen. Das Resultat dieser Zusammenarbeit war JavaScript 1.0.

JavaScript wurde permanent weiterentwickelt, den Anforderungen angepasst und gewann mit der Einführung von AJAX (Asynchronous JavaScript and XML) im Jahr 2004 an Ansehen und Beliebtheit.

Wikipedia über JavaScript …
„JavaScript (kurz JS) ist eine Skriptsprache, die ursprünglich für dynamisches HTML in Webbrowsern entwickelt wurde, um Benutzerinteraktionen auszuwerten, Inhalte zu verändern, nachzuladen oder zu generieren und so die Möglichkeiten von HTML und CSS zu erweitern. Heute findet JavaScript auch außerhalb von Browsern Anwendung, so etwa auf Servern und in Microcontrollern.

Der als ECMAScript standardisierte Sprachkern von JavaScript beschreibt eine dynamisch typisierte, objektorientierte, aber klassenlose Skriptsprache. Sie wird allen objektorientierten Programmierparadigmen unter anderem auf der Basis von Prototypen gerecht. In JavaScript lässt sich je nach Bedarf objektorientiert, prozedural oder funktional programmieren.“

(Quelle: Wikipedia)

Im vergangenen Jahr wurde die aktuell geltende Sprachspezifikation, endlich abgeschlossen. JavaScript ist damit bei der lange erwarteten Version 6 angelangt. Eine Übersicht der vielen, spannenden Neuerungen, findet sich auch unter http://es6-features.org.

Leider kann diese Version aber ausgerechnet da, wo JavaScript eigentlich zuhause ist – nämlich im Frontend einer Webseite – noch nicht vollumfänglich genutzt werden. Weil die meisten Webprojekte auch in älteren Browsern laufen sollen und diese die neue Syntax nicht verstehen, muss momentan noch in vielen Webprojekten auf den Einsatz von JavaScript 6 verzichtet werden. Und genau hier kommt Node.js ins Spiel…

Node.js
... ist eine JavaScript Runtime, aufgebaut auf der V8 JavaScript Engine von Google, welche auch im Chrome Browser zur Anwendung kommt. Die für die unterschiedlichsten Systeme gebaute Runtime, bildet das Fundament für serverseitige JavaScript Applikationen.

Im Gegensatz zu vergleichbaren Libraries (z.B. Rubys Event Machine), gibt es in Node.js keine blockierenden Calls zu Beginn oder am Ende der auszuführenden Scripts. Node.js startet stattdessen nach dem Ausführen der Scripts einen Event-Loop und beendet diesen wieder, wenn keine weiteren Callbacks vorhanden sind. Dies entspricht exakt dem Verhalten von JavaScript in Browsern und macht es beispielsweise äusserst simpel, umfangreiche Netzwerkapplikationen zu bauen.

Express
… ist ein auf Node.js aufbauendes Web Application Framework. Mit Hilfe der zentralen Projektdatei „app.js“ können Middleware und Controller registriert und der Webserver gestartet werden. Detailliertere Informationen findet man unter www.expressjs.com.

Jade (Pug)
… ist eine simple Node.js Template-Engine für HTML-Files und wird benötigt, um die Modeldaten in die Views zu rendern. Vor kurzem musste Jade aus rechtlichen Gründen umbenannt werden und heisst nun Pug.

Fazit
Um ein Webprojekt umzusetzen, gibt es serverseitig mit Sicherheit bessere, oder zumindest angenehmere Technologien als JavaScript. Gerade im Bereich Datenbanken und Datenverarbeitung ist diese Sprache wohl nur selten die beste Wahl.

Es war in jedem Fall sehr interessant festzustellen, was mit JS heute bereits möglich ist. Wer hätte vor 10 Jahren gedacht, dass diese – lange Zeit als unsicher und langsam verpönte – Sprache einmal zur Erstellung von Entwicklungsumgebungen, zur Spieleprogrammierung oder zur Umsetzung kompletter Webprojekte genutzt werden könnte? Mit der entsprechenden Weiterentwicklung der Sprache sowie der weiteren Beschleunigung der JavaScript-Engines, die den Code on-the-fly ausführen, könnte die Sprache, gerade im Bereich Web, noch eine grosse Zukunft vor sich haben.