
Mission 3: Programmiere eine App
In Mission 3 lernst du, wie du mit HTML und JavaScript eine App programmieren kannst. Das Wort App ist eine Abkürzung für Application (auf Deutsch: „Anwendung“). Das ist ein Programm, das einem Menschen helfen soll, eine bestimmte Aufgabe zu erledigen. In dieser Mission programmierst du eine App, mit der man eine Aufgabenliste verwalten kann. Der Benutzer der App kann eine Aufgabenliste aufbauen, indem er neue Aufgaben einfügt. Wenn er eine Aufgabe erledigt hat, kann er sie durch Anklicken aus der Aufgabenliste entfernen.
Als erstes lernst du, wie man einen Button (eine Schaltfläche) erstellt. Dann verwendest du zwei Programmierschnittstellen (Application Program Interfaces oder kurz APIs), das DOM (Document Object Model) und localStorage. Diese APIs ermöglichen dir, eine Webseite zu programmieren, auf der Dinge erscheinen und verschwinden können und die Daten speichern kann.
CODE SKILLS
So erstellst du einen Button
Verwende das -Tag, um einen Button zu erstellen, den man anklicken kann.
CODE SKILLS
Buttons führen den Code aus
Verwende das onClick-Attribut und sorge dafür, dass ein Alert erscheint, wenn man den Button anklickt.
CODE SKILLS
Methoden und Eigenschaften
Finde und ändere die Inhalte von HTML-Elementen mit der DOM-API.
CODE SKILLS
Neue HTML-Elemente einfügen
Verwende das DOM um neue HTML-Elemente zu erzeugen und in die App einzufügen.
CODE SKILLS
Die Basis-App erstellen
Erstelle die Vorlage für die Basisversion der App.
CODE SKILLS
Ein HTML-Element entfernen
Verwende die DOM-API, um ein HTML-Element aus deiner App zu entfernen
CODE SKILLS
Mehrere HTML-Elemente entfernen
Verwende die Methode removeChild, um mehrere HTML-Elemente aus deiner Webseite zu entfernen.
CODE SKILLS
Die API localStorage verwenden
Speichere Daten auf deinem Computer mit der API localStorage.
Deine Aufgabe: Eine APP für eine Aufgabenliste
Verwende deine HTML- und JavaScript-Kenntnisse, um eine digitale Aufgabenliste für Professor Bairstone zu programmieren. Du benötigst die APIs DOM und localStorage.
Nützliche Ressourcen für diese Mission
Das Logo für das Haus von Volkov
Hole dir das Logo für das Haus von Herrn Volkov.
Herr Volkov
Hole dir ein Bild von Herrn Volkov und verwende es für deine App.
Aufgabenliste
Schau dir die Aufgaben in Professor Bairstones Liste an
Copyright © 2008 Walker Books Ltd
Illustrations © Duncan Beedie
All rights reserved.