AJAX und Ruby on Rails

Web-2.0-Kongreß 2006-10-10 Frankfurt(slightly updated for AWE11)

Prof. Dr.-Ing. Carsten Bormann <cabo@tzi.org>

1

Was ist Web 2.0? (nach Paul Graham)

(1) AJAX

(2) Demokratie (Participation ∧ ¬Control)

(3) Ethik: „Don’t be evil“

2

Übersicht

AJAX — das Ende schwerfälliger Web-Schnittstellen Herausforderungen bei der Entwicklung von AJAX-

Anwendungen Ruby on Rails — die Entwicklungsumgebung der Wahl für

Agile Web-Entwicklung AJAX-Unterstützung in Rails

3

Umfrage:

Wer hat schon etwas von AJAX gehört?

Wer hat es schon ausprobiert?

Wer hat schon ein Projekt damit durchgeführt?

4

AJAX: Stand Juni/Juli 2006

5

Source: The State of Web Development 2006/2007, SitePoint Pty Ltd. and Ektron, Inc., August 2006http://www.sitepoint.com/launch/survey06/

The State of Web Development 2006/2007 Results Preview

Copyright © 2006, SitePoint and Ektron. Purchase the full report from http://www.www.sitepoint.com/launch/survey06/

Which technologies do you or your organization use

in your current web projects?

AJAX: Planung 12 Monate

6

Source: The State of Web Development 2006/2007, SitePoint Pty Ltd. and Ektron, Inc., August 2006http://www.sitepoint.com/launch/survey06/

The State of Web Development 2006/2007 Results Preview

Copyright © 2006, SitePoint and Ektron. Purchase the full report from http://www.www.sitepoint.com/launch/survey06/

Which technologies are you or your organization planning to use in

your future web projects (next 12 months)?

Was ist AJAX?

Garrett: „Asynchronous JavaScript and XML“ (2005-02-18) 2006: Pizza

Hefeteig (HTML) Käse (JavaScript) Tomaten (CSS) Oregano

(XMLHttpRequest) Weitere Toppings

Sardellen (XML) Salami (JSON)

7

Interaktionsmuster vor AJAX

Rein Client-seitig: DHTML (JavaScript) Server-Zugriff: „Abschicken“

(Link verfolgen, Formular abschicken) Seite wird neu aufgebaut

Im besten Fall wird der Fokus geeignet rekonstruiert Bruch im Interaktionsfluß

1990er-Krücke: Frames starr Verlust wichtiger Web-Funktionen

8

Interaktion mit AJAX

Längeres Verbleiben auf einer „Seite“ Extremfall: „Single-Page Application“

Interaktionen mit dem Server finden im Hintergrund statt AJAX: asynchronous

Wichtige Funktionen sind in JavaScript programmiert AJAX: JavaScript

Server-Interaktion kann mit XML stattfinden AJAX: XML AJA* wäre passender

Keine neuen Browser, Plugins, ...

9

AJAX ist ein Rezept...

... keine genaue Liste von Zutaten Asynchronität kann auf vielen Wegen erreicht werden

XMLHttpRequest IFrames Cookies

Datenformat muß nicht XML sein HTML JSON JavaScript!

Konstante: JavaScript

10

JavaScript: Die unterschätzte Sprache

Schlechter Leumund Jahrelanges inkompetentes Cut-and-Paste Fragwürdige „Effekte“ Gestörte Barrierefreiheit

Tatsache: JavaScript ist eine der fünf führenden dynamischen Programmiersprachen

Hintergrund: Self, Smalltalk

11

Alte Fehler nicht wiederholen

Keine „coolen“ Effekte bringt ein Effekt einen Nutzen in der Interaktionslogik?

Websites müssen auch ohne JavaScript funktionieren „Unobtrusive JavaScript“ Zurückfallen auf Standard-HTML ➔ Barrierefreiheit

Web-Funktionen müssen weiter funktionieren: Bookmarks und Permalinks; Suchmaschinen Zurück-Knopf

Es gibt noch wenig AJAX-Konventionen Benutzer brauchen mehr Führung!

12

AJAX-Entwicklung: nicht unproblematisch! AJAX = Browser jenseits ihres Designs nutzen!

Bugs Kompatibilitätsfragen (Mehrfachprogrammierung)

Abhilfe: JavaScript-Bibliotheken enthalten bereits die nötigen Browserspezifika werden kontinuierlich an neue Browser angepaßt

Führende JavaScript-Bibliotheken: Prototype/Script.aculo.us/Rico Dojo

13

14Source: Ajaxian.com

✓✓

✓

15

AJAX vs. „RIA“

„Rich Internet Application“ = Mehr als Web 1.0 Java Applets: Naheliegend für Java-Anwender

Komplexe Berechnungen, interaktive Grafik Flash: sieht gut aus; ActionScript ≈ JavaScript

Lösung der Wahl für Audio/Video-Bestandteile Integration mit Web nach wie vor nicht gut

AJAX kann diese (und andere) Richer Plugins integrieren

16

Rails in AJAX

MVC-Modell: AJAX wird auf View-Seite durch Helper unterstützt

Enge Integration mit Prototype und Script.aculo.us Die wichtigsten Aktionen und Effekte für AJAX-Websites sind da Links und Formulare; Observer und Updater; Visuelle Effekte

Neu in Rails 1.1: RJS Ruby-Notation für JavaScript-Programme JavaScript-Kenntnisse nur noch für Debugging erforderlich

Neu in Rails 3: Unobtrusive JavaScript ... und freie Auswahl des JavaScript-Frameworks

17