Software- und Web-Engineering I

Das Semesterprojekt

Informatik – 3. Semester

Software- und Web-Engineering I · TH Lübeck
1 Rückblick
2 Der Semesterplan
3 Das Semesterprojekt
4 Ihre Projektidee
5 Ausblick & Teamwahl

Wo wir gestern stehen geblieben sind

Software- und Web-Engineering I · TH Lübeck
Was Sie gestern bei Leif gehört haben
  • Lernraum, Zeitplan und wer das Modul unterrichtet
  • Das Praktikum startet in KW 41, es gilt Anwesenheitspflicht
  • Die Modulnote: Klausur 2/3, Projektarbeit 1/3
    • Beide Teile müssen einzeln bestanden sein
  • Die Klausur ist ohne Hilfsmittel, eine Probeklausur gibt es nicht
Heute geht es um den zweiten Teil der Note: das Semesterprojekt.
Software- und Web-Engineering I · TH Lübeck
1 Rückblick
2 Der Semesterplan
3 Das Semesterprojekt
4 Ihre Projektidee
5 Ausblick & Teamwahl

Was wann dran ist, und warum in dieser Reihenfolge

Software- und Web-Engineering I · TH Lübeck
Das Semester auf einen Blick
41
42
43
44
45
46
47
48
49
50
51
52/53
1
2
3
P1 Idee
11.10.
P2 Anforderungen
15.11.
P3 Entwurf
29.11.
Projektwechsel
Tausch
P4 Umsetzung
20.12.
17.01.
Abschluss
✓
Projekt­woche
Weih­nachten
Pitches, Gespräche
  • Die Hälfte des Semesters ist Planung, erst ab KW 49 wird gebaut
  • P2 und P3 überlappen: Was Ihnen beim Entwurf auffällt, darf noch in die Anforderungen
Software- und Web-Engineering I · TH Lübeck
Welche Vorlesung wofür
Phase Dienstag · Software-Technik Mittwoch · Web-Engineering
P1 Idee Was ist ein Produkt?, Versionskontrolle WWW und HTML
P2 Anforderungen Projekt und Anforderungen, Teil 1 und 2 CSS, JavaScript
P3 Entwurf Benutzerschnittstellen, Domänendesign, Architektur Web-Components, TypeScript, DI
P4 Umsetzung Designpatterns, Implementierung, Testen REST, Spring Boot 1 und 2
  • Der Dienstag liefert die Methode für die laufende Phase
  • Der Mittwoch baut die Technik auf, die Sie in P4 brauchen
Software- und Web-Engineering I · TH Lübeck
1 Rückblick
2 Der Semesterplan
3 Das Semesterprojekt
4 Ihre Projektidee
5 Ausblick & Teamwahl

Sechs Personen, vier Phasen, ein Wechsel

Software- und Web-Engineering I · TH Lübeck
Was Sie bauen
  • Eine Webanwendung mit einer Server-Komponente
    • Das sogenannte Back-End, mit Spring Boot
  • … und einer Oberfläche, die im Browser läuft
    • Das sogenannte Front-End, mit HTML, CSS und JavaScript oder TypeScript
  • Front-End und Back-End kommunizieren miteinander
Keine weiteren Frameworks, also kein React, Vue, Angular, Bootstrap oder Tailwind.
Software- und Web-Engineering I · TH Lübeck
Gruppenarbeit
  • Sie arbeiten in Teams mit sechs Personen
  • Die Erfahrung im Team ist unterschiedlich, das ist normal
    • Passen Sie Ihre Ansprüche entsprechend an
  • Sie werden nicht immer einer Meinung sein
    • Argumentieren Sie fürs Projekt, nicht für Ihre Lieblingslösung
  • Wenns im Team hakt: früh ansprechen, ggf. auch bei Ihrer Betreuer:in
Sechs Personen an einem Tisch
Software- und Web-Engineering I · TH Lübeck
Phase 1 · Projektidee

