Einstieg

Was ist Programmierung – und was ist ein Algorithmus?

Du hast noch nie programmiert? Perfekt – hier starten wir bei null. Wir klären, was Programmieren überhaupt bedeutet, was ein Algorithmus ist, warum wir überhaupt programmieren und wie JavaScript in eine Webseite kommt.

1. Was ist Programmierung?

Programmierung bedeutet, einem Computer Schritt für Schritt zu sagen, was er tun soll. Der Computer selbst ist nämlich gar nicht schlau – er kann nur sehr schnell und sehr zuverlässig Anweisungen ausführen, die ein Mensch ihm vorgibt.

Diese Anweisungen schreiben wir in einer Programmiersprache. Das ist eine Sprache, die sowohl Menschen (einigermaßen) verstehen können als auch der Computer. JavaScript ist genau so eine Programmiersprache – sie wird vor allem für Webseiten im Browser verwendet.

Merke: Programmieren heißt nicht, dass der Computer „denkt“. Er führt einfach nur deine Anweisungen aus – so wie ein Koch ein Rezept befolgt. Die Kunst ist, das Rezept so aufzuschreiben, dass es eindeutig ist.

Ein Vergleich aus dem Alltag

Stell dir vor, du erklärst einem Roboter, wie er sich ein Butterbrot schmieren soll. „Schmier Butter aufs Brot“ klingt einfach – aber der Roboter weiß nicht, wo die Butter ist, wie er sie aufs Messer bekommt, wie viel Butter drauf soll usw. Du musst jeden einzelnen Schritt ganz genau beschreiben. Genau das ist Programmieren.

2. Was ist ein Algorithmus?

Ein Algorithmus ist eine eindeutige Abfolge von Schritten, um ein bestimmtes Problem zu lösen. Er ist also so etwas wie eine Anleitung – und zwar eine, die so genau ist, dass sie immer zum richtigen Ergebnis führt.

Merke: Ein Algorithmus ist noch kein Programm! Ein Programm ist ein Algorithmus, der in einer Programmiersprache (z. B. JavaScript) aufgeschrieben wurde.

Beispiel: Ein Algorithmus aus dem Alltag

Die Anleitung „Kaffee kochen mit einer Filterkaffeemaschine“ ist ein Algorithmus:

Wasser in den Wassertank füllen
Filterpapier in den Filterhalter einsetzen
Kaffeepulver in den Filter geben
Kanne auf die Warmhalteplatte stellen
Maschine einschalten
Warten, bis der Kaffee durchgelaufen ist
Kanne entnehmen und Kaffee servieren

Diese Schritte sind eindeutig (jeder versteht, was gemeint ist) und endlich (irgendwann ist der Kaffee fertig). Beides sind wichtige Eigenschaften eines Algorithmus.

Eigenschaften eines Algorithmus

Eindeutig: Jeder Schritt ist klar beschrieben.
Ausführbar: Jeder Schritt ist tatsächlich machbar.
Endlich: Der Ablauf hört irgendwann auf.
Allgemein: Er löst das Problem für alle passenden Eingaben.

3. Warum brauchen wir Programmierung?

Computer stecken heute fast überall drin: im Handy, in der Kaffeemaschine, im Auto, in der Ampel, im Geldautomaten – und natürlich im Internet. Damit diese Geräte überhaupt etwas Sinnvolles tun, brauchen sie Programme.

Ein paar Beispiele, wo Programmierung drinsteckt

📱 Handy-Apps: Jede App ist ein Programm.
🌐 Webseiten: Interaktive Elemente (Menüs, Formulare, Spiele) laufen oft mit JavaScript.
🚦 Ampeln: Sie werden von kleinen Programmen gesteuert.
🚗 Autos: Motorsteuerung, Assistenzsysteme, Navi – alles Software.
🏧 Geldautomaten: Prüfen PIN, buchen Geld ab – ein Programm.

Warum ist das wichtig für dich?

Programmieren hilft dir zu verstehen, wie die Dinge funktionieren, die du täglich benutzt. Und du kannst eigene Ideen umsetzen: eine kleine Webseite bauen, ein Spiel programmieren, Daten auswerten oder einen Rechner schreiben. Programmieren ist damit eine Schlüsselkompetenz – ähnlich wie Lesen und Schreiben.

Kurz gesagt: Ohne Programmierung gäbe es keine Apps, keine Webseiten und keine modernen Geräte. Programmieren ist die Sprache, mit der Menschen der Technik sagen, was sie tun soll.

4. JavaScript im HTML-Grundgerüst

Damit JavaScript im Browser läuft, muss es in eine HTML-Seite eingebunden werden. HTML ist das Grundgerüst einer Webseite – es beschreibt, welche Inhalte (Überschrift, Absatz, Bild …) auf der Seite stehen. JavaScript wird dann zusätzlich in dieses Grundgerüst eingebaut und sorgt dafür, dass die Seite „lebendig“ wird.

Das HTML-Grundgerüst

<!DOCTYPE html>
<html lang="de">
<head>
    <meta charset="UTF-8">
    <title>Meine erste Seite</title>
</head>
<body>
    <h1>Hallo Welt!</h1>
</body>
</html>
        

JavaScript einbinden – so geht's

Es gibt zwei Wege, JavaScript in eine HTML-Seite einzubinden: direkt im HTML (inline) oder als externe Datei.

Variante A: Direkt im HTML (mit `<script>`)

<!DOCTYPE html>
<html lang="de">
<head>
    <meta charset="UTF-8">
    <title>Meine erste Seite</title>
</head>
<body>
    <h1>Hallo Welt!</h1>

    <!-- Hier beginnt JavaScript -->
    <script>
        alert("Hallo, ich bin JavaScript!");
    </script>
</body>
</html>
        

Alles zwischen <script> und </script> ist JavaScript-Code. Der Browser führt ihn aus, sobald die Seite geladen ist. alert(...) öffnet zum Beispiel ein kleines Popup-Fenster.

Variante B: Externe JavaScript-Datei

Bei größeren Projekten schreibt man den JavaScript-Code in eine eigene Datei, z. B. script.js, und bindet sie so ein:

<script src="script.js"></script>
        

Vorteil inline

Schnell für kleine Tests – alles auf einen Blick in einer Datei.

Vorteil extern

Übersichtlicher, wiederverwendbar, besser für größere Projekte.

Wichtig: Wo genau das <script>-Tag steht, ist entscheidend. Steht es im <head>, wird der Code ausgeführt, bevor der Seiteninhalt da ist – das kann zu Fehlern führen. Deshalb setzt man es meistens ans Ende des <body> oder verwendet das Attribut defer.

So sieht es aus, wenn es läuft

Wenn du den Code oben in eine Datei index.html speicherst und im Browser öffnest, erscheint zuerst die Überschrift „Hallo Welt!“ – und kurz danach ein Popup mit „Hallo, ich bin JavaScript!“. Das ist dein erstes eigenes Programm.

5. Zusammenfassung

Programmierung = dem Computer Schritt für Schritt sagen, was er tun soll.
Algorithmus = eindeutige, endliche Anleitung zur Lösung eines Problems.
Programm = ein Algorithmus, aufgeschrieben in einer Programmiersprache (z. B. JavaScript).
Warum? Ohne Programmierung gäbe es keine Apps, Webseiten, Ampeln, Navis usw.
JavaScript wird über das <script>-Tag in eine HTML-Seite eingebunden – entweder direkt oder als externe Datei.

Arbeitsauftrag

Algorithmus im Alltag: Schreibe einen Algorithmus mit mindestens 5 Schritten für „Zähne putzen“ auf. Achte darauf, dass jeder Schritt eindeutig ist.
HTML-Grundgerüst: Lege eine neue Datei index.html an und schreibe das HTML-Grundgerüst hinein (Titel: „Mein erstes Programm“).
JavaScript einbinden: Füge im <body> einen <script>-Block ein, der mit alert("Hallo Welt!") ein Popup anzeigt. Öffne die Datei im Browser und prüfe, ob das Popup erscheint.
Recherche: Nenne drei Geräte aus deinem Alltag, in denen Programmierung steckt, und beschreibe in einem Satz, was das Programm dort tut.