Zitat.json – Software agil entwickeln: Agile Umsetzung (Aufgabenstellungen)

Aus Wikibooks
Zur Navigation springen Zur Suche springen

▵ Inhaltsverzeichnis

Ausblick[Bearbeiten]

Grundlage von Web 2.0 sind aktive Benutzer und User Generated Content. Ausgehend von der Art des Inhaltes, welcher den Schwerpunkt von Web 2.0 Plattformen bildet, können Inhalts- oder beziehungsorientierte Web 2.0 Plattformen sowie virtuelle Welten unterschieden werden.

Folgend einige Web 2.0 Begriffe:

Wiki(pedia) RSS Document Object Model (DOM)
CSS AJAX JavaScript
HTML Mobile Endgeräte Web
User Generated Content Web Services Communities
Weblog XING Twitter
Google Docs Flickr Folksonomy
PHP Cookies XMLHttpRequest
API Abonnementdienste Technologien
Semantisches Web podcast Begriffsnetz
Auftrag Richtzeit
Markieren Sie die Begriffe in der Tabelle die Sie einer anderen Person erklären können mit einem Grünen Hintergrund. Markieren Sie die Begriffe die Sie nicht kennen oder verstanden haben mit einem Gelben Hintergrund. 20 Min.
Erarbeiten Sie nun die Erklärung der Begriffe welche Sie nicht kennen. Sie können in den Unterlagen (Lehrmittel, Notizen, Internet, etc.) nachschlagen. 25 Min.
Erstellen Sie während dem Projekt ein Lexikon mit Begriffe die Sie erforschen.

Backend bereitstellen (SQL + PHP > TXT/HTML)[Bearbeiten]

In einem ersten Schritt werden die Daten aus der Datenbank ausgelesen und mittels HTML angezeigt.

Aufgabe: Datenbank einrichten[Bearbeiten]

Auftrag Richtzeit
Erstellen Sie das vorgegebene Datenmodell mittels phpMyAdmin in der Datenbank citation 10 Min.
Suchen Sie im Internet nach Zitate und Sprichwörtern, welche Ihnen gefallen. Schauen Sie z.B. auf http://zitate.net nach 10 Min.
Erstellen Sie bis zu 10 Einträge in der Tabelle citation. Achten Sie dabei auf die Eindeutigkeit der Zitate und Sprichwörtern. Als Datum für die Attribute created / updated verwenden Sie NOW(). 10 Min.
Notieren Sie sich die SQL Syntax um Datensätze einzufügen. INSERT … 2 Min.
Wie fügt man beim erstellen der Datensätze einen automatischen (Jetzt) Zeitstempel hinzu? 3 Min.
Optimieren Sie das Datenmodell (Don't Make Me Think). Sorgen Sie dafür dass Zitate und Sprichwörtern vom selben Autor nur einmal eingetragen werden können (UNIQUE). Notieren Sie sich die entsprechende SQL Syntax. 5 Min.
Exportieren Sie das neue Datenmodell über phpMyAdmin. Speichern Sie das Datenmodell in der SQL Syntax. Zeigen Sie die Änderungen auf. 5 Min.

Internet Ressourcen / WebQuest[Bearbeiten]

Aufgabe: Daten bereitstellen[Bearbeiten]

Aufgabe/Tätigkeit Richtzeit
Erstellen Sie einen Datenbank Benutzer quotout mit Passwort qu0t_. Nur vom lokalen Host sollte der Zugriff erlaubt sein. Folgende Rechte werden benötigt: SELECT, INSERT, UPDATE, DELETE Aktualisieren Sie die Benutzerprofile bevor Sie fortfahren. 10 Min
Erstellen Sie die Einstiegsseite (index.php). Setzen Sie dabei das Basic HTML5 Template ein. Erstellen Sie die zugehörige CSS und JavaScript Dateien: css/styles.css und js/scripts.js 5 Min
Erweitern Sie die Einstiegsseite (index.php) mit einem PHP Script, welches ein zufälliger Datensatz aus der Tabelle citation ausliest und ausgibt. 20 Min
Erstellen Sie ein Struktogramm oder Flussdiagramm des PHP Script in der Einstiegsseite. Verwenden Sie Pseudocode zu Beschreibung. 10 Min

Hinweise zur Umsetzung[Bearbeiten]

  • Im body der Einstiegsseite fügen wir durch <?php und ?> ein PHP Quellcode ein. Lesen Sie dazu die PHP Grundlagen nach.
  • Wir erstellen eine Verbindung zur Datenbank (mysqli_connect)
  • Wir prüfen ob die Verbindung erfolgreich war, ansonsten melden wir einen Fehler an den Betrachter.
  • Wir führen eine SQL Abfrage mit SELECT durch (mysqli_query). Falls keine Ergebnisse geliefert werden, melden wir einen Fehler dem Betrachter.
  • Geben Sie das Zitat und dessen Autor aus (fetch_object / fetch_array).
  • Wir trennen die Verbindung zur Datenbank (mysqli_close).

Internet Ressourcen / WebQuest[Bearbeiten]

Frontend bereitstellen (JSON > JS + HTML)[Bearbeiten]

Das zufällige Zitat soll in einem Intervall die Seite automatisch neu laden um eine neues Zitat anzuzeigen. Dabei setzen wir Javascript und das Datenaustauschformat JSON ein.

Aufgabe: Daten API bereitstellen[Bearbeiten]

Aufgabe / Tätigkeit Richtzeit
Erstellen Sie eine Kopie der Einstiegsseite (cp index.php data.php). Entfernen Sie den gesamten HTML Quellcode. Das neue Script wird zur Ausgabe das Format application/json einsetzen. header('Content-Type: application/json; charset=utf-8'); 25 Min
Ändern Sie das data.php Script, sodass bei einem Fehler den Wert -1 zurückgegeben wird. Die Anwendung sollte entweder -1 zurückgeben oder ein Zufallszitat zurückliefern 5 Min
Ändern Sie das data.php Script, sodass der zufälliger Datensatz im JSON Format ausgegeben wird (print json_encode($object);). Beim öffnen des Scripts über den Browser sollte die Ausgabe ähnlich aussehen: {"ID":"20","quote":"Informationen werden nicht wertvoller, wenn man sie einsperrt. Sie werden wertvoller, wenn man sie teilt.","author":"Michael Seemann"} 15 Min

Internet Ressourcen / WebQuest[Bearbeiten]

Aufgabe: Daten API einbinden[Bearbeiten]

Aufgabe/Tätigkeit Richtzeit
Öffnen Sie die Datei js/scripts.js 2 Min
Wir möchte durch Einsatz der jQuery Bibliothek die JSON Daten abfragen (jQuery.getJSON()) und in einem Intervall von 5 Sekunden aktualisieren (setInterval()). Suchen Sie nach entsprechenden Ressourcen um diese Herausforderung zu erfüllen. 40 Min
Vergessen Sie nicht die jQuery Bibliothek in der Einstiegsseite einzubinden. Bedenken Sie Netzausfälle (CDN). http://jquery.com/download/ 3 Min

Internet Ressourcen / WebQuest[Bearbeiten]

Manuelles Testen[Bearbeiten]

Wir haben die Anforderungen schrittweise umgesetzt. Nun sollten wir die Umsetzung überprüfen.

Aufgabe: Testfälle / User Stories festlegen[Bearbeiten]

Aufgabe / Tätigkeit Richtzeit
Erstellen Sie 4 sinnvolle und konkrete User Stories für Ihre Anwendung. Beachten Sie folgende Anforderungen: UTF-8 Zeichenkodierung (ä, ö, ü) / Eindeutige Zitate eines Autors 25 Min
Erstellen Sie ein Akzeptanz Fragenkatalog. Identifizieren Sie die Schlüsselwörter in den User Stories. Setzen Sie die Schlüsselwörter in den W-Fragenmuster ein. Beantworten Sie die entstandene Fragen im Team. Fassen Sie Ihre Entscheidungen als konkrete Akzeptanzkriterien zusammen. 90 Min
Erstellen Sie 3 Testfälle die dem angegebenen Muster entsprechen. 20 Min

Muster zur Spezifikation von Testfälle[Bearbeiten]

  • Vorbedingung
  • Auszuführende Testschritt
  • Erwartetes Ergebnis
  • Nachbedingung
  • Verwendete Testdaten

Aufgabe: Testen und Protokollieren[Bearbeiten]

Aufgabe/Tätigkeit Richtzeit
Erstellen Sie ein Testprotokoll unter Verwendung der Testfälle 45 Min

Beantworten Sie folgende Fragen:

  • Welche Testfälle wurden erfolgreich bestanden?
  • Welche Fehler hat die realisierte Anwendung?
  • Berechnen Sie die Anzahl erfolgreicher Tests in % aus.
  • Was fällt Ihnen sonst noch auf?
  • Ist es Sinnvoll das Sie als Entwickler die Anwendung prüfen?

Internet Ressourcen / WebQuest[Bearbeiten]


Anwendung optimieren[Bearbeiten]

In Abhängigkeit der Umsetzung sind womöglich beim Testen Fehler aufgetaucht. Wir beheben die Bekannteste :)

Auftrag: Mögliche Fehlerquellen überprüfen[Bearbeiten]

Korrigieren Sie mögliche Fehlerquellen und führen Sie das Testprotokoll nach.

Aufgabe/Tätigkeit Richtzeit
SQL Abfrage sollte die UTF-8 Zeichenkodierungen berücksichtigen (mysqli_set_charset). 5 Min
Bei öffnen der Einstiegsseite sollte sofort ein Zitat ersichtlich sein. Verwenden Sie eine eigene Funktion um die Daten via JSON zu laden. 10 Min

Aufgabe: Abfragen optimieren[Bearbeiten]

Aufgabe/Tätigkeit Richtzeit
Optimieren Sie die getätigten Abfragen. Erstellen Sie einen Index für die verwendeten Spalten in der SQL Abfrage. Notieren Sie sich die entsprechende SQL Syntax. Wie können Sie die Optimierung belegen bzw. bestätigen? 15 Min

Aufgabe: Web Design optimieren[Bearbeiten]

Öffnen Sie die Datei css/styles.css. Legen Sie für die Anwendung folgende Eigenschaften fest.

  • Farben für Text und Hintergrund. Achten Sie auf den Kontrast
  • Schriftart mit Serifen
  • Schriftgrösse des Autors ist 15% kleiner als die Schriftgrösse des Zitats

Internet Ressourcen / WebQuest[Bearbeiten]

Änderungen akzeptieren und nachvollziehen[Bearbeiten]

Softwareanforderungen sind ein Kommunikationsproblem. Diejenigen, die die neue Software wollen (entweder um sie einzusetzen oder zu verkaufen), müssen mit denen, die sie programmieren werden, kommunizieren.Wenn User erste Versionen der Software sehen, kommen ihnen neue Ideen und ihre Meinungen ändern sich.

Aufgabe: git Versionsverwaltung einführen[Bearbeiten]

Aufgabe/Tätigkeit Richtzeit
Sichern Sie Ihre bestehende Lösung in einem lokalen git Repository 15 Min

Internet Ressourcen / WebQuest[Bearbeiten]

Aufgabe: Tabelle normalisieren[Bearbeiten]

Aufgabe/Tätigkeit Richtzeit
Benutzer vertauschen die Informationen Vor- und Nachname … Aus diesem Grund (User Driven) soll das Feld aufgeteilt werden. Welche Konsequenz bewirkt diesen Änderungsantrag auf die umgesetzte Lösung? Welche Vorgehensweise bzw. Schritte planen Sie zur Umsetzung? 15 Min
Führen Sie die benötigten Änderungen am Quellcode durch um die neue Anforderung bezüglich Autorenfelder zu erfüllen. Dokumentieren Sie Ihre Vorgehensweise. 30 Min

Aufgabe: Statistik einführen[Bearbeiten]

Aufgabe/Tätigkeit Richtzeit
Der Produktbesitzer wünscht sich eine Statistik über die Anzahl der Ansichten (Hits) eines Zitats. Welche Änderung bewirkt diesen Antrag auf Ihre Lösung? 10 Min
Führen Sie die benötigten Änderungen um Statistiken zu führen am Quellcode durch. Dokumentieren Sie Ihre Vorgehensweise. 20 Min

Rückblick[Bearbeiten]

Folgend einige Begriffe aus dem Projekt zitat.json:

Auswahl 1 Auswahl 2 Auswahl 3 Auswahl 4
Quellcode Variable {} Struktogramm
Web Server while Anweisung Prozess
Datentyp Fremdschlüssel INDEX JSON
$ ASCII UTF-8 padding
UNIQUE varchar(255) SCRUM PHP
INSERT Datenbank <a> Internet
HTML Programm Syntax setInterval
alert class print ERD
Respekt Qualität Einfachheit Feedback
Variation Tue Abhängigkeiten Versprechen
GTD VQ EU KM

Aufgabe: Strukturlegetechnik[Bearbeiten]

Aufgabe
Markieren Sie die Begriffe in der Tabelle die Sie einer anderen Person erklären können mit einem Grünen Hintergrund. Markieren Sie die Begriffe die Sie nicht kennen oder verstanden haben mit einem Gelben Hintergrund.
Ergänzen Sie die Liste mit weitere 4 Begriffen die Sie kennen in diesem Kontext.
Erarbeiten Sie nun die Erklärung der Begriffe welche Sie nicht kennen. Sie können in den Unterlagen (Lehrmittel, Notizen, Internet, etc.) nachschlagen.

Aufgabe: Concept Map[Bearbeiten]

Aufgabe
Wählen Sie eine Begriffsspalte (Nummer 1, 2, 3 oder 4) mit Begriffe die Ihnen wichtig erscheinen.
Erarbeiten Sie ein Concept Map zur Veranschaulichung der Begriffe und der Beziehungen dieser Begriffe.