Project

General

Profile

QFQ Introduction » History » Version 6

Carsten Rose, 08.07.2021 13:42

1 1 Carsten Rose
p<. *Einfuehrung in QFQ*
2
3
p<. Für Praktikanten und Lehrlinge
4
5 3 Carsten Rose
{{toc}}
6
7 2 Carsten Rose
h1(wiki-class-western). Vorkenntnisse SQL
8 1 Carsten Rose
9
Kurze Einfuehrung in phpmyadmin als GUI auf die mysql DB, Sublime Text mit SQL Syntax highlighting. Danach sollen an einer Test DB selbststaendig Aufgaben geloest werden, welche die folgenden Keywords abdecken:
10
11 2 Carsten Rose
* SELECT … FROM … WHERE … GROUP BY … ORDER BY
12
** CONCAT
13
** IF
14
15 4 Carsten Rose
* JOIN (oder: mehrere Tabellen FROM)
16 1 Carsten Rose
** LEFT JOIN
17 4 Carsten Rose
18 2 Carsten Rose
* GROUP_CONCAT
19
* INSERT
20
* UPDATE
21
* DELETE
22 1 Carsten Rose
23
Im Anschluss noch spezifisch zu unserer Arbeit im Zusammenhang mit SQL:
24
25 2 Carsten Rose
* Foreign Keys und dass wir diese fast nie einsetzen
26 1 Carsten Rose
* Ggroup & Group Member als ‘Tag-System’
27 2 Carsten Rose
** kleine Uebung – Anlegen einer neuen Ggroup und SELECT Statement
28 1 Carsten Rose
29 6 Carsten Rose
Hinweis auf ??Applications > Programming > DataGrip?? (Zuvor mit UZH Mailadresse eine Jetbrains EDU Account erstellen).
30 5 Carsten Rose
31 2 Carsten Rose
h1(wiki-class-western). Vorkenntnisse Web-Entwicklung
32 1 Carsten Rose
33 2 Carsten Rose
h2(wiki-class-western). CMS / Typo3
34 1 Carsten Rose
35
Eine Einfuehrung in Typo3 sollte abdecken:
36
37 2 Carsten Rose
* Was ist ein CMS?
38
* Pages, PageContent
39
* FeUser, BeUser
40
* Berechtigungen
41 1 Carsten Rose
42 2 Carsten Rose
h2(wiki-class-western). HTML Grundlagen
43 1 Carsten Rose
44
Anschliessend an die T3-Einfuehrung soll eine Aufgabe die HTML-Kenntnisse auffrischen. Der Fokus soll ganz klar auf Page Content und nicht auf Seitenlayout (kein float, grid, usw.) liegen.
45
46
So soll ein typischer Page Content statisch mit HTML erstellt werden. Zu denken waere eine Tabelle mit Spaltenueberschriften, sowie ‘new’ und ‘edit’ Buttons, da dieses ‘Layout’ bei uns oft vorkommt.
47
48 2 Carsten Rose
h2(wiki-class-western). CSS / Bootstrap
49 1 Carsten Rose
50
Falls keine CSS-Grundlagen vorhanden sind, dann macht eine kurze CSS-Einfuehrung Sinn, ansonsten kann dies weggelassen werden.
51
52
Der zuvor erstellte Page Content soll jetzt durch Bootstrap aufgehuebscht werden. Ziel waere, dass die Seite danach den typischen QFQ-Look hat – es ist aber immer noch alles statisch. Bootstrap Klassen sollen mindestens verwendet werden fuer:
53
54 2 Carsten Rose
* Tabelle
55
* Buttons
56 1 Carsten Rose
57
Im Anschluss kann die Bootstrap Doku noch im Selbststudium durchforstet werden. Ansprechende Komponenten oder Styles sollen ausprobiert werden!
58
59
Insbesondere ein Bootstrap-Formular soll erstellt werden, welches die Datenerfassung und Manipulation fuer die bestehende Tabelle ermoeglichen soll. (Nur ‘im Prinzip’, Formular submit muss nichts machen).
60
61 2 Carsten Rose
h2(wiki-class-western). JavaScript / jQuery
62 1 Carsten Rose
63
Javascript und jQuery können kurz angeschnitten werden im Zusammenhang mit dem zuvor erstellten Formular. In einem einfachen Beispiel soll ein Formularelement abhängig vom value einer Checkbox ein- oder ausgeblendet werden. Dies sollte auch zum späteren Verständnis von Dynamic Update beitragen.
64
65 2 Carsten Rose
h1(wiki-class-western). QFQ
66 1 Carsten Rose
67
QFQ wird alles zuvor Gelernte zusammenbringen. Kurze Einfuehrung: Was ist QFQ, was kann QFQ?
68
69 2 Carsten Rose
h2(wiki-class-western). Einfuehrung Report
70 1 Carsten Rose
71
Einfuehrung in die Report-Syntax, Tabelle aus vorheriger Uebung mit QFQ nachbauen.
72
73 2 Carsten Rose
* Sql, head, tail, shead, stail, rend, renr, fbeg, fend
74
* AS _pagen, pagee, paged, link
75 1 Carsten Rose
76 2 Carsten Rose
h2(wiki-class-western). Einfuehrung Forms
77 1 Carsten Rose
78
Einfuehrung in das Form-Formular zum Erstellen von Forms. Das Formular aus der vorherigen Uebung soll jetzt mit QFQ nachgebaut werden. Das Resultat sollte sein, dass neue Eintraege in der Tabelle erscheinen, wenn diese ueber das Form erfasst wurden.
79
80 2 Carsten Rose
h2(wiki-class-western). Kleinprojekt
81 1 Carsten Rose
82
Der/die Lernende soll moeglichst selbststaendig ein QFQ Projekt bewaeltigen. Gegeben sind nur die Anforderungen. Denkbar waere auch Durchfuehrung nach IPERKA.
83
84 2 Carsten Rose
h3(wiki-class-western). Anforderungen
85 1 Carsten Rose
86
Es kann ein generischen Beispiel, z.B. Studenten mit Vorlesungen, gewählt werden. Damit sollte eine Aufgabenstellung formuliert werden, die nach folgenden Features verlangt:
87
88 2 Carsten Rose
* Erfassen / bearbeiten / loeschen von Datensaetzen
89
* Subrecord oder Template Group
90
* File Upload (pdf)
91
* Emailversand
92
* Download (pdf)
93 1 Carsten Rose
94 2 Carsten Rose
h3(wiki-class-western). Konzept
95 1 Carsten Rose
96 2 Carsten Rose
* Erstellen eines Mockups, z.b. mit draw.io, balsamiq, von Hand…
97
* Erstellen eines Datenbankschemas
98 1 Carsten Rose
99 2 Carsten Rose
h3(wiki-class-western). Implementierung
100 1 Carsten Rose
101
Der/die Lerndende soll das selbst erstellte Konzept nach Rücksprache mit der Betreuungsperson so eigenständig wie möglich implementieren. Fuer spezifische Probleme (z.B. File Upload, Subrecord, Email versenden…) werden Links auf die spezifischen Stellen in der QFQ Dokumentation gegeben.
102
103 2 Carsten Rose
h3(wiki-class-western). Testen
104 1 Carsten Rose
105
Testfaelle werden aus den Anforderungen abgeleitet. Ein Testprotokoll soll erstellt werden und anschliessend sollen die Tests durchgeführt werden.