HTML5-Tutorium: JavaScript: Hello World: Unterschied zwischen den Versionen
aus GlossarWiki, der Glossar-Datenbank der Fachhochschule Augsburg
Kowa (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
Kowa (Diskussion | Beiträge) |
||
| (33 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt) | |||
| Zeile 1: | Zeile 1: | ||
{{HTML5-Tutorium:JavaScript:HelloWorld:Menü}} | {{HTML5-Tutorium:JavaScript:HelloWorld:Menü}} | ||
==Ziel== | ==Ziel== | ||
In diesem Tutorium wird beschrieben, wie man in [[HTML5]] eine interaktive Hello-World-Anwendung mit Hilfe | In diesem Tutorium wird beschrieben, wie man in [[HTML5]] eine interaktive Hello-World-Web-Anwendung mit Hilfe | ||
von [[JavaScript]] erstellt. | von [[JavaScript]] erstellt. | ||
==Voraussetzungen== | |||
Dieses Tutorium wendet sich an Studierende des vierte Semesters [[IAM|Interaktive Medien]]. | |||
Es wurde und wird im Rahmen der Lehrveranstaltung | |||
[[Modul:IAM (SPO 2018):Web-Programmierung|Web-Programmierung]] (WebProg) entwickelt. | |||
Sie sollten die [[HTML5-Tutorium: JavaScript: Entwicklungsumgebung|Node.js-Entwicklungsumgebung]] bereits installiert haben. | |||
===Use Cases=== | ===Use Cases=== | ||
| Zeile 9: | Zeile 17: | ||
==Tutorium== | ==Tutorium== | ||
* [[HTML5-Tutorium: JavaScript: Hello World 01|Teil 1]]: Erstellen einer Web-Anwendung ([[HTML]]) mittels [[Visual Studio Code]], die <br/> <code>Hallo, Welt!</code> <br/> ausgibt. Diese Anwendung wird in einem [[Git]]-Repository gespeichert. | |||
* [[HTML5-Tutorium: JavaScript: Hello World 02|Teil 2]]: Layouten der Hello-World-Web-Anwendung mittels [[CSS]]. | |||
* [[HTML5-Tutorium: JavaScript: Hello World 03|Teil 3]]: Dynamisieren der Hello-World-Web-Anwendung mittels [[JavaScript]] (<code>Hallo, <Benutzername>!</code>) | |||
* [[HTML5-Tutorium: JavaScript: Hello World 04|Teil 4]]: Verbesserung der Web-Anwendung: Modularisierung, Beschleunigung des Ladevorgangs | |||
* [[HTML5-Tutorium: JavaScript: Hello World 05|Teil 5]]: Automatische Komprimierung der CSS- und JavaScript-Dateien mittels [[Vite]] | |||
* [[HTML5-Tutorium: JavaScript: Hello World 06|Teil 6]]: Verwendung von SCSS an Stelle von CSS | |||
<!----> | |||
==Quellen== | ==Quellen== | ||
# {{Quelle|Kowarschick, W.: | # {{Quelle|Kowarschick, W.: Web-Programmierung}} | ||
==Siehe auch== | |||
* [http://www.w3schools.com/html/html5_intro.asp w3schools.com: HTML5] | |||
* [https://html.spec.whatwg.org/multipage/ HTML Living Standard] | |||
<noinclude>[[Kategorie: HTML5-Tutorium: JavaScript: Hello World]][[Kategorie: HTML5-Beispiel]][[Kategorie:Kapitel:Multimedia-Programmierung:Beispiele]] | <noinclude>[[Kategorie: HTML5-Tutorium: JavaScript: Hello World]][[Kategorie: HTML5-Beispiel]][[Kategorie:Kapitel:Multimedia-Programmierung:Beispiele]] | ||
</noinclude> | </noinclude> | ||
Aktuelle Version vom 11. März 2025, 14:32 Uhr
Dieser Artikel erfüllt die GlossarWiki-Qualitätsanforderungen nur teilweise:
| Korrektheit: 3 (zu größeren Teilen überprüft) |
Umfang: 4 (unwichtige Fakten fehlen) |
Quellenangaben: 3 (wichtige Quellen vorhanden) |
Quellenarten: 5 (ausgezeichnet) |
Konformität: 3 (gut) |
Inhalt | Teil 1 | Teil 2 | Teil 3 | Teil 4 | Teil 5 | Teil 6 | Vue 1 | Vue 2 | Vue 3 | Vue 4 | Vue 5 | Vue 6
Ziel
In diesem Tutorium wird beschrieben, wie man in HTML5 eine interaktive Hello-World-Web-Anwendung mit Hilfe von JavaScript erstellt.
Voraussetzungen
Dieses Tutorium wendet sich an Studierende des vierte Semesters Interaktive Medien. Es wurde und wird im Rahmen der Lehrveranstaltung Web-Programmierung (WebProg) entwickelt.
Sie sollten die Node.js-Entwicklungsumgebung bereits installiert haben.
Use Cases
Es wird eine personalisierte HTML-Seite erstellt: Der Benutzer wird nach seinem Namen gefragt und dieser wird anschließend in die aktuelle HTML-Seite (mittels JavaScript) eingefügt.
Tutorium
- Teil 1: Erstellen einer Web-Anwendung (HTML) mittels Visual Studio Code, die
Hallo, Welt!
ausgibt. Diese Anwendung wird in einem Git-Repository gespeichert.
- Teil 2: Layouten der Hello-World-Web-Anwendung mittels CSS.
- Teil 3: Dynamisieren der Hello-World-Web-Anwendung mittels JavaScript (
Hallo, <Benutzername>!) - Teil 4: Verbesserung der Web-Anwendung: Modularisierung, Beschleunigung des Ladevorgangs
- Teil 5: Automatische Komprimierung der CSS- und JavaScript-Dateien mittels Vite
- Teil 6: Verwendung von SCSS an Stelle von CSS
Quellen
- Kowarschick (WebProg): Wolfgang Kowarschick; Vorlesung „Web-Programmierung“; Hochschule: Hochschule Augsburg; Adresse: Augsburg; Web-Link; 2024; Quellengüte: 3 (Vorlesung)
