In der kleinen Artikel-Reihe zum Thema Grunt war die Installation von Node.js auf dem lokalen Rechner vorausgesetzt worden. Grunt ist nichts anderes als eine Node.js-Applikation. Es ist Zeit, sich einmal mit Node. js näher zu befassen.
Node.js ist ein OpenSource-Framework das hauptsächlich für den Server-seitigen Einsatz von Javascript geschaffen wurde. Es eignet sich allerdings auch zur ganz profanen Anwendungsentwicklung für Anwendungen aller Art, also nicht nur im Web-Kontext.
Javascript wurde früher von Entwicklern hauptsächlich als Client-Programmiersprache für Browser eingesetzt. Node.js ermöglicht nun die Entwicklung von Anwendungsprogrammen unabhängig von einem Browser (Grunt ist hierfür ein sehr gutes Beispiel), aber auch, und das ist eines der interessantesten Möglichkeiten, für die Entwicklung von Web-Servern ähnlich dem Apache-Web(Http)-Server oder IIS (Microsoft).
Für große Web-Projekte werden zur Zeit noch letztere Systeme bevorzugt, aber in vielen Fällen benötigt man kleine schlanke Lösungen und auch für das eine oder andere Geschäftsmodell ist der Einsatz von Node.js durchaus diskutabel.
In diesem ersten Beitrag soll die Art der Entwicklung mit Node.js an einem einfach nachvollziehbaren Beispiel dargestellt werden, welches bei jedem sofort funktionieren sollte und zu weiterem Arbeiten anregt.
In einem späteren Artikel wird dann auf der Basis von Node.js gezeigt, wie man damit eine GUI für Automatisierungsaufgaben z.B. auf der Basis von Grunt entwickeln kann.
Merkwürdigerweise findet man eine solche Demonstration im Internet bisher nicht. Warum? Ist eine GUI nur was für Maus-Schubser und sind Maus-Schubser keine richtigen Programmierer? Aber vielleicht haben sie die besseren Ideen.
Im Folgenden werden als Einstieg in die Materie zwei ganz simple Server vorgestellt, die mit Node.js realisiert werden. Die simpelste Form eines denkbaren Servers und dann eine, die das Node.js-Plugin Express für das Routing eines Servers verwendet. Danach dürfte intuitiv klar sein, wie ein entsprechendes Projekt funktioniert.
Voraussetzung
Voraussetzung für das praktische Nachvollziehen der folgenden Beispiele ist die Installation von Node.js auf dem eigenen Rechner. Für Windows kann man einen Installer hier beziehen.
Ein simpler Server
Wir richten irgendwo einen Projektordner ein z.B. mit dem Namen NodeTest. Dort erzeugen wir mit dem Texteditor unseres Vertrauens folgendes Skript server.js:
var http = require("http"), server; server = http.createServer(function(req, res) { res.writeHead(200, {"Content-Type": "text/plain"}); res.end("Hallo Welt"); }); server.listen(4000); console.log('Server listening on port 4000');
Kurze Beschreibung: Mit Hilfe des File- und Module-Loaders RequireJS, der in Node.js integriert ist, holen wir uns das http-Modul für den Http-Server.
Dieser hört auf Port 4000 und liefert "Hallo Welt" als Volltext-Content an den Client aus, wenn er durch den Aufruf einer Seite erzeugt wird.
Probiert es aus. Gestartet wird der Server in einer Windows-Console aus dem Projekt-Ordner heraus mit:
node server
Ruft dann im Browser localhost mit Portangabe auf:
http://localhost:4000
Es erscheint eine Webseite mit dem einzigen Inhalt: "Hallo Welt".
Ein simpler Server mit Express für das Routing
Jetzt wird ein etwas komplexeres Beispiel gezeigt, welches das Node.js-Modul Express für das Routing verwendet, um mehrere Seiten anzeigen zu können. Zunächst müssen wir Express lokal installieren. Wir verwenden der Einfachheit halber den gleichen Projektordner wie oben und installieren mit einer Windows-Console dort Express:
npm install express
Wir installieren es lokal - also ohne den Parameter -g, weil wir es nicht in allen unseren Node.js-Projekten benötigen, z.B. auch nicht in unseren Grunt-Projekten.
Als nächstes legen wir eine neue Javascript-Datei an mit dem Namen express_server.js. Außerdem erzeugen wir einen Ordner client.
Im Ordner client erzeugen wir eine Html-Datei index.html und eine Datei test.html, die wir mit irgendwelchen Inhalten füllen. Die index.html-Datei könnte z.B. so aussehen:
!doctype html> <html> <head> <title>My first app</title> </head> <body> <h1>Hello World</h1> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p> </body> </html>
In die test.html Datei geben wir einfach einen String ein, z.B. "Ich bin ein Test".
Diese beiden Webseiten liegen jetzt in unserem Ordner client. Unser Projekt-Ordner für beide Beispiele sollte wie in Abb. 1 aussehen:
Abb. 1: Ordner und Dateistruktur der beiden Test-Projekte.
Jetzt geben wir in express_server.js im Root-Ordner unseres Projekts Folgendes ein:
var express = require("express"), http = require("http"), app = express(); // Folgende Zeile ausklammern, dann gilt für / route ganz unten. app.use(express.static(__dirname + "/client")); http.createServer(app).listen(3000); // Route app.get("/hello", function(req, res) { res.send("Hello World"); }); app.get("/goodby", function(req, res) { res.send("Goodby World"); }); app.get("/", function(req, res) { res.send("This is the root route!"); });
Wenn man jetzt http://localhost:3000 in die Url-Leiste eines Web-Browsers eingibt, wird die index.html-Seite mit dem Lore Ipsum - Text (oben) angezeigt. Das Beispiel habe ich übrigens abgewandelt aus dem Buch "Learning Web App Deveolopment" von Semmy Purewal aus dem O'Reilly-Verlag übernommen, das ich sehr empfehlen kann.
Ixe ich, wie im Source-Code vorgeschlagen, die Zeile app.use .... aus, wird stattdessen die letzte definierte Route '/' verwendet, es wird nur der Text 'This is the root route!' ausgegeben. Ixen wir die Zeile app.use .... wieder ein, können wir im Ordner client ein ganzes System aus Html-Seiten implementieren, die wir mit dem jeweiligen Dateibezeichner aufrufen können.
Probiert es aus mit der Url-Eingabe http://localhost:3000/test.html und ihr bekommt die simple Ausgabe "Ich bin ein Test".
Für diverse spezielle Routen kann man die Ausgaben auch hart codieren, z.B. für die Route http://localhost:3000/goodby.
Fazit
Wir haben gesehen, wie einfach es ist, mit Node.js einen schon sehr leistungsfähigen Http-Server zu bauen.
Im nächsten Beitrag zum Thema Node.js - der allerdings noch ein wenig warten muss - werden wir ein wirklich brauchbares Beispiel kennenlernen für eine sehr praktische und nützliche Aufgabe, das auch vom Node.js Anfänger implementiert werden kann und das wichtige Techniken für die Kommunikation zwischen Server und Client vermittelt.
Wir werden einen Server entwickeln, mit dem man über eine Browser-Seite Console-Befehle, z.B. für Grunt-Tasks, menugesteuert starten kann und dabei den Verlauf der Grunt-Skripte über Abfragen in einer CSS-Konsole steuern kann.