Warum?

  • Sechs Personen müssen dasselbe meinen, bevor jemand anfängt zu planen
  • Eine Idee ohne Grenze wächst im Semester unkontrolliert, deshalb gehört eine Abgrenzung dazu
Artefakt: docs/IDEA.md
  • Arbeitstitel und Zielgruppe
  • Die 3–5 wichtigsten Funktionen
  • Mindestens ein Gegenbeispiel: was die Software bewusst nicht kann
Unbewertet, aber Pflicht. Abgabe So 11.10.
Software- und Web-Engineering I · TH Lübeck
Phase 2 · Anforderungen

Warum?

  • Ein fremdes Team wird Ihr Produkt bauen
  • Es kann nur umsetzen und prüfen, was aufgeschrieben ist
  • Die Anforderungen sind damit der Vertrag zwischen den Teams
Artefakt
  • Anforderungskatalog mit IDs, Priorität und Akzeptanzkriterien
  • Anwendungsszenarien
  • Produkteinordnung, auch im Vergleich zu bestehenden Produkten
Abgabe So 15.11.
Software- und Web-Engineering I · TH Lübeck
Phase 3 · Entwurf

Warum?

  • Aus dem Was wird das Wie
  • Das Partnerteam soll bauen können, ohne zu raten
  • Das Team teilt sich auf: drei Personen für Architektur und Domäne, drei für die Oberfläche
Artefakt: ein Entwurfsdokument
  • Diagramme zu Umgebung, Klassen und Abläufen
  • Technologie-Festlegung
  • Komponentenliste und Wireframes für jede Seite
Abgabe So 29.11.
Software- und Web-Engineering I · TH Lübeck
Der Projektwechsel
  • Bis P3 entwerfen Sie Ihr eigenes Projekt
  • In KW 49 tauschen Team a und Team b ihre Unterlagen
  • In P4 bauen Sie das Projekt des Partnerteams
  • Schreiben Sie Ihre Unterlagen also so, dass ein fremdes Team ohne Rückfrage damit arbeiten kann
Team a und Team b tauschen nach P3 ihre Entwürfe
Software- und Web-Engineering I · TH Lübeck
Phase 4 · Umsetzung

Warum?

  • Jetzt zeigt sich, ob ein Entwurf trägt
  • Sie bauen den Entwurf des Partnerteams und dürfen ihn anpassen, wenn er Lücken hat
  • Jede Abweichung wird dokumentiert
Artefakte
  • Zwischenstand: MVP-Auswahl, Übergabe-Log, ein lauffähiger Stand
  • Endabgabe: alle Muss-Anforderungen nutzbar, README, Übergabe-Log
Zwischenstand So 20.12., Endabgabe So 17.01.
Software- und Web-Engineering I · TH Lübeck
Team-Repository und Abgabe
  • Jedes Team bekommt ein GitLab-Repository auf git.mylab.th-luebeck.de
    • Wir legen es nach der Teamwahl aus einer Vorlage an
  • Alles gehört ins Repo, Dokumente wie Code
  • Abgeben heißt: Tag setzen und pushen
git tag p1-abgabe
git push origin p1-abgabe
Keine Nachfrist. Es zählt der Zeitstempel des Tags. Ein Tag nach Sonntag 23:59 Uhr ist zu spät.
Melden Sie sich bis Sonntag einmal auf git.mylab.th-luebeck.de an, sonst können wir Sie nicht ins Repository aufnehmen.
Software- und Web-Engineering I · TH Lübeck
Bewertung
  • Bewertet werden P2, P3, der Zwischenstand und die Endabgabe, je 100 Punkte
  • Bestanden ab 50 %
  • Standard ist die Gruppennote
  • Einzelbewertung kann jede:r bis zur Abgabe verlangen
