Programmieren lernen in 15 Minuten am Tag für Dummies

Thomas Rose arbeitet als Senior Software Developer bei Europas größtem Internet-Hoster. Bei LinkedIn Learning hat er mehr als 100 Trainings aus den Bereichen Programmieren, JavaScript und WordPress veröffentlicht. Er lebt mit seiner Familie am Fuße der Schwäbischen Alb.

• Über den Autor  19Einleitung 21Teil I Erster Monat 25Kapitel 1: Erste Woche: Erste Schritte27Kapitel 2: Zweite Woche: Vorbereitungen zum eigenen Programmieren45Kapitel 3: Dritte Woche: HTML  61Kapitel 4: Vierte Woche: CSS75Teil II Zweiter Monat95Kapitel 5: Fünfte Woche: Raumschiffe bewegen  97Kapitel 6: Sechste Woche: Sterne Erzeugen 111Kapitel 7: Siebte Woche: Sterne bewegen123Kapitel 8: Achte Woche: Punkte zählen  135Teil III Dritter Monat147Kapitel 9: Neunte Woche: Auf die Plätze  Zeit messen   149Kapitel 10: Zehnte Woche: Der Laserstrahl163Kapitel 11: Elfte Woche: Wer hat die meisten Punkte?175Kapitel 12: Zwölfte Woche: Der let zte Schliff 187Teil IV Top-Ten-Listen   201Kapitel 13: Zehn Ideen, wie Sie das Spiel interessanter machen können203Kapitel 14: Zehn häufige genut zte Programmiersprachen  207Kapitel 15: Zehn Ressourcen, die Ihnen beim Programmieren helfen können217Kapitel 16: Zehn Begriffe rund ums Programmieren  221Anhang A: Direkt im Browser programmieren mitCodespaces 239Anhang B: Die Lösungen zu den Übungen   241Stichwortverzeichnis 261InhaltsverzeichnisÜber den Autor  19Einleitung 21Über dieses Buch  21Törichte Annahmen über die Leserinnen und Leser   21Was Sie nicht lesen müssen22Wie dieses Buch aufgebaut ist 22Teil I: Erster Monat22Teil II: Zweiter Monat  22Teil III: Dritter Monat  22Teil IV: Top-Ten-Listen 23Symbole, die in diesem Buch verwendet werden23Umgang mit den Übungsdateien23Wie es weitergeht  24TEIL IErster Monat 25Kapitel 1Erste Woche: Erste Schritte27Tag 1: Worauf Sie sich freuen können: Ihr eigenes Spiel programmieren28Was ist Programmieren? 29Pseudocode  29JavaScript   31Tag 2: Erste JavaScript-Befehle direkt im Browser32Hallo Welt!  33So ist ein Befehl aufgebaut 34Tag 3: Mehr JavaScript-Befehle im Browser   36Berechnungen durchführen37Code verbessern37Tag 4: Fremde Webseiten anpassen und verändern   39HTML: Quelltext einer Webseite39Eine Webseite verändern 39Tag 5: Welche Programmiersprachen gibt es?41Tag 6: Quiz – testen Sie Ihr Wissen   43Kapitel 2Zweite Woche: Vorbereitungen zum eigenenProgrammieren 45Tag 7: Vom Ausprobieren zum echten Programmieren46Ein einfacher Texteditor  46Spezielle Programme  4710 InhaltsverzeichnisTag 8: Was ist eine IDE? – Ihr Werkzeugkasten beim Programmieren48Installation von Visual Studio Code 48Erste Schritte mit Visual Studio Code49Einfügen eines Bildes  50Tag 9: VS Code einrichten – Mit Extensions zum Profi-Tool 51Auto Save  51Extension: Live Server 51Das Aussehen von VS Code ändern 53Tag 10: GitHub: Die Beispieldateien zum Buch herunterladen  54Übungsdateien herunterladen 54Das Spiel starten55Tag 11: Projekt-Organisation – Ordner und Dateien strukturieren 56Warum ist Struktur wichtig?56Typische Ordnerstruktur 56Pfade richtig angeben 57Übung: Eigene Struktur anlegen  57Best Practices für Dateinamen 58Tag 12: Quiz – testen Sie Ihr Wissen der zweiten Woche  59Kapitel 3Dritte Woche: HTML61Tag 13: HTML verstehen – Das Grundgerüst jeder Webseite   62HTML-Grundgerüst62HTML-Tags: Namen und Attribute 62Öffnende und schließende Tags63Beispiele63Gute Praxis 64Tag 14: Das Grundgerüst jeder Webseite: HTML 65Tag 15: Weitere HTML-Elemente – Links, Bilder und Listen 67Links erstellen67Bilder einfügen  67Ungeordnete und geordnete Listen 68Semantische Bedeutung vs Optik 68Kombination: Bild als Link69Kleine Anwendung69Typische Fehlerquellen69Tag 16: Aktionen auslösen mit Buttons 70HTML-Attribute  70Änderungsvorschläge 71Tag 17: Ihr erstes Mini-Projekt mit HTML 72Tag 18: Quiz – wie gut kennen Sie HTML? 73Kapitel 4Vierte Woche: CSS75Tag 19: Was ist CSS – und wofür braucht man es? 76Ein erstes Beispiel 76Aufbau einer CSS-Regel  76Selektoren  76  Inhaltsverzeichnis 11CSS im style-Tag 77CSS in externer Datei  77Inline-Style im HTML-Tag 78Tag 20: Elemente gezielt gestalten – CSS-Selektoren verstehen79Selektor-Typen (Grundlagen)   79Element-Selektor79Klassen-Selektor 80ID-Selektor 80Typische Fehler  80Häufige Style-Eigenschaften80Das passende CSS für unser Spiel 81Übung81Zum Nachdenken 81Tag 21: Elemente positionieren und skalieren82Größe von Elementen 82Positionierungs-Modi 82Relative Positionierung   82Absolute Positionierung  83Offsets verstehen 83Für unser Spiel  84Typische Fehler  84Übung84Zum Nachdenken 84Tag 22: Farben in CSS – Webseiten lebendiger gestalten 85Farben in CSS85Farben mit Namen85Was können Sie alles einfärben?  85Farben mit Farbcodes angeben86Hexadezimalwerte86Für unser Spiel  87Tag 23: Selektoren für Fortgeschrittene 88Kombinationen von Selektoren88Nachfahrenselektoren88Attributselektoren 89Pseudoklassen  89Die CSS-Datei stylescss  89Exkurs: Hover90Tag 24: Quiz – wie fit sind Sie in CSS?91TEIL IIZweiter Monat  95Kapitel 5Fünfte Woche: Raumschiffe bewegen 97Tag 25: Raumschiffsteuerung per Tastatur98Was müssen Sie ändern, damit sich das Raumschiff schneller bewegt?99Was müssen Sie ändern, damit sich das Raumschiff nach links bewegt?99Warum springt das Raumschiff beim ersten Tastendruck nach links? 9912 InhaltsverzeichnisTag 26: Die Position des Raumschiffs im Code abrufen100Tag 27: Links und rechts im Code unterscheiden102Tag 28: Den Code in eine Funktion auslagern 104Tag 29: Wie Sie das Raumschiff im Rahmen halten106Tag 30: Quiz – Raumschiffsteuerung und Funktionen 108Kapitel 6Sechste Woche: Sterne Erzeugen 111Tag 31: Der erste Stern112Tag 32: Zufällige Positionen – Sterne dynamisch platzieren114Tag 33: Mehrere Sterne gleichzeitig erzeugen115Tag 34: Zahlen auf- und abrunden   117Tag 35: Entscheidungen im Code per If-Anweisung119If-Bedingungen  119Verknüpfung von Bedingungen120Tag 36: Quiz: Sterne und Logik im Spiel 121Kapitel 7Siebte Woche: Sterne bewegen 123Tag 37: Sterne fallen lassen 124Tag 38: Sterne animieren   126Tag 39: Auferstehung der Sterne128Tag 40: Die Geschwindigkeit der Sterne steuern 130Tag 41: Sterne beschleunigen  133Tag 42: Quiz – Bewegung und Animation 134Kapitel 8Achte Woche: Punkte zählen  135Tag 43: Kollisionen erkennen – wo Stern auf Raumschiff trifft  136Tag 44: Kollisionserkennung verbessern138Tag 45: Game Over 140Tag 46: Das bessere Ende des Spieles  141Tag 47: Variablen, Konstanten und wo sie gelten142Variablen und Konstanten 142Gültigkeitsbereiche142Tag 48: Quiz – Spielmechanik und Variablen  144TEIL IIIDritter Monat   147Kapitel 9Neunte Woche: Auf die Plätze  Zeit messen 149Tag 49: Zeit messen mit JavaScript   150Tag 50: Die Spielzeit beim Spielen anzeigen  152Tag 51: Das Spiel neu starten  153Tag 52: Pause! Das Spiel anhalten und fortsetzen 155Tag 53: Von Zahlen und Texten – Variablentypen verstehen157Boolesche Werte157Zahlen157Inhaltsverzeichnis 13Zeichenketten158Arrays158Zahlen und Zeichenketten 159Tag 54: Quiz: Zeit, Pause und boolesche Werte  161Kapitel 10Zehnte Woche: Der Laserstrahl 163Tag 55: Sterne abschießen  164Taste zum Schießen   164Laserstrahl zeichnen  165Den Laserstrahl zeichnen165Tag 56: Den Laserstrahl in Position bringen  167Tag 57: Der Laserblitz 169Tag 58: Wie der Laserstrahl Sterne zerstört   170Treffer erkennen170Tag 59: Sterne zählen und Punktestand anzeigen 172Tag 60: Quiz – Highscore und Laserlogik174Kapitel 11Elfte Woche: Wer hat die meisten Punkte?  175Tag 61: Highscores erfassen176Tag 62: Die Liste sortieren – wer liegt vorne? 177Tag 63: Spielergebnisse sortieren mit JavaScript 179Tag 64: Die Bestenliste speichern und anzeigen 181Tag 65: Bestenliste zurücksetzen183Tag 66: Quiz – Highscore und Datenverwaltung 185Kapitel 12Zwölfte Woche: Der let zte Schliff187Tag 67: Ordnung schaffen – strukturierter Code 188Dateien anlegen 188Tag 68: So benennen Sie Ihre Variablen richtig  191Variablen mit einem Standardwert initialisieren 192Schreibweise von Variablennamen192Tag 69: Das Raumschiff aufhübschen193Tag 70: Feinschliff fürs Spiel195Tag 71: So hilft Künstliche Intelligenz beim Programmieren196Tag 72: Sag zum Abschied leise Quiz – Abschied und Ausblick  198TEIL IVTop-Ten-Listen  201Kapitel 13Zehn Ideen, wie Sie das Spiel interessanter machenkönnen203Schnellere Sterne  203Unterschiedliche Sterngrößen 203Verschiedene Sternarten   204Hindernisse20414 InhaltsverzeichnisPower-Ups für breiteren Laser 204Verbesserter Highscore 205Soundeffekte205Hindernisse, die Sterne zerstören   205Zeitlimit 206Levels durchlaufen 206Kapitel 14Zehn häufige genut zte Programmiersprachen   207Python  207JavaScript  208Java 209C++210C# 210PHP 211Go 212Kotlin   213Swift213Ruby214Kapitel 15Zehn Ressourcen, die Ihnen beim Programmieren helfenkönnen217Stack Overflow   218GitHub  218LinkedIn Learning  218MDN Web Docs  218CodeWars  219freeCodeCamp   219Codecademy 219W3Schools 219LeetCode220Coursera220ChatGPT, Claudeai und andere KI-Tools220Kapitel 16Zehn Begriffe rund ums Programmieren  221Objektorientierte Programmierung (OOP)221Grundprinzipien der OOP222Vorteile der OOP222Beispiel 222Algorithmus223Eigenschaften eines Algorithmus 223Beispiel 224Berühmte Algorithmen224API - Application Programming Interface 224Arten von APIs225Inhaltsverzeichnis 15Vorteile von APIs225Beispiel 225Bekannte APIs226Framework 226Arten von Frameworks226Vorteile von Frameworks 226Beispiel 227Bekannte Frameworks227Versionierung228Arten von Versionierungssystemen 228Vorteile der Versionierung 228Bekannte Versionierungssysteme 229Debugging 229Schritte im Debugging-Prozess 229Debugging-Tools230Best Practices im Debugging   230Beispiel 230Compiler231Funktionsweise eines Compilers  231Beispiel 232Bekannte Compiler232Alternative: Interpretersprachen  232Refactoring233Warum Refactoring wichtig ist 233Häufige Refactoring-Techniken 233Beispiel 233Werkzeuge für Refactoring 234Tests234Unit-Tests   235Integrationstests235Systemtests  235Akzeptanztests  235Automatisierte Tests  235Test-driven Development (TDD)235Fazit  236Build-Tools und CI/CD-Pipelines 236Continuous Integration und Continuous Deployment (CI/CD) 236Vorteile von Build-Tools und CI/CD236Beispiel einer CI/CD-Pipeline   237Beliebte CI/CD-Tools   237Anhang ADirekt im Browser programmieren mit Codespaces239GitHub-Konto erstellen239Codespace erstellen und nutzen  239Wann Codespaces?240Wann lokal entwickeln?  24016 InhaltsverzeichnisAnhang BDie Lösungen zu den Übungen  241Die Lösungen zum Quiz von Tag 6   241Frage 1: Anführungszeichen241Frage 2: Auszeichnungssprache241Frage 3: Lokale Kopie  241Frage 4: consolelog(x) 241Frage 5: prompt()242Die Lösungen zum Quiz von Tag 12  243Frage 1: Keine Formatierungen243Frage 2: Vorteile einer IDE243Frage 3: Eine Plattform (und was für eine) 243Frage 4: Extensions243Frage 5: Ordnung halten 243Die Lösungen zum Quiz von Tag 18  244Frage 1: Auszeichnungssprache244Frage 2: Name und spitze Klammern244Frage 3: ID  244Frage 4: Attribute in Anführungszeichen244Frage 5: Nicht auf der Webseite, gegebenenfalls im Titel 245Die Lösungen zum Quiz von Tag 24  246Frage 1: Selektor mit #246Frage 2: »wie oft« geht nicht246Frage 3: Punkt vs Raute  246Frage 4: color246Frage 5: padding geht nicht246Frage 6: px und %246Frage 7: Sterne im Game 247Frage 8: #game star 247Frage 9: none und block  247Frage 10: Relativ zur normalen Position 247Die Lösungen zum Quiz von Tag 30  248Frage 1: Wiederverwendbarer Codeblock mit Aufgaben  248Frage 2: Stopp mit Rückgabewert 248Frage 3: Veränderte Spielfeldbreite 248Frage 4: Mit »px« ist nicht zu rechnen   248Frage 5: Für jedes Zeichen eine Zahl249Die Lösungen zum Quiz von Tag 36  250Frage 1: Antwort 1, 2 und 3   250Frage 2: Ganzzahlige Pixelpositionen250Frage 3: Zeile 4  250Frage 4: Mathrandom() * 50 + 50 250Frage 5: if und while 250Die Lösungen zum Quiz von Tag 42  251Frage 1: getElementsByClassName(className")251Frage 2: styletop251Frage 3: setInterval(function, interval)251Inhaltsverzeichnis 17Frage 4: remove  251Frage 5: clientHeight252Die Lösungen zum Quiz von Tag 48  253Frage 1: Horizontale Bewegung253Frage 2: clearInterval() 253Frage 3: Fehler  253Frage 4: Global im Code, lokal in der Funktion   253Frage 5: Sicher und verständlich  253Die Lösungen zum Quiz von Tag 54  254Frage 1: true oder false 254Frage 2: Start bei 0254Frage 3: Zahlen, Zeichenketten und boolesche Werte 254Frage 4: (Milli-)Sekunden der Unix-Epoche 254Frage 5: Verzögerte einmalige Ausführung 254Die Lösungen zum Quiz von Tag 60  255Die Lösungen zum Quiz von Tag 66  257Die Lösungen zum Quiz von Tag 72  258Frage 1: Geänderter Text 258Frage 2: Alles gut258Frage 3: Mathfloor(Mathrandom() * 10) + 1258Frage 4: Wert und Typ 258Frage 5: elementclassListadd(’classname’);  258Frage 6: documentcreateElement(’tagname’);259Frage 7: function myFunction()   259Frage 8: Verhinderte Standardaktion259Frage 9: Dokumentation und Verständnis  259Frage 10: consolelog259Stichwortverzeichnis 261