Erstelle Homepage mit Toolchen HTML5, Rahmen, DOM-Zugriffe

Diese Aufgabe zur Veranstaltung ( ECMAScript-Applikationen 2014) beinhaltet:

Projekt ( "String-Manipulationen" ) zusammenfassende Übersicht

• Das clientseitige Entpacken des Homepage-Rahmen, der der Einrichtung einer eigenen HTML5-Homepage dienen kann.
• Mit einem upload des Homepage-Rahmens entsteht ein eigenes Homepage-Grundgerüst, das alle weiteren Lösungen aufnimmt und präsentieren wird.
• Die Willkommenseite und das CSS-Design sind an eigene Ästetik und Bedürfnisse anzupassen ( siehe kern/willkommen.htm ).
• Für Name/Author/Entwickler soll Micro-Code eine bessere SEO-Unterstützung bieten.
• Für Name bzw. Nickname soll impressum.htm#Wer hat die Rechte an dieser Page? die Autor und E-Mail-Adresse Spam-Robots auf Abstand halten.
• Die "Liste meiner Aktivitäten" soll chronologisch aktualisiert werden ( siehe unter loesungen/aktivitaeten.htm ).
• Es ist ein Toolchen als HTML 5 - Seite zu schreiben, das ( später ) wesentliche Entwickler-Aufgaben vereinfachen kann und soll!
  • Das Toolchen wird dem vielfältigen Experimentieren mit Strimgs und deren Manipulationen dienen
  • Das Toolchen wird der Template-Sammlung für HTML-, CSS-, ECMAScript-Schnipsel dienen
  • Das Toolchen wird den vielfältigen Transformationen von Texten und Code dienen
  • Das Toolchen wird als "sehr schnelle Web-Etwicklungs-Umgebung" dienen ( "Quick And Durty" )
  • Das Toolchen erhält den h1-Titel: "String-Manipulationen"
  • Das Toolchen wird zwei Textarea's mit id="TA0" und id="TA1" enthalten
  • Das Toolchen ist in der Datei loesungen/loesung-1.htm und wird online sein

Viel Freude bei der Ausarbeitung! Letzter
Abgabetermine: erster Mo 12.00 Uhr nach Ostern

Nun etwas ausführlicher ...

Homepage-Rahmen entpacken Rahmen als Vorlage

Die Lösungen aller Praktikumsaufgaben sollen Bestandteil einer eigenen Homepage werden. Es ist zweckmäßig, als Ausgangspunkt einen Homepage-Rahmen als erweiterbare Vorlage zu verwenden. Ein Grundrahmen für das Portal kann hier herunter geladen werden:
ESA-Rahmen.zip
Wie sieht der Roh-Rahmen etwa aus? Teste ESA-Rahmen

Upload des entpackten Rahmen Welcher Server?

Was ist zu tun? Wie erfolgt der Upload? Wohin erfolgt der Upload? Wie werden Suchmaschinen-Indizierungen ausgegrenzt?

Der herunter geladene rahmen.zip wird lokal entpackt. Die entpackten Dateien werden mit einem geeigneten FTP-Programm ( z.B. FileZilla ) auf dem MNI-Server proteus.mni.fh-giessen.de in das Verzeichnis public_html/   hoch geladen.

Für das Hochladen brauchen sie

 Rechnername : sftp://proteus.mni.fh-giessen.de  mit  Port 22
 Benutzername: MEINE_BENUTZER_KENNUNG

Die entpackte Dateien-Struktur von rahmen.zip sollen in das Serververzeichnis public_html/.

Hinweis: Zum proteus-HTTP-Root-Verzeichnis

http://proteus.mni.fh-giessen.de/~MEINE_BENUTZER_KENNUNG/

gehört das Server-Verzeichnis

public_html

Hinweis: Zu jedem proteus-HTTP-Verzeichniss, also auch zu public_html gehören i.a. die Appache-Rechte 0755 (oktal)
Hinweis: Zu WWW-Dateien, wie z.B. *.htm, *.html, *.gif, *.jpg, *.css, *.js gehören i.a. die Rechte 0644 (oktal)
Hinweis: Damit die Seiten von SEO-Robots nicht gelesen werden, ist robots.txt zu prüfen und in das Verzeichnis public_html/ zu stellen.

My-Cloud-Provider? proteus-Server ist Pflicht

Achtung! Nur in begründeten Ausnahmefällen (und erst nach Rücksprache!) kann ein anderer Server verwendet werden. Begründung erfolgt in der Veranstaltung.

Einige HTML-Seiten anpassen Was soll gemacht werden?

Seite kern/willkommen.htm:
Die Willkommenseite, die unter kern/willkommen.htm ist, soll nach individuellen Gesichtspunkten vervollständigt werden. Bitte Anonymität beachten.

Micro-Code in Seite impressum.htm
Für Name/Author/Entwickler soll Micro-Code eine bessere SEO-Unterstützung bieten ( siehe Datei copyright.htm ).

Seite copyright.htm
Falls z.B. eine E-Mail-Adresse angegeben wird, so soll ihre E-Mail-Adresse zwar für Menschen lesbar aber zur Vermeidung von "Spam-Mails" für Robots möglichst unidentifizierbar sein. Es reicht z.B.

E-Mail-Adresse:  myName@mni.myProvider.de   als

E-Mail-Adresse: myName@mni.myProvider.de darzustellen.

Bitte hier im HTML-Seiten-Qelltext diese Stelle anschauen.

Toolchen in loesungen/loesung-1.htm weiter entwickeln Was muß gemacht werden?

Was ist der Kern der Aufgabe? Es ist ein Toolchen als HTML 5 - Seite zu schreiben.

• Das Toolchen wird dem vielfältigen Experimentieren mit Strimgs und deren Manipulationen dienen
• Das Toolchen wird der Template-Sammlung für HTML-, CSS-, ECMAScript-Schnipsel dienen
• Das Toolchen wird den vielfältigen Transformationen von Texten und Code dienen
• Das Toolchen wird als "sehr schnelle Web-Etwicklungs-Umgebung" dienen ( "Quick And Durty" )

Was soll das Toolchen können? "String-Manipulationen"

Hier kommen mündliche Codierungshinweise zum Toolchen "String-Manipulationen", das in loesungen/loesung-1.htm ist.

Die eigenen Akivitäten protokollieren in loesungen/aktivitaeten.htm Pflicht!

Bitte nicht vergessen: Bei allen Ausarbeitungen sind in Kurzform die gemachten Erfahrungen und Erkenntnisse chronologisch in die "Liste meiner Aktivitäten" eingetragen werden ( Pflicht! ).

Ausblick: Wie kann das Toolchen erweitert werden? Wozu sind diese Erweiterungen nützlich? Wie können die globalen Funktionen in einen Namespace überführt werden?

Wie wird testiert, bewertet? Es "gilt" das gesprochene Wort ...

Wesentliches wurde in der Veranstaltung mitgeteilt. Es gibt "harte" Kriterien, hierzu gehört der Abgabetermin. Es gibt "weiche" Kriterien, die stets eine gewisse "Grauzone" haben. Nachfolgend zu den Ausarbeitungen einige Bemerkungen, Denkanstöße, Fragen.

Gibt es hierzu Self-Assessments? einige MCT-Fragen ...

Einige Multiple-Choice-Fragen als Self-Assessments-Möglichkeit in der veranstaltung