JavaScript mit Rückgrat

Quellcode strukturieren mit Backbone
Kommentare

JavaScript ist aus modernen Webapplikationen nicht mehr wegzudenken. Doch wie strukturiert man seinen Quellcode so, dass er wart- und erweiterbar bleibt? Hier kommt das leichtgewichtige Strukturframework Backbone ins Spiel. In diesem Artikel wollen wir einen ersten Blick riskieren.

PHP Magazin

Der Artikel „JavaScript mit Rückgrat“ von Sebastian Springer ist erstmalig erschienen im PHP Magazin 3.2012.

JavaScript ist aus modernen Webapplikationen nicht mehr wegzudenken. Mittlerweile haben sich auch Bibliotheken wie beispielsweise jQuery auf breiter Front durchgesetzt. Sie stellen eine Sammlung von allgemeinen Problemlösungen dar, die den Entwicklern die Arbeit erleichtern und über die Stolpersteine der Browserinkompatibilitäten hinweghelfen wollen. Vermischt man jetzt allerdings seinen JavaScript-Quellcode mit HTML, verschlechtert sich die Wartbarkeit der Applikation mit zunehmendem Wachstum rapide und Entwickler können innerhalb kürzester Zeit kaum mehr auf geänderte Anforderungen reagieren. Die Lösung für dieses Problem lautet Strukturierung. Wie strukturiert man aber seinen JavaScript-Quellcode so, damit er über lange Zeit wart- und erweiterbar bleibt und so eine lange Lebenszeit der Software unterstützt? Genau hier kommt Backbone ins Spiel. Es ist ein sehr leichtgewichtiges Strukturframework für JavaScript. Dabei ist es so konzipiert, dass es sich nur auf seine Aufgabe, die Strukturierung der Applikation, konzentriert und alle anderen Aufgaben anderen Komponenten überlässt. Das führt einerseits dazu, dass Backbone recht überschaubar ist und andererseits nur den Themenbereich fokussiert, für den es entwickelt wurde. Diese Tatsache bringt aber auch einen Nachteil mit sich: Backbone kann nicht für sich alleine verwendet werden, stattdessen müssen gewisse Voraussetzungen für die Lauffähigkeit erfüllt sein.

Voraussetzungen – was wird benötigt?

Durch die beschriebene Spezialisierung von Backbone benötigt es weitere Bibliotheken, die sich um die Unterstützung des Strukturframeworks kümmern. JavaScript wird im Clientbereich vor allem in HTML-Dokumenten verwendet. Damit die Applikation Zugriff auf den DOM erhält, ihn auslesen und auch modifizieren kann, benötigt Backbone ein Framework wie jQuery oder Zepto. Das kommt überall dort zum Einsatz, wo es Schnittstellen zum DOM gibt. Moderne Webapplikationen leben aber nicht nur von DOM-Operationen, sondern auch von der asynchronen Kommunikation mit einem Server. Auch hier benötigt Backbone Unterstützung. jQuery oder Zepto übernehmen die Kommunikation zum Server mittels der Ajax-Komponente, die durch Backbone.sync gekapselt wird. Im Weiteren wird hauptsächlich auf jQuery eingegangen, da es eine weitere Verbreitung hat und Zepto eine jQuery-kompatible Syntax aufweist.

Die zweite Voraussetzung, die für eine lauffähige Applikation mit Backbone erfüllt sein muss, ist Underscore.js. Underscore stellt so etwas wie den Werkzeugkasten für eine Applikation dar. Es ist eine lose Sammlung von Hilfsfunktionen. Dabei wird auf die browsereigenen Implementierungen der Funktionen zurückgegriffen, falls sie vorhanden sind. Andernfalls stellt Underscore eine standardkonforme Implementierung zur Verfügung. Unter anderem stehen Collection-Funktionen zur Verfügung, die verschiedene Operationen map, reduce, Suchen oder Iterationen auf Arrays und Objekte erlauben. Neben diesen Funktionen sind klassische Array-Operationen wie Differenzen oder Schnittmengen und klassische Objektoperationen wie Typprüfungen Bestandteil des Funktionsumfangs. Zu bemerken ist außerdem, dass es Unterstützungsfunktionen für Funktionen wie die bind-Funktion, die auf einfache Weise eine Funktion in einen Objektkontext bindet, gibt. Sind diese Voraussetzungen, wie in Listing 1 zu sehen, erfüllt, kann man mit dem Aufbau seiner Applikation mit Backbone beginnen.

Listing 1: index.html

   
      Backbone Example   
      ...
   

Themen der kommenden Seiten:

  • Die Struktur von Backbone
  • Events
  • Models und Views
  • Die Collection
  • Hinzufügen, editieren und löschen
  • Der Controller
  • Mit dem Server sprechen
  • Ausblick
Unsere Redaktion empfiehlt:

Relevante Beiträge

Meinungen zu diesem Beitrag

X
- Gib Deinen Standort ein -
- or -