4. Aufgabe ( Templates ) Tool für Webentwicklung

Zum Lernen und Experimentieren gibt es unterschiedliche Hilfsmittel. Es ist ein einfaches Toolchen zu schreiben, das zum "lernenden Experimentieren" mit Webdesign, Webprogrammierung, HTML-Quellcode, CSS-Quellcode, ECMAScript-Quellcode geeignet ist. Es sollen ( kleine, wiederverwendbare ) Quellcode-Fragmente erstellt und getestet werden. Beispiele: Es sollen Templates und Snippets für Webdesign, Webprogrammierung, HTML-Quellcode, CSS-Quellcode, ECMAScript-Quellcode, Web-Seiten-Erstellung, CSS-Snippets, ECMAScript-Snippets entwickelt und im Toolchen bereit gestellt werden. Nützliche, wiederverwendbare Code-Muster können das praktische Lernen unterstützen. Als Zielgruppe gelten Schüler (einfache Hinführung) und Informatik-Studienanfänger.

1. Wie sieht ein (ungeprüftes) Muster für ein solches Toolchen aus? Siehe Zeichen-Transformationen
2. JS-Experiment sollen die eingebauten ECMAScript-Funktionen "erhellen".
3. HTML-Snippets, CSS-Snippets, ECMAScript-Snippets für Web-Seiten-Erstellung
4. Kurz-Dokumentation ist zu erstellen

Zu 1: Wie ist ein einfacher Start? Was ist konkret zu tun?

Das Zeichen-Transformationen Toolchen kann als Startpunkt für das Toolchen verwendet werden. Es sollen (zahlreiche) Ergänzungen, Funktionen, Templates, usw. eingefügt werden.

Zu 2: Experimente zu eingebaute Funktionen ECMAScript-Funktionen

Zahlreiche eingebaute ECMAScript-Funktionen werden erst nach dem konkreten Experimentieren verständlich. Das erste select-Tag soll helfen, eingebaute ECMAScript-Funktionen zu verstehen. Das erste select-Tag soll um mindestens 5 Funktionen erweitert werden.

Es gibt eingebaute String-Funktionen, die unter dem String-Prototyp hinterlegt sind, wie z.B.

.charAt(pos),             
.charCodeAt(pos),          .fromCharCode(zeichen...),
.indexOf(suchstring, pos), .lastIndexOf(suchstring,pos),
.match(re),                .search(re), 
.replace(suchwert, ersetzungswert),
.slice(anfang, ende),      .substr(), 
.split(separator, limit), 
.toLowerCase(),           .toUpperCase(),      .toFixed(), ...            

Es gibt eingebaute mathematische Funktionen, die unter dem Math-Objekt hinterlegt sind, wie z.B.

Math.min(), Math.max(), Math.floor(), Math.ceil(), Math.round()
Math.cos(),  Math.sin(),  Math.tan(), 
Math.acos(), Math.asin(), Math.atan(),
Math.sqrt(), Math.pow(), Math.exp(), Math.random()

Konstanten 
Math.LN2, Math.LN10, Math.LOG2E, Math.LOG10E,
Math.PI,  Math.SQRT1_2, Math.SQRT2     

Es gibt eingebaute Array-Funktionen, die zu dem Object-Prototyp gehören.

.push(), .shift(), .sort(), .split(), .join(), .slice(), .splice()

Zu 3: Templates für Webentwicklungen Welche? Wie?

Wie geht das mit den Templates? Wie werden HTML-Snippets, CSS-Snippets, ECMAScript-Snippets für Web-Seiten-Erstellung eingebaut? Erklärung in der Veranstaltung.

Zu 4: Kurz-Dokumentation Pflicht

Die Dokumentation des Toolchen hilft den Einsteigern. Eine didaktische Aufbereitung kann das interaktive Lernen unterstützen.

Viel Freude bei der Ausarbeitung!
Letzter Abgabetermine So 12.00 Uhr