Die Kriterien stehen vorab in der Aufgabe, nicht erst in der Rückmeldung. Also: einmal lesen, bevor Sie loslegen.
Punkte, Notenschlüssel und Klausur: Lernraum → Prüfungsinformationen
Software- und Web-Engineering I · TH Lübeck
1 Rückblick
2 Der Semesterplan
3 Das Semesterprojekt
4 Ihre Projektidee
5 Ausblick & Teamwahl

Klein anfangen, mit Luft nach oben

Software- und Web-Engineering I · TH Lübeck
Projektumfang
  • Für die Umsetzung bleiben ca. fünf Wochen (KW 49 bis KW 2)
  • Je besser Sie planen, desto mehr schaffen Sie
  • Vermutlich werden Sie nicht ganz fertig, und das ist in Ordnung
  • Planen Sie um das herum, was Ihre Anwendung besonders macht
  • Alles, was den Rahmen sprengt, gerne als Platzhalter oder mit Mock-Daten
Drei Ringe: Kern, solide Basis, Luft nach oben
Software- und Web-Engineering I · TH Lübeck
Das Kano-Modell
  • Basismerkmale werden erwartet und fallen erst auf, wenn sie fehlen
  • Leistungsmerkmale machen umso zufriedener, je besser sie umgesetzt sind
  • Begeisterungsmerkmale erwartet niemand, genau die machen Ihre Idee aus
  • Studi-Projekte leben oft von Begeisterungsmerkmalen, das passt
Kano-Modell: Basis-, Leistungs- und Begeisterungsmerkmale
Software- und Web-Engineering I · TH Lübeck
Passt die Idee?
  • Mehrere Personen arbeiten mit denselben Daten
    • Sonst braucht es keinen Server
  • Sie können in einem Satz sagen, was Ihre Anwendung besonders macht
  • Die Idee lässt sich im Technik-Rahmen umsetzen
    • Also keine native App, kein 3D-Spiel, keine Hardware
  • Der Kern ist klein, alles andere ist Luft nach oben
Bringen Sie ins erste Praktikum mindestens zwei Ideen mit. Ihre Betreuer:in hilft bei der Auswahl.
Software- und Web-Engineering I · TH Lübeck
1 Rückblick
2 Der Semesterplan
3 Das Semesterprojekt
4 Ihre Projektidee
5 Ausblick & Teamwahl

Was bis nächste Woche ansteht

Software- und Web-Engineering I · TH Lübeck
Bis nächste Woche
  1. Team wählen, bis So 04.10., 23:59 Uhr
  2. Einmal auf git.mylab.th-luebeck.de anmelden
  3. Den Leitfaden im Lernraum lesen
  4. Mindestens zwei Projektideen ins erste Praktikum mitbringen
  5. P1 abgeben, bis So 11.10., 23:59 Uhr
Software- und Web-Engineering I · TH Lübeck
Blick auf die nächsten Vorlesungen
Nächste Woche: WWW und HTML
  • Wie das Web funktioniert: Client, Server, HTTP
  • Die Struktur einer Seite mit HTML
Danach: CSS und JavaScript
  • Gestaltung und Layout
  • Interaktion im Browser
Software- und Web-Engineering I · TH Lübeck
Erwartungen an die Vorlesung
  • Welche Themen wünschen Sie sich in der Vorlesung, und wie möchten Sie mit ihr interagieren?
  • Tragen Sie es im Lernraum ein: Kursinformationen → Erwartungen und Wünsche
10 Min
QR-Code zum Board Erwartungen und Wünsche im Lernraum
Software- und Web-Engineering I · TH Lübeck
Teamwahl
  • Lernraum → Teambereich → Praktikumsgruppen
  • Sechs Personen pro Team, die Nummer ist zugleich Ihr Praktikumstermin
  • Pro Termin gibt es zwei Teams, a und b
  • Offen bis So 04.10., 23:59 Uhr
Sie haben schon ein Team? Dann sind Sie für heute fertig. Wer noch keins hat oder einen Sonderfall klären muss, bleibt kurz hier.
Sechs Personen an einem Tisch
Software- und Web-Engineering I · TH Lübeck

- Kurz vorstellen: Kjell Treder, Web-Engineering mittwochs, Praktikumsbetreuung - Heute nur Orga und Projekt, Fachinhalt (WWW und HTML) startet naechste Woche - Fragen gerne direkt zwischendurch

- Fuenf Stationen, alles rund ums Projekt - Teamwahl kommt bewusst ganz am Ende: Wer schon ein Team hat, kann dann gehen

- Nur auffrischen, nicht nochmal erklaeren - Leif hat gestern "mehr Infos morgen in der Vorlesung" zur Teamwahl angekuendigt -> kommt am Ende - Wer gestern nicht da war: Leifs Folien "Orga I" liegen im Lernraum - Fragen zur Notenberechnung -> Seite Pruefungsinformationen im Lernraum

- Den KW-genauen Plan gibt es im Lernraum (Semesterkalender), hier geht es ums Muster

- Alle Abgaben sonntags 23:59 Uhr, die Daten auf den Balken sind die Abgabetage - KW 46 Projektwoche: keine Vorlesung, kein Praktikum, aber P2 ist am Ende der Woche faellig - KW 52/53 Weihnachtspause, die Endabgabe liegt danach (17.01.) - KW 3: Mi 20.01. Projekt-Pitches in der Vorlesung, im Praktikum die Abschlussgespraeche - Klausur im Pruefungszeitraum KW 4/5 (23.01. bis 02.02.), Termin vom Pruefungsamt

- Warum HTML, CSS und JS so frueh, obwohl erst ab KW 49 gebaut wird: Damit Sie beim Entwurf wissen, was im Browser machbar ist und was nicht - REST und Spring Boot kommen genau zum Start von P4, also dann, wenn Sie es brauchen - Wer eine Vorlesung auslaesst, merkt das spaetestens im Praktikum

- Jetzt das Projekt selbst: was gebaut wird, wie das Team arbeitet, was in jeder Phase entsteht

- Optional eine Datenbank, z. B. H2 - Warum keine Frameworks: Sie sollen verstehen, was ein Framework Ihnen abnimmt. Dafuer muss man es einmal selbst gebaut haben - Die Idee waehlen Sie selbst, dazu gleich mehr

- Jede Person committet ihre eigene Arbeit selbst. Das ist die Grundlage, falls jemand eine Einzelbewertung verlangt - Bewaehrt hat sich: ein Kommunikationskanal, ein fester Termin pro Woche ausserhalb des Praktikums - Probleme lieber in Woche 3 ansprechen als in Woche 12

- Ohne abgegebene und im Praktikum vorgestellte Idee geht es mit P2 nicht weiter - Vorher mindestens zwei Ideen entwickeln und im ersten Praktikum vorstellen, die Betreuer:in hilft bei der Wahl - Die Vorlage fuer IDEA.md liegt schon im Team-Repository - Die genaue Aufgabe je Phase steht im Team-Repository, die Folien sind nur der Ueberblick

- Methodik dazu bei Leif in KW 43 und 44 - Der Katalog darf und soll groesser sein als ein Semester, das Partnerteam waehlt spaeter aus - Die IDs tragen durchs ganze Projekt: Entwurf, MVP-Auswahl, Uebergabe-Log, Bewertung - Login und Benutzerverwaltung sind fast nie der Kern, kosten aber viel Zeit

- Beide Haelften muessen sich abstimmen: Die Oberflaeche zeigt, was das Domaenenmodell hergibt - Wireframes auf Papier, in Figma o. ae., bewusst kein HTML. Gebaut wird in P4, und zwar vom Partnerteam - Das Dokument muss ohne muendliche Erklaerung verstaendlich sein - Methodik bei Leif ab KW 45 (Benutzerschnittstellen, Domaenendesign, Architektur)

- Das ist neu in diesem Semester, hier Zeit nehmen - So laeuft es auch in der Praxis: Meistens setzt man die Spezifikation von jemand anderem um - Uebergabe im Praktikum KW 49, bei drei Teams an einem Termin rotieren die Projekte im Kreis - Wie gut Ihr Entwurf war, merken Sie an der Rueckmeldung des Partnerteams

- MVP-Auswahl: mindestens alle Muss-Anforderungen, die Betreuer:in nimmt sie ab, danach ist sie eingefroren - Uebergabe-Log: eine Zeile pro Abweichung (was war das Problem, wie geloest). Sachlich, keine Beschwerdeliste - "Nutzbar" heisst End-to-End: Eingabe, Verarbeitung, Speicherung, Ausgabe - Mitbewertet wird die Code-Qualitaet, Unit-Tests fuer die Business-Logik geben Punkte

- Die fuenf Tags: p1-abgabe, p2-abgabe, p3-abgabe, p4-zwischenstand, p4-endabgabe - Nach dem Push einmal im GitLab unter Tags nachschauen, ob er angekommen ist - Versionskontrolle kommt bei Leif in KW 42, fuer P1 reichen clone, commit, push, tag - Nach dem Wechsel geht das Repo ans Partnerteam, also verstaendlich ablegen

- Zu jeder Abgabe stellt das Team seinen Stand im Praktikum vor, alle muessen ihn erklaeren koennen. Die Praesentation zaehlt mit - Einzelbewertung: bei der Betreuer:in melden, Grundlage sind Commits, Merge Requests und ein Einzelgespraech. Ein Schutz, nicht der Normalfall - Gewichtung 2/3 zu 1/3 hat Leif gestern gezeigt

- Die Idee ist das Erste, was Sie als Team entscheiden, ein paar Hinweise dazu

- Umgesetzt wird der Entwurf eines anderen Teams, also muss er realistisch sein - Bewertet wird, was vom MVP End-to-End funktioniert, nicht wie viel angefangen wurde - Login und Benutzerverwaltung sind so gut wie nie der Kern

- Nur kurz einordnen, das Modell kommt in P2 wieder (Produkteinordnung) - Beispiel: Beim Online-Banking ist Sicherheit Basis, Geschwindigkeit Leistung, eine gute Ausgabenuebersicht Begeisterung - Merkmale so waehlen, dass sie zu Ihrem Team passen

- Passt: Turnierverwaltung fuers Kicker-Turnier, Mitfahr-Pinnwand zum Campus, Pflegekalender fuer Zimmerpflanzen - Zu gross: soziales Netzwerk, Online-Shop mit Bezahlung - Kein Server noetig, z. B. ein Taschenrechner -> faellt raus - Bei P1 pruefen wir die Ideen, auch gegen Projekte aus frueheren Semestern

- Zum Schluss: To-dos, naechste Vorlesungen, Erwartungen, dann Teamwahl

- Das Praktikum startet naechste Woche (KW 41), Termin 1 schon am Mo 05.10. - Die Repos legen wir nach Ende der Teamwahl an, deshalb die Anmeldung bis Sonntag - Leitfaden: Lernraum -> Semesterprojekt

- 07.10. WWW und HTML, 14.10. CSS, 21.10. und 28.10. JavaScript Teil 1 und 2 - Die Folien erscheinen jeweils im Lernraum unter Vorlesung Web-Engineering - Fragen gerne jederzeit im Praktikum oder per Mail an die Betreuer:in

- QR-Code fuehrt direkt zum Board (mod/board, cm 369589), das Board muss sichtbar sein - Waehrend die Zeit laeuft: ein paar Eintraege vorlesen und kurz kommentieren - Themenwuensche koennen in "Aktuelle Themen" (13.01.) einfliessen

- Die Wahl ist seit gestern 13:30 offen - Kein passender Termin frei: untereinander tauschen oder vorne melden - Termin 5 (Mi 16:15) hat einen Ausweichtermin Do 10:00, steht in der Teamwahl - Fehlen Teams oder Termine: melden, dann richten wir weitere ein