Prüfung Nr. 7 – Programmierung mit der Hexe Nadja
Wenn du in die Programmierung starten willst, so ist es wichtig, dass du möglichst viele kleine Projekte machst. Die Prüfungen der Hexe sind sehr gut dazu geeignet und helfen dir einfachen Code aufzubauen, zu verstehen, oder auch weiterzuentwickeln. Nimm dir 60 Minuten Zeit und versuche die Prüfungs-Aufgabe mal zu lösen. Kommst du nicht weiter darfst du natürlich auch auf den Spicker schauen, nämlich das Lösungsvideo unten anschauen, um das ganze nachzubauen.
Die Prüfungs-Aufgabe lautet:
Programmiere eine kleine Webseite in HTML und CSS. Diese besteht aus einem Bild. ( Bild 1 unten) Unter dem Bild soll der User die Möglichkeit haben an 4 Schiebereglern, die Lautstärke, Bass, Balance einzustellen. Außerdem gibt es noch einen 4. Regler, der nennt sich „Speaker“.
Das Bild 1 darfst du frei nutzen zum testen. Code das ganze in Visual-Studio-Code, oder einem anderen Editor deiner Wahl.
Bild 1 Deine Bild-Vorlage zur freien Nutzung und zum üben
Bild 2 – So soll das ganze aussehen: Wenn der User auf die Webseite geht, soll oben das Bild 1 erscheinen und unten links die 4 Schieberegler eingebaut sein. Der Hintergrund soll schwarz sein.
Wichtige Anmerkung: Da es sich hier um eine Anfänger-Übung handelt, passiert natürlich nichts, wenn du mit der Maus den Regler von links nach rechts ziehst. Wichtig ist, dass du dich mit dem Code auseinandersetzt und versuchst solche kleine Regler zu programmieren. Zunächst ohne große Funktion. Achte auch, dass das ganze stylisch und ein cooles Aussehen hat. Solche Regler werden oft genutzt, wenn man z. B. von 1% -100 % etwas einstellen soll oder ähnliches. Sicherlich hast du das schon in bestimmten Programmen gesehen.
Lösungs-Video : Demnächst-.)
Zu den anderen Prüfungen zum üben mehr
Notenschlüssel und Lebkuchenfrage mehr
Was lernst du in dieser speziellen Übung:
Punkt 1 : Arbeiten mit Visual-Studio-Code
Punkt 2 : Arbeiten mit HTML ( Markup-Sprache) und CSS ( Style-Sheet-Sprache)
Punkt 3 : Wie kann man Code veröffentlichen?
Punkt 4: Wie kommt man zu einer Domain, also einer Internet-Adresse, wenn du den Code fertig hast?
Punkt 5: Du lernst, wie man solche virtuelle Schieber programmiert, die häufig in Programmen vorkommen
Punkt 6: Du lernst wie man die Hintergrundfarben innerhalb von Sekunden im Code verändert
Punkt 7: Du lernst was man macht, wenn man in CSS nicht weiterkommt, oder keine Code-Lösung findet.
Alle Lösungen
Um den Lerneffekt zu erhöhen, solltest du natürlich erst versuchen die Code-Aufgabe alleine zu lösen. Falls du nicht weiterkommst, schau dir dazu die entsprechenden Videos an und versuch das ganze mal nachzubauen. Viel Erfolg.
Lösungsvideo 0: Woher kriege ich Visual-Studio-code eigentlich? mehr
Lösungsvideo 1 : Komplett Lösung-Prüfung Nr. 7 “ Video ( 7 min)
Lösungsvideo 2 : Wie kann ich Code veröffentlichen mit eigener Internet-Adresse Video (36:16 min)
Wichtige Anmerkung: Wenn du etwas veröffentlichst solltest du immer darauf achten, dass du ein vollständiges Impressum mit einbaust.
Lösungsvideo 3 : Hilfe mein Bild wird nicht angezeigt in Visual-Studio-Code Video
Lösungsvideo 4 : Wie kann ich mit einem einfachen Ausrufezeichen ein komplettes HTML-Gerüst erzeugen? Video
Lösungsvideo 5: Kann man den Code auch auf dem Handy ausführen? Video ( 6:22min)
Weitere Prüfungen zum üben mehr
Weitere Klassenarbeiten zum üben mehr
Hilfe, ich weiß einfach nicht mit welcher Programmiersprache ich starten soll 100 min Einführungs-Video