Open Source im professionellen Einsatz
Linux-Magazin 03/2014
© Sergey Nivens, 123RF.com

© Sergey Nivens, 123RF.com

Echtzeitfähige Webanwendungen mit dem Framework Meteor

Flotte Schnuppe

Javascript sowohl im Browser als auch auf dem Server: Das Webframework Meteor verspricht Anwendungen aus einem Guss, die sich dank vieler fertiger Pakete rasch programmieren lassen.

590

Viele Webentwickler verwenden mehrere Programmiersprachen für eine Anwendung: Code in PHP, Ruby, Python oder Java auf dem Server und Javascript für den Browser. Mit dem Open-Source-Framework Meteor [1] können sie dagegen Webanwendungen ganz in Javascript programmieren, dazu kommen wie gewohnt nur noch HTML und CSS. Das soll den Entwicklungsaufwand merklich reduzieren, der automatisierte Build-Mechanismus sowie eine Vielzahl vorgefertigter Pakete ebenfalls.

Dieser Artikel zeigt, wie man eine interaktive Webanwendung mit Meteor, Javascript, HTML 5 und CSS 3 umsetzt. Als anschauliches Beispiel soll ein einfaches Redaktionssystem mit einer Liste von Beiträgen, einem Editor sowie einer Zugriffskontrolle dienen, das den Namen Starpublisher erhält.

Installation

Meteor erscheint unter MIT-Lizenz und lag bei Redaktionsschluss in einer Vorabversion mit der Nummer 0.7.0 vor. Mit Version 1.0 soll das Framework im Frühjahr 2014 Produktionstauglichkeit erreichen. Meteor selbst ist ausschließlich in Javascript geschrieben. Server-seitig setzt es auf Node.js. Die Meteor Development Group entwickelt die Software als Open-Source-Projekt, das mehrere Investoren aus der Internetbranche fördern.

Listing 1 installiert Meteor unter Ubuntu 12.04 im Homeverzeichnis des Benutzers und erzeugt das Grundgerüst der Beispielanwendung mit dem Namen Starpublisher. Zeile 1 holt zunächst das Kommandozeilen-Werkzeug Curl mittels Apt aufs System. Zeile 2 nutzt das Tool, um die aktuelle Meteor-Distribution aus dem Netz zu laden und zu installieren. Zeile 3 erzeugt das Starpublisher-Projekt, Zeile 4 wechselt in das Projektverzeichnis, Zeile 5 startet die Beispielanwendung. Eine ausführliche Dokumentation zu Meteor findet sich unter [2].

Listing 1

Installation

01 sudo apt-get install curl
02 curl https://install.meteor.com | /bin/sh
03 meteor create starpublisher
04 cd starpublisher
05 meteor

Entwicklungsabläufe

Eine Meteor-Anwendung ist bereits nach dem Erstellen des Grundgerüsts lauffähig. Abbildung 1 zeigt Starpublisher im Firefox-Browser. Standardmäßig sind Meteor-Anwendungen per HTTP auf Port 3000 zu erreichen. Die Aufgabe des Entwicklers besteht nun darin, benötigte Meteor-Pakete in das Projektverzeichnis zu installieren und die Anwendungslogik zu programmieren.

Abbildung 1: Meteor-Anwendungen sind bereits nach dem Erzeugen des Grundgerüsts lauffähig.

Meteor unterstützt den Programmierer bei seiner Arbeit in vielerlei Hinsicht. Beispielsweise startet das Framework nach jeder Änderung im Projektverzeichnis den Webserver neu und aktualisiert die Browseransicht selbsttätig. Abbildung 2 zeigt Meteors Ausgaben im Terminalemulator. Meteor meldet dort Neustarts und ermuntert den Anwendungsentwickler Fehler zu beheben.

Abbildung 2: Meteor dokumentiert fortlaufend den Status der Entwicklungsarbeit im Terminalfenster.

Das Webframework verarbeitet ausschließlich Programmcode in Javascript. Auf dem Server ist der mitgelieferte Webserver Node.js dafür zuständig [3], im Browser dessen Javascript-Engine. Meteor sortiert den Javascript-Code aus dem Projektverzeichnis selbsttätig.

Abbildung 3 zeigt die Zuordnung von Javascript-Dateien zur Server- (s) oder Client-seitigen (c) Ausführung am Verzeichnisbaum eines Projektverzeichnisses. Die Zahlen geben die Reihenfolge beim automatischen Laden an. Javascript-Dateien aus dem Verzeichnis »server« führt nur der Webserver aus, die in »client« nur der Browser. Alle anderen laufen auf beiden, ausgenommen sind die Ordner »public« (für Bilder und statische Dateien) und »private« (Dateien, die der Server, aber nicht der Browser lesen darf).

Abbildung 3: Meteor lädt Javascript-Code selbsttätig in den Webserver (s) oder den Browser (c).

Darüber hinaus ermöglichen es die beiden booleschen Eigenschaften »Meteor.isServer« und »Meteor.isClient« in Listing 2, die Ausführung von Javascript-Code auf den Webserver oder den Browser zu beschränken. Das Beispiel stammt aus der Datei »main.js« aus dem Projektverzeichnis in Abbildung 3. Zeile 1 wird von Webserver und Javascript-Engine, Zeile 3 nur vom Webserver und Zeile 5 nur von der Javascript-Engine im Browser ausgeführt.

Listing 2

Kontextspezifische Ausführung

01 console.log('Beide Kontexte');
02 if (Meteor.isServer)
03   console.log('Webserver Kontext');
04 else if (Meteor.isClient)
05   console.log('Browser Kontext');

Diesen Artikel als PDF kaufen

Express-Kauf als PDF

Umfang: 5 Heftseiten

Preis € 0,99
(inkl. 19% MwSt.)

Linux-Magazin kaufen

Einzelne Ausgabe
 
Abonnements
 
TABLET & SMARTPHONE APPS
Bald erhältlich
Get it on Google Play

Deutschland

Ähnliche Artikel

comments powered by Disqus

Ausgabe 10/2017

Digitale Ausgabe: Preis € 6,40
(inkl. 19% MwSt.)

Artikelserien und interessante Workshops aus dem Magazin können Sie hier als Bundle erwerben.