Ajax on Rails

Ajax on
he
sc e
ut ab
De usg
A
Dynamische Web-Anwendungen
mit Ruby on Rails
Rails
O’REILLY
Scott Raymond
Deutsche Übersetzung von Thomas Demmig
First
Inhalt
1
2
3
4
Max.
Linie
Vorwort . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
IX
Einführung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
1
Für wen dieses Buch gedacht ist . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Was Ajax ist . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Was Rails ist . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
»Was macht dein Ajax in meinem Rails?« . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
In Fahrt kommen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
1
2
10
13
14
19
Die ersten Schritte . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
21
Der klassische Weg . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
JavaScript-Bibliotheken und Prototype . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Rails mit ins Spiel bringen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
21
26
29
34
Einführung in Prototype . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
35
Vorbereitungen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Ajax-Verweise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Formulare . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Ajax-Formulare . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Buttons . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Formular-Observer . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
35
39
44
47
49
51
53
Einführung in script.aculo.us . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
54
Visuelle Effekte . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Drag-and-Drop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
54
60
70
Inhalt | V
This is the Title of the Book, eMatter Edition
Copyright © 2007 O’Reilly & Associates, Inc. All rights reserved.
Max.
Linie
Links
5
6
RJS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
71
Anweisungen statt Daten . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Das R in RJS stecken . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Ein reales Beispiel . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
71
72
88
89
Ajax Usability . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
91
Prinzipien der Usability . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 92
Der Web-Kontext . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 98
Usability im Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 100
Plattformübergreifende Entwicklung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 107
Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 113
7
Testen und Debuggen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 114
Debuggen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 115
Testen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 130
Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 144
8
Sicherheit . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 145
Gesunde Skepsis: Traue keiner Benutzereingabe . . . . . . . . . . . . . . . . . . . . . . . .
Passwörter hashen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Logs stummschalten . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Die Same-Origin-Regel . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Nutzung und Missbrauch der HTTP-Methoden . . . . . . . . . . . . . . . . . . . . . . . .
Verschlüsselung und Sicherheitszertifikate . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Die Rails Security Mailing List . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
9
145
155
157
158
160
163
165
165
Performance . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 166
Entwicklungs- und produktive Umgebungen . . . . . . . . . . . . . . . . . . . . . . . . . . .
Session-Verwaltung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Output Caching . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Asset Packaging . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Behandlung langlaufender Aufgaben . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
167
167
169
175
177
179
10 Prototype-Referenz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 181
Ajax-Unterstützung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 182
DOM-Manipulation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 190
Erweiterungen der Basis . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 205
Max.
Linie
VI |
Inhalt
This is the Title of the Book, eMatter Edition
Copyright © 2007 O’Reilly & Associates, Inc. All rights reserved.
Max.
Linie
Rechts
11 script.aculo.us-Referenz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 222
Visuelle Effekte . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Drag-and-Drop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Controls . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Element-Erweiterungen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
DOM-Builder . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
JavaScript-Unit-Tests . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Hilfsmethoden . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
223
233
244
253
255
256
259
A
Review Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 261
B
Foto-Galerie . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 280
C
Intranet Workgroup Collaboration . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 302
Index . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 355
Max.
Linie
Max.
Linie
This is the Title of the Book, eMatter Edition
Copyright © 2007 O’Reilly & Associates, Inc. All rights reserved.
Inhalt |
VII
First
Kapitel 3
KAPITEL 3
Einführung in Prototype
Das letzte Kapitel begann mit einer Einführung in Ajax ohne Unterstützung durch eine
Bibliothek, zeigte dann, wie Prototype helfen kann, und endete mit einem Appetithäppchen zu den Hilfsfunktionen von Rails. In diesem Kapitel sowie in den Kapiteln 4 und 5
werden wir uns intensiv mit Prototype und seinen Helpern beschäftigen – von den einfachsten Verweisen bis hin zu vollständigen interaktiven Komponenten mit visuellen
Effekten. Dieses Kapitel konzentriert sich auf die Helper, die mit Prototype interagieren,
um Ajax-unterstützte Verweise und Formulare zu erstellen. Eine vollständige Referenz
aller Fähigkeiten von Prototype finden Sie in Kapitel 10.
Vorbereitungen
Für die Beispiele in diesem Kapitel werden wir die Rails-Anwendung wiederverwenden,
die wir in Kapitel 2 erstellt haben, aber diesmal mit einem neuen Controller. Also zurück
zur Kommandozeile:
script/generate controller chapter3 get_time repeat reverse
Diese Anweisung generiert einen Controller chapter3 mit vier Actions: index, get_time,
repeat und reverse. Werfen Sie einen Blick auf http://localhost:3000/chapter3, um eine
ganz einfache View zu sehen (siehe Abbildung 3-1).
Im vorigen Kapitel haben wir die Beispiel-Views so einfach wie möglich gehalten. Dieses
Mal wollen wir sie ein wenig mit einem HTML-Layout und einer CSS-Datei aufbrezeln.
Erstellen Sie zunächst eine neue Layout-Datei, app/views/layouts/application.rhtml, und
tragen Sie dort ein einfaches XHTML-Template ein:
Max.
Linie
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Ajax on Rails</title>
Max.
Linie
| 35
This is the Title of the Book, eMatter Edition
Copyright © 2007 O’Reilly & Associates, Inc. All rights reserved.
Links
<%= javascript_include_tag :defaults %>
<%= stylesheet_link_tag "application" %>
</head>
<body>
<h1>Ajax on Rails</h1>
<%= yield %>
</body>
</html>
Abbildung 3-1: Ein neuer Controller
Für unsere Zwecke gibt es zwei wichtige Elemente. Das erste ist javascript_include_tag
:defaults, das Prototype und script.aculo.us einbindet (genauer gesagt prototype.js,
effects.js, dragdrop.js und controls.js), aber auch application.js, wenn es vorhanden ist.
Das zweite Element ist yield – dort wird der Inhalt Ihrer Action-Templates eingefügt.
Um das Ganze etwas hübscher zu gestalten, wollen wir eine einfache CSS-Datei public/
stylesheets/application.css anlegen:
Max.
Linie
body {
background-color: #eee;
color: #222;
font-family: trebuchet;
padding: 0;
margin: 25px;
}
h1 {
margin: -25px -25px 20px -25px;
padding: 50px 0 8px 25px;
border-bottom: 3px solid #666;
background-color: #777;
color: #fff;
font: normal 28pt georgia;
text-shadow: black 0px 0px 5px;
}
a { color: #229; }
.box {
border: 1px solid;
36 | Kapitel 3: Einführung in Prototype
Max.
Linie
Rechts
width: 100px; height: 100px;
padding: 5px;
font-size: .6em;
letter-spacing: .1em;
text-transform: uppercase;
margin-bottom: 20px;
}
.pink {
border-color: #f00;
background-color: #fcc;
}
.green {
border-color: #090;
background-color: #cfc;
}
.hover {
border-width: 5px;
padding: 1px;
}
ul {
background-color: #ccc;
padding: 5px 0 5px 30px;
}
Nun wollen wir dem Controller ein wenig Leben einhauchen. Bearbeiten Sie app/controllers/chapter3_controller.rb und definieren Sie ein paar Actions, die wir später nutzen
werden:
class Chapter3Controller < ApplicationController
def get_time
sleep 1.second
render :text => Time.now
end
def repeat
render :text => params.inspect
end
def reverse
@reversed_text = params[:text_to_reverse].reverse
end
end
Im nächsten Schritt wollen wir ein einfaches View-Template app/views/chapter3/index.
rhtml anlegen. Es besteht nur aus einer Zeile:
<%= link_to "Zeit anzeigen", :action => 'get_time' %>
Max.
Linie
Dabei wird der Helper link_to verwendet, der im letzten Kapitel vorgestellt wurde. Das
Ergebnis des Helpers ist wirklich einfach:
<a href="/chapter3/get_time">Zeit anzeigen</a>
Vorbereitungen
| 37
Max.
Linie
Links
Aktualisieren Sie die Seite in Ihrem Browser, damit Sie in etwa das erhalten, was Sie auch
in Abbildung 3-2 sehen. Klicken Sie auf den Verweis, damit die Action get_time die aktuelle Zeit als einfachen Text rendert.
Abbildung 3-2: Index-Template
Der Helper link_to besitzt ein paar Optionen, die erwähnenswert sind. Zuallererst
ermöglicht Ihnen die Option :confirm, ein Bestätigungsfenster per JavaScript auszugeben, so dass der Anwender die Aktion abbrechen kann, bevor sie gestartet wird. Stellen
Sie sich zum Beispiel vor, dass Sie einen Verweis haben, der eine potenziell gefährliche
Aktion ausführt:
<%= link_to "Rakete abfeuern", { :action => 'fire' },
:confirm => "Sind Sie wirklich sicher?" %>
Mit diesem bescheidenen Schutz hat der Benutzer die Möglichkeit Abbrechen anzuklicken,
um die Aktion abzubrechen.
Außerdem ermöglicht Ihnen die Option :method, eine HTTP-Methode für den Verweis
anzugeben – :get, :post, :put oder :delete. Vielleicht wird Sie diese Option ein wenig
überraschen – schließlich können normale Verweise nur HTTP GET nutzen und Formulare verstehen nur GET oder POST. Wie macht Rails das dann? Nun, es schummelt. Um
zu sehen, was ich meine, erstellen Sie wie folgt einen Verweis mit der Option :method:
<%= link_to "Löschen", "/people/1", :method => :delete %>
Max.
Linie
Wenn Sie sich den Quelltext anschauen, der durch den Helper erzeugt wird, werden Sie
ungefähr Folgendes sehen:
38 | Kapitel 3: Einführung in Prototype
Max.
Linie
Rechts
<a href="/people/1"
onclick="var f = document.createElement('form');
f.style.display = 'none';
this.parentNode.appendChild(f);
f.method = 'POST';
f.action = this.href;
var m = document.createElement('input');
m.setAttribute('type', 'hidden');
m.setAttribute('name', '_method');
m.setAttribute('value', 'delete');
f.appendChild(m);
f.submit( );
return false;">Löschen</a>
Der Code ignoriert das normale Verhalten von Verweisen. Stattdessen wird beim Anklicken hinter den Kulissen ein Formular dynamisch erzeugt und abgeschickt. Für sich
ermöglicht dieser Hack nur, POST-Anfragen abzuschicken. Was ist mit PUT und
DELETE? Um das zu erreichen, setzt Rails auf die POST-Methode auf. Wie Sie im generierten JavaScript sehen können, wird dem verborgenen Formular ein Feld namens _method
hinzugefügt. Wenn Rails diesen Parameter auf der Serverseite erhält, wird die Anfrage so
interpretiert, als ob diese Methode verwendet wird.
Dadurch ist es mit Hilfe eines kleinen Hacks möglich, Verweise zu erstellen, die die Vorteile des gesamten Spektrums der HTTP-Methoden ausnutzen können. Die Gründe für die
Verwendung der korrekten HTTP-Methoden werden ausführlich in Kapitel 6 behandelt.
Ajax-Verweise
Jetzt haben wir eine ordentliche Grundlage, so dass wir dem Ganzen nun etwas Ajax hinzufügen können. Ändern Sie Ihr Template index.html, damit es so aussieht:
<%= link_to_remote "Zeit anzeigen",
:update => 'current_time',
:url
=> { :action => 'get_time' } %>
<div id="current_time"></div>
Wir haben link_to in link_to_remote umgeändert und eine neue Option :update hinzugefügt. Der Wert von :update verweist auf eine ID eines HTML-Elements, in das die Antwort von Ajax eingefügt werden soll – in diesem Fall ein DIV. Der erzeugte HTML-Code
sieht so aus:
<a href="#"
onclick="new Ajax.Updater('current_time', '/chapter3/get_time',
{asynchronous:true, evalScripts:true});
return false;">Zeit anzeigen</a>
<div id="current_time"></div>
Max.
Linie
Wenn Sie sich den generierten HTML-Code anzeigen lassen, werden Sie sehen, dass
Ajax.Updater von Prototype verwendet wird. Alle Ajax-Helper von Rails funktionieren auf
Ajax-Verweise | 39
Max.
Linie
First
Index
Symbole
$( )-Methode 79
37signals 13
A
Max.
Linie
Action Caching 169, 171
Filter-Verarbeitung und 172
ActionController 19
ActionPack und Debuggen 122
ActionView 19
ActiveRecord 18, 19, 168
Rails-Konsole verwenden mit 120
und Debuggen 120
ActiveRecordStore und Performance 168
Adressleiste, Navigieren über 101
Agile Entwicklungs-Methoden 140
Ajax
Asynchron 8
Beispiele 21–34
Formulare 47
Geschichte von 7
JavaScript 8
Leichtigkeit 4
Modell, das 3
Proxy erstellen 158
Reaktion auf Web-Performance 3
Schicht, versus User-Interface-Schicht 4
Überblick 2–9
Unterstützung 182–189
Anfragen 183
Basis-Objekte 182
globale Responder 189
Updater 186
Usability 101
versus klassischer Anfrageverlauf 4
Verweise 39
Websicherheit und 145
XML 9
XMLHttpRequest 8
Ajaxifizierte Sortables 66
Ajax-Navigation 101
Aktualisieren versus Ersetzen 6
API, ActiveRecord 122
Apple 1
Application Trace 116
ARTS (Another RJS Testing System) Plugin 133
Assert Packager Plugin 176
assert_valid_markup Rails Plugin 135
asset packaging 175
Assoziationen 19
asynchrone Anfragen 26
Automatisiertes Testen 114
Autovervollständigen 244
B
BackgrounDRb Plugin 177
Backpack 13
Basecamp 11
Basiserweiterungen 205, 218, 219
Bedeutung von Farben 97
Beobachten eines Feldes 51
Beobachten eines ganzen Formulars 53
Berners-Lee, Tim 6, 100
Beschränkung auf eine Domäne 158
Blockieren 26
Breakpoints 123
Max.
Linie
| 355
This is the Title of the Book, eMatter Edition
Copyright © 2007 O’Reilly & Associates, Inc. All rights reserved.
Links
Button 49
für eigene Funktionen 50
button_to_function 50
C
Cache Sweepers 175
Caching, Einschränkungen 170
Callbacks 19, 40, 58
CamelCase verwenden 60
Camino 55
Card Validation Value (CVV) und Audits 157
Cascading Style Sheets (CSS) 9
Code
Beispiele XI
Collection Proxies (RJS) 79
Constraint 67
Containment 68
Cookies, Feed Reader und 169
Cross Site Cooking und Sicherheit 153
Cross-Site Scripting (XSS) 154
CRUD Rails-Actions 132
CSS (Cascading Style Sheets) 9, 129
CVV (Card Validation Value) 157
D
Max.
Linie
Daten im Speicher puffern 168
Daten-Mapper 19
Datensatz-IDs 146
in URLs 148
David Siegel, Zeitalter des 7
Debuggen 115–130
ActionPack 122
ActiveRecord 120
Application Trace 116
Breakpoints 123
Framework Trace 117
Inspektoren 125–130
Debug Helper 125
FireBug (Firefox-Erweiterung) 127
RJS-Debugging-Modus 125
Routing Navigator 127
instance_variables (Methode) 124
Integration Session 122
Interactive Ruby (Irb) 119
interaktive Shell (Konsole) 119
Introspektion 120
356 | Index
Logdateien 117
Logger 117
Nachrichten 115
print-Anweisung (puts) 117
Rails Standard-Logger 119
Rails-Ausnahmen 115
Stack Trace 116
tail (Tool) 117
vollständiger Trace 117
Debug-Helper 125
Design-Sichtbarkeit 95
Development Log verwenden 117
Document Object Model (DOM) 9
dokumentenzentriertes Modell 3
DOM (Document Object Model) 9
Domain Specific Languages (DSLs) 72
DOM-Anpassungen 190–205
in der JavaScript-Bibliothek
Prototype 190–205
Don’t Repeat Yourself 13
Draggables 61, 233
Drag-und-Drop-Funktionalität 233
dropOnEmpty 68
Droppables 64, 238
DRY-Prinzip 13
E
ECMAScript 8
Effect (Objekt) 54
Effect-Instanz-Methoden und
-Eigenschaften 228
Effekt-Callbacks 231
Effekt-Queues 231
Effekt-Transitionen 229
eigene Helper 50
Eingabefeld-Kontrolle 190
eingeschränkte Queries verwenden 146
Element-Positionierung 202
Element-Proxies
eigene Methoden 76
Inhalte aktualisieren 77
Embedded Ruby (ERb) 29
ERb (Embedded Ruby) 29
Errors versus Failures beim Testen 132
Erwartungs-Management 93
Exception-Debugging-Screen 115
This is the Title of the Book, eMatter Edition
Copyright © 2007 O’Reilly & Associates, Inc. All rights reserved.
Max.
Linie
Rechts
F
H
Fähigkeiten und Usability 109
Farbe, angemessene Verwendung 97
Farbe, Verwendung von 97
FireBug (Firefox-Erweiterung) 127
Firefox 8, 55
form_for 47
form_tag (Helper) 47
Formulare 44, 47
Formular-Helper 47
Formular-Observer 51, 203
Formular-Tag-Helper 44
Formular-Validierung und Sicherheit 151
Foto-Galerie (Anwendung) 280–301
JavaScript und CSS 295
CSS-Stylesheet 297
Photo.show 295
Routen, Controller und Views 283
Alben anzeigen 287
Editier-Formular 286
Hauptlayout 285
Hilfs-Methoden 284, 285
SessionsController 286
Umgebung 284
Schema und Modelle 281
Fragment Caching 169, 173
Cache-Helper 174
Framework 10
Framework Trace 117
Fuchs, Thomas 222
funktionale Tests versus Integrationstests 136
funktionales Testen 131
Handle 66
Hansson, David Heinemeier (DHH) 11
Hash 155
Helper 32
eigene 50
hide( ) und show( ) (Methoden) 41
Hilfs-Nuggets 107
hoverclass 64, 66
HTTP-Methoden
korrekte Verwendung 161
Missbrauch 160
HTTP-Methoden (Verben) 98
HTTP-Sniffing-Tool 98
Hypertext 6
G
Garrett, Jesse James 8
getRequestObject( ) 25
Ghosting 67
Google 1
Google Web Accelerator (GWA) 160
Graceful Degradation 111
gute Benutzererfahrung 55
GWA (Google Web Accelerator) 160
I
IBM 1
Idempotenz versus Sicherheit 98
Inspectoren und Debugging 125–130
instance_variables (Methode) 124
Instanz-Variable 29
Integration Session und Debuggen 122
Interactive Ruby (Irb) 119
Interaktive Shell (Konsole) und Debuggen 119
Internet Explorer 9, 27, 55
Intranet Workgroup Collaboration
Anwendung 311–317
Anwendungs-Ccontroller 311
Hilfsmethoden 312
Navigations-Layout 314
Benutzer 339
Ausgeben und neue hinzufügen 343
Daten bearbeiten 344
neu erstellen 344
Profil bearbeiten 341
Status anzeigen 342
UsersController 339
Dokumente 326–329
ein neues Dokument erstellen 328
eine Datei hochladen 326
JavaScript und CSS 345–354
PostForm (Klasse) 345
Kommentare
CommentsController 319
Max.
Linie
Max.
Linie
This is the Title of the Book, eMatter Edition
Copyright © 2007 O’Reilly & Associates, Inc. All rights reserved.
Index |
357
Links
Kontakte 322–326
ContactsController 322
Formular zum Eingeben von Kontaktinformationen 322
Formular zum Erstellen neuer
Kontakte 325
Nachrichten 330
Pläne 332
PlansController 332
Posts 317–319
PostsController 317
Projekte 335
ProjectsController 335
Routen, Controller und Views 308–310
Authentifizierungs-Service 309
environment (Datei) 308
LabelingFormBuilder 310
Routing 308
Schema und Modelle 302–308
Attachment 308
Comment 307
Contact 306
Document 307
Message 307
Plan 307
Post 305
Project 307
User (Modell) 305
Sessions 337
Anmelde-Formular 338
SessionsController 337
Intranet Workgroup Collaboration
(Anwendung) 302–354
Introspektion 12, 120
IRC-Channel für Rails 15
J
Max.
Linie
Japan, Ruby in 11
JavaScript auf Ajax-Anfragen zurückgeben 72
JavaScript Object Notation (JSON) 159
JavaScript Unit Testing 140, 256
script.aculo.us 140
JavaScript, durch Methoden generiert 2
JavaScript, eigenes erstellen 85
JavaScript, mit Ruby erstellen 73
javascript_include_tag 36
JavaScript-Bibliotheken 27
JavaScriptGenerator (RJS) (Methoden) 83
JSON (JavaScript Object Notation) 159
358 | Index
K
Klassen-Proxies (RJS) 86
Konqeror 55
Konsequenzen verbesserter Reaktionszeiten 104
konsistente Seitenelemente 102
konsistente Seitenelemente und Usability 102
Konvention vor Konfiguration 12
kryptographische Hashes 155
L
langlaufende Aufgaben 177
Layouts 30
leere Seite 104
link_to 32, 38
link_to_function 44, 55
link_to_remote 39, 44
Optionen 42
link_to_remote (Helper) 73
Lipogramme und Rails 11
LiveScript 8
Logger und Debuggen 117
M
Mac, Verwendung 94
Markup-Validierung 135
Massenzuweisung 149
Matsumoto, Yukihiro 11
Meinung, Software mit einer 12
memcached und Performance 168
Mentor-Metapher 95
Microsoft 1
Microsoft Windows 94
Mind Hacks und Usability 97
Model View Controller (MVC) 10
Mongrel 17
Mosaic 7
Mozilla 8
MVC (Model View Controller) 10, 29
MySQL-Installer für Windows,
Mac und Linux 16
N
Nachrichten und Debuggen 115
Navigation, Fallen 101
Netscape 8, 109
Nugget, Hilfe durch 107
This is the Title of the Book, eMatter Edition
Copyright © 2007 O’Reilly & Associates, Inc. All rights reserved.
Max.
Linie
Rechts
O
Object-Relational Mapper (ORM) 18
observe_field 51
observe_form 53
onChange 69
onclick (Attribut) 40
only 67
onUpdate 69
Opera 8, 55
ORM (Object-Relational Mapper) 18
Output Caching 169
Output-Caches ungültig werden lassen 174
overlap 67
P
Max.
Linie
Page Caching 169, 170
Partials 31
Schleifen und 31
Passwörter zurücksetzen 155
Performance 166–180
ActiveRecordStore 168
Assert Packager Plugin 176
Asset Packaging 175
BackgrounDRb Plugin 177
Cache Sweepers 175
langlaufende Aufgaben, Umgang mit 177
memcached 168
Output Caches leeren 174
Output Caching 169
Rails 167
Sessions abschalten 169
Session-Verwaltung 167
SQLSessionStore 168
Persönlicher Assistent (Metapher) 92
Plattform, Definiton 107
plattformübergreifende Entwicklung 107, 110
Plattform-Unterschiede, Umgang mit 108
postmoderne Ära der Webentwicklung 7
print (Anweisung) 117
Prinzipien der Usability 92
Produktivitäts-Beispiel 4
Progressive Enhancement 111
Prototype 13, 27, 35–53
$( ) (Funktion) 28
Ajax.Updater (Methode) 39
eine HTTP-Methode für einen Verweis
angeben 38
einfaches View-Template-Beispiel 37
element (Objekt) 76
HTML-Layout und CSS-Datei (Beispiel) 35
mit Rails 29
unittest.js Testsuite 144
versus script.aculo.us 54
Prototype JavaScript-Bibliothek 181–221
Ajax-Unterstützung 182–189
Ajax-Anfragen 183
Ajax-Updater 186
globale Responder 189
grundlegende Objekte 182
Basiserweiterungen 205–221
Array 205
Bereiche 207
die genutzte Version der Bibliothek
angeben (Prototype) 220
eine Funktion wiederholt aufrufen (PeriodicalExecuter) 219
Enumerable (über Collections iterieren)
208
Ereignisse 215
Funktionen 217
Hashes 206
hexadezimale Darstellung einer Zahl 215
Klassen 219
Objekt-Erweiterungen 218
String-Ersetzungen 212
verschiedene Funktionen ausprobieren,
bis eine funktioniert
(Try.these) 220
DOM-Änderungen 190–205
CSS-Klassennamen eines Elements 200
Dollar-Funktion 190
dynamisch Inhalte einfügen 201
Element-Methoden 193–200
Element-Positionierung 202
Formular-Observer 203
Kontrolle von Eingabefeldern 190
Selektoren 191
Website 181
Q
Queues 58
R
Rails
API-Dokumentation 15
Ausnahmen 115
This is the Title of the Book, eMatter Edition
Copyright © 2007 O’Reilly & Associates, Inc. All rights reserved.
Max.
Linie
Index |
359
Links
Max.
Linie
Framework 10
Full-Stack 10
Generator 22
Helper und 32
Instruktionen versus Daten 71
intention und 13
Introspektion und 12
IRC-Channel 15
Lipogramme und 11
Mailing-Liste 16
Mantras 11
MVC (Model View Controller) 10
Performance und 167
Projekt beginnen 22
Prototype und 29
Rahmen 222
Ressourcen 15
Sicherheits-Mailing-Liste 165
Texteditor 16
Überblick 10–19
Usability und 109
Wiki 16
Rake 72
Reiseleiter (Metapher) 93
Remote Scripting 7
remote_form_for 49
replace (Methode) 77
replace_html (Methode) 77
Review Quiz (Anwendung) 261–279
JavaScript und CSS 273
Stylesheet 275
Routen, Controller und Views 264
Drag-und-Drop-Sortierung 266
Editieren 268
Ergebnisse 269
Layout-View 264
Quiz-Controller 266
Schema und Modelle 262
Question (Modell) 263
Quiz (Modell) 263
Session-basierte Authentifizierung 261
RJS 71–90
.rjs-Dateien 74
all (Methode) 82
Anweisungen 72
any (Methode) 82
Ausführung verzögern 84
collect (map) (Methode) 80
360 | Index
Collection-Proxies 79
Debugging-Modus 125
detect (find) (Methode) 81
DOM-Elemente anpassen 84
Drag-und-Drop-Elemente erstellen 85
each (Methode) 80
eigenes JavaScript generieren 85
Element-Proxies 75–79
Helper 86
Inhalte einfügen 84
inject (Methode) 83
invoke (Methode) 80
JavaScript mit Ruby generieren 73
JavaScript rendern ohne RJS 73
JavaScriptGenerator-Methoden 83
Klassen-Proxies 86
Lösung versus klassischer Weg 89
max (Methode) 82
ohne Ajax 87
partition (Methode) 82
pluck (Methode) 80
reales Beispiel 88
reject (Methode) 81
reload (Methode) 79
select (Methode) 79, 81
sort_by (Methode) 83
Testen und Debuggen 74
Überblick 72
umleiten 84
zip (Methode) 83
Routing Navigator 127
Ruby
Beginnen 14
Dokumentation zur Basis und zur StandardBibliothek 15
Domain Specific Languages (DSLs) 72
Geschichte von 11
Installieren 14
IRC-Channel 15
Mailing-Liste 15
Rake 72
Ressourcen 14
RubyGems Paketverwaltung 15
Tutoriums-Website 14
Website 14
Ruby on Rails (siehe Rails)
Ruby-generiertes JavaScript (siehe RJS)
This is the Title of the Book, eMatter Edition
Copyright © 2007 O’Reilly & Associates, Inc. All rights reserved.
Max.
Linie
Rechts
S
Max.
Linie
Safari 8, 55
Same-Origin-Richtlinie 158
Schleifen und Partials 31
script.aculo.us 13, 54–70, 222–259
Assertions 258
Autovervollständigen 244
Basiseffekte 223
Effect.Highlight 224
Effect.Move 223
Effect.Opacity 223
Effect.Parallel 225
Effect.ScrollTo 225
Callbacks 58
DOM-Builder 255
Draggables 61, 233
Drag-und-Drop 60
Drag-und-Drop-Funktionalität 233
Droppables 64, 238
Effect (Objekt) 55
Effect.toggle 57
Effekt-Callbacks 231
Effekt-Instanzmethoden und
-eigenschaften 228
Effekt-Optionen 227
Effekt-Queues 231
Effekt-Transitionen 229
Element-Erweiterungen 253
Funktionalität für Controls 244–253
gute Benutzerefahrung 55
Hilfsmethoden 259
In-Place-Editoren 247
JavaScript Unit Testing 140, 256
Kombinationseffekte 56, 225
Effect.Appear 225
Effect.BlindDown 226
Effect.BlindUp 226
Effect.DropOut 226
Effect.Fade 225
Effect.Fold 227
Effect.Grow 227
Effect.Puff 226
Effect.Pulsate 227
Effect.Shake 226
Effect.Shrink 227
Effect.SlideDown 226
Effect.SlideUp 226
Effect.Squish 227
Effect.SwitchOff 226
Slider 250
Sortables 66, 239–244
Ajaxifiziert 69
horizontal sortierbar 241
scrollbar 241
sortierbarer Baum 242
statische Effekt-Methoden 233
Test.Unit.Runner 142
Test-Wiki 144
Transitionen 59
Umschalt-Effekte 57
unittest.js Test Suites 144
verkettete Effekte (Queues) 58
versus Prototype 54
visual_effect (Helper) 59
visuelle Effekte 54, 223
Website 222
script/server (Befehl) 17
Scrollen 68
Secure Sockets Layer (SSL) 163
Seite, Konzept der 100
Seitenelemente 100
Sessions abschalten 169
Sessions abschalten und Performance 169
Session-Verwaltung 167
sichere Operationen versus Idempotenz 98
Sicherheit 145–165
Ajax-Proxy erstellen 158
Beschränkung auf eine Domäne 158
Card Validation Value (CVV) und Audits 157
Cross-Site Cooking 153
Cross-Site Scripting (XSS) 154
Datensatz-IDs 146
in URLs 148
eingeschränkte Queries 146
Formular-Validierung 151
Hash 155
HTTP-Methoden, Missbrauch 160
JSON 159
Logs stummschalten 157
Massenzuweisung 149
Passwörter zurücksetzen 155
Rails Sicherheits-Mailing-Liste 165
Same-Origin-Richtlinie (Beschränkung
auf eine Domäne) 158
Secure Sockets Layer (SSL) 163
Session Fixation 153
SQL-Injection 151
Trust, but Verify 146
This is the Title of the Book, eMatter Edition
Copyright © 2007 O’Reilly & Associates, Inc. All rights reserved.
Index |
361
Max.
Linie
Links
Benutzer-Modell 93
direkte Anpassung 96
Erkennen der Fähigkeiten 109
Grips 95
Hilfs-Nuggets 107
Idempotenz 98
konsistente Seitenelemente 102
leere Seiten 104
Mentor (Metapher) 95
Mind Hacks und 97
persönlicher Assistent (Metapher) 92
Plattformen, Unterschiede 108
plattformübergreifende Entwicklung 107
Prinzipien 92–97
Programm-Modell 93
Rails und 109
Reaktion, verbesserte 103
Reiseleiter (Metapher) 93
Taggen 107
Tastenkürzel und 102
Trainingsinhalt 105
Web
HTTP 98
Seite 99
Windows- versus Mac-Programm-Modell 94
Verschlüsselung und Sicherheitszertifikate 163
Vertraue keiner Benutzereingabe 145
Sicherheit-Logs stummschalten 157
Sicherheitszertifikate und Verschlüsselung 164
sortable_element (Helper) 66, 69
sortable_element_js (Helper) 66
Sortables 66, 239–244
Spitzhacken-Buch 14
SQL-Injection 151
SQLSessionStore 168
SSL (Secure Sockets Layer) 163
Stack Trace 115
Stack Trace und Debuggen 116
T
TaDa List 13
Tag 67
Taggen 107
tail (Tool) und Debuggen 117
Tastaturbefehle und Usability 102
Testen 130–144
ARTS (Another RJS Testing System)
Plugin 133
assert_valid_markup Rails-Plugin 135
Errors versus Failures 132
funktionale Tests 131
HTML-Validität 134
Integrationstests 136
JavaScript Unit Testing 140
Markup-Validierung 135
open_session 138
script.aculo.us-Wiki 144
Test::Unit 131
test_orders 138
test_signin 138
Testen und Debuggen 114–144
RJS 74
Test-Stubs 114
Thomas, Dave 14
trainer metaphor 96
Trainingsinhalt 105, 107
Trust, but Verify 146
U
Max.
Linie
unittest.js Test Suites 144
Usability 91–113
Ajax, wann verwenden 101
Aufforderungen 95
362 | Index
V
Validierungen 19
verbesserte Reaktion mit Ajax 103
Verschlüsselung und Sicherheits-Zertifikate 163
Vertraue keiner Benutzereingabe 145
Verweise 39
Visual Basic-Skripte 9
visual_effect (Helper) 59
vollständiger Trace 117
W
W3C-Validator, Interaktion mit 135
Web
Ajax-Modell 4
klassisches Modell 2
Zeitalter der Entwicklung 6
Web Remoting 7
Web Startups 1
WEBrick 17
WorldWideWeb-Programm 6
Wright, Ernest V. 11
This is the Title of the Book, eMatter Edition
Copyright © 2007 O’Reilly & Associates, Inc. All rights reserved.
Max.
Linie
Rechts
X
XML und Ajax 9
XMLHTTP (ActiveX-Objekt) 8
XMLHttpRequest 8, 21, 109, 289
XMLHttpRequest für domänenübergreifende
Anfragen, umleiten 159
XSS (Cross-Site Scripting) 154
Y
Yahoo 1
YAML (Yet Another Markup Language) 125
yield 36
Z
Zeitalter der Web-Entwicklung 6
zeitbasierte versus framebasierte Effekte 58
zu einer eigenen Funktion verweisen 44
Zurück-Button 101
Max.
Linie
Max.
Linie
This is the Title of the Book, eMatter Edition
Copyright © 2007 O’Reilly & Associates, Inc. All rights reserved.
Index |
363