Erste Schritte

Drei Wege im Überblick

Für den Einstieg gibt es genau drei Umgebungen, die man kennen sollte: die Browser-Console, die interaktive Node-REPL und ein vom Terminal aus gestartetes Skript. Alle drei sprechen denselben Sprachkern, unterscheiden sich aber in Persistenz, verfügbaren APIs und Reibung beim Wechsel zwischen Iterationen.

In der Praxis nutzt man alle drei parallel: die Browser-Console für UI- und DOM-Fragen, die REPL als Taschenrechner und Spielwiese, eine Datei für alles, was reproduzierbar bleiben soll.

Die Browser-Console

Die DevTools öffnen sich überall mit F12 oder — auf macOS — mit Cmd+Opt+I. Im Tab Console lässt sich beliebiger JavaScript-Code eintippen. Mit Enter wird er ausgewertet, der Rückgabewert direkt darunter angezeigt. Mehrzeilige Eingaben gelingen mit Shift+Enter. Ein automatischer Zeilenumbruch wird auch gesetzt, sobald ein Block syntaktisch noch nicht abgeschlossen ist.

const greet = name => `Hallo, ${name}!`;
greet('Welt');

'Hallo, Welt!'

Drei Komfort-Funktionen sind erwähnenswert. Erstens: das Häkchen Preserve log lässt Console-Einträge auch nach einem Reload überleben — praktisch beim Debuggen von Redirects. Zweitens funktioniert in modernen Engines (Chrome, Firefox, Safari) Top-Level await direkt in der Console. Drittens stellt die Console mit $0 bis $4 einen Verlauf der zuletzt im Elements-Panel selektierten Knoten bereit, und $_ enthält stets den letzten Rückgabewert.

const res = await fetch('/api/health');
const data = await res.json();
data.status;

'ok'

Node.js installieren

Für alles abseits des Browsers braucht es eine lokale Runtime. Empfohlen ist Node.js 22 LTS — die aktive LTS-Linie wird bis Mai 2027 mit Sicherheits-Updates versorgt. Statt Node global per Installer einzurichten, lohnt sich der Umweg über einen Versions-Manager: er erlaubt projektgenaue Wechsel und macht Upgrades schmerzfrei.

# nvm installieren (macOS / Linux)
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.1/install.sh | bash

# aktuelle LTS holen und aktivieren
nvm install --lts
nvm use --lts

# Verifikation
node -v   # v22.x.x
npm -v

Auf macOS ist alternativ brew install node möglich, unter Windows hat sich fnm oder nvm-windows eingebürgert. Wer Bun oder Deno parallel nutzen möchte, installiert beide problemlos daneben — sie konkurrieren nicht mit Node, sondern erweitern den Werkzeugkasten.

Die Node-REPL

Ein nacktes node ohne Argument startet die Read-Eval-Print-Loop. Sie ist für die Sprache, was python interaktiv für Python ist: ein Skizzenblock zum Probieren von Ausdrücken, ohne eine Datei anzulegen.

$ node
Welcome to Node.js v22.14.0.
Type ".help" for more information.
> const xs = [1, 2, 3];
undefined
> xs.map(n => n * n);
[ 1, 4, 9 ]
> _
[ 1, 4, 9 ]
> .editor
// Mehrzeilig: zum Verlassen Ctrl+D
function square(n) {
    return n * n;
}
square(7);
// Strg+D
49
> .save session.js
> .exit

Wichtige Befehle: .help listet alle Spezialkommandos, .editor öffnet einen Multi-Line-Modus, .save und .load schreiben oder lesen ganze Sessions als Datei, .clear setzt den Kontext zurück. Der Unterstrich _ enthält stets den letzten Rückgabewert — perfekt, um Zwischenergebnisse weiter zu verketten. Tab-Completion funktioniert auf Variablen, Properties und Modul-Namen.

Eine Datei mit Node ausführen

Sobald Code wiederverwendbar werden soll, wandert er in eine Datei. node datei.js reicht für den Einstieg. Zwei zusätzliche Flags sind im Alltag Gold wert.

function greet(name) {
    return `Hallo, ${name}!`;
}

const names = ['Anna', 'Bert', 'Clara'];
for (const n of names) {
    console.log(greet(n));
}

Hallo, Anna!
Hallo, Bert!
Hallo, Clara!

node --watch hello.js (Node 19+, stabil seit Node 20) startet das Skript bei jeder Änderung an der Datei oder einer importierten Datei automatisch neu — ein kompletter Ersatz für nodemon aus dem Werkzeuggürtel. node --inspect-brk hello.js öffnet einen DevTools-kompatiblen Debug-Port. Mit dem Aufruf chrome://inspect im Browser lässt sich die Datei dann mit Breakpoints durchsteppen.

node hello.js                  # einmalig ausführen
node --watch hello.js          # Auto-Reload bei Änderungen
node --inspect-brk hello.js    # Debug-Port + Breakpoint am Start
node --env-file=.env hello.js  # .env-Datei laden (Node 20.6+)

ES Modules vs. CommonJS

In Node existieren zwei Modul-Systeme nebeneinander. Das ältere CommonJS mit require und module.exports ist seit Node 0.x dabei und für .js-Dateien weiterhin Default, sofern nichts anderes konfiguriert ist. ES Modules mit import und export sind seit Node 12 produktionsreif, seit Node 22 die empfohlene Form für Neuprojekte und in .mjs-Dateien sowie bei "type": "module" in der package.json automatisch aktiv.

{
  "name": "mein-projekt",
  "version": "1.0.0",
  "type": "module"
}

Der gleiche Use-Case einmal in ESM, einmal in CommonJS — die strukturellen Unterschiede sind klar erkennbar:

// Datei-Endung mjs ODER package.json mit "type": "module"
export function add(a, b) {
    return a + b;
}

export const PI = 3.14159;

import { add, PI } from './math.mjs';

// Top-Level await ist in ESM erlaubt
const res = await Promise.resolve(add(2, 3));
console.log(res, PI);

5 3.14159

function add(a, b) {
    return a + b;
}

module.exports = { add, PI: 3.14159 };

const { add, PI } = require('./math.cjs');

console.log(add(2, 3), PI);
// Top-Level await ist in CommonJS NICHT erlaubt

5 3.14159

Quick-Start: das erste Skript

Vom leeren Verzeichnis bis zum laufenden Skript braucht es heute keine Build-Pipeline mehr. Drei Befehle, eine Datei.

mkdir hallo-js && cd hallo-js
npm init -y
# in package.json: "type": "module" ergänzen
echo 'console.log(`Hallo aus Node ${process.version}`);' > index.js
node index.js

Hallo aus Node v22.14.0

Wer schnell Top-Level await ohne package.json will, nutzt entweder die Datei-Endung .mjs oder das Flag --input-type=module für Inline-Code:

node --input-type=module -e "
const res = await fetch('https://api.github.com');
console.log(res.status);
"

200

Online-Spielwiesen

Wenn lokale Installation gerade keine Option ist — etwa beim Pair-Programming, im Workshop oder am fremden Rechner — gibt es 2026 mehrere ausgereifte Browser-Umgebungen.

• CodePen und JSFiddle sind klassische Frontend-Spielwiesen mit HTML/CSS/JS-Splitscreen, ideal für DOM-Experimente.
• CodeSandbox und StackBlitz bieten vollwertige Node-Container im Browser. StackBlitz nutzt dafür WebContainers, also ein WASM-Node, das ohne Server auskommt.
• Replit liefert eine vollwertige IDE inklusive Hosting und Datenbank — das Cloud-Pendant zu VS Code.
• Der Bun-Playground auf bun.com ist nützlich, um Bun-spezifische APIs ohne lokale Installation zu testen.

Für reine Sprach-Experimente ist die Browser-Console oft schneller als jede Online-IDE. Sobald aber package.json, mehrere Dateien oder Hot-Reload ins Spiel kommen, lohnt der Umstieg auf StackBlitz oder eine lokale Node-Installation.

Editor-Setup

VS Code ist der De-facto-Standard für JavaScript. Out of the box bringt es einen Node-Debugger, IntelliSense für Standardbibliothek und npm-Pakete sowie ein integriertes Terminal mit. Drei Erweiterungen lohnen den Tag-Eins-Aufwand: ESLint für statische Analyse, Prettier für konsistente Formatierung und Error Lens für inline angezeigte Fehler.

root = true

[*]
indent_style = space
indent_size = 4
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true

Eine .editorconfig im Projekt-Root sorgt dafür, dass Tab-Breite und Zeilenende über Editoren und Betriebssysteme hinweg gleich aussehen. Wer Type-Checks ohne TypeScript möchte, schreibt JSDoc-Kommentare und aktiviert in der jsconfig.json die Option "checkJs": true — VS Code zeigt dann die gleichen roten Schlangenlinien wie bei einem TS-Projekt, ohne dass eine .ts-Datei nötig wäre.

/**
 * @param {string} name
 * @param {number} [age]
 * @returns {string}
 */
function describe(name, age) {
    return age ? `${name} (${age})` : name;
}

Weiterführende Ressourcen

Externe Quellen

• Introduction – MDN JavaScript Guide
• Modules: ECMAScript modules – Node.js Docs
• Modules: CommonJS modules – Node.js Docs
• Node.js Releases & LTS-Schedule

Verwandte Artikel

• Was ist JavaScript?
• Strict Mode
• ECMAScript-Versionen
• ESM-Grundlagen
• CommonJS vs. ESM
• Variablen: var, let, const
• Common Snippets