Vorstellungsgespräch für Frontend-Entwickler: Fragen, Antworten und Vorbereitung

Ein Frontend-Interview unterscheidet sich von anderen technischen Interviews: Hier wird nicht nur API-Wissen geprüft, sondern auch, wie Sie über den Nutzer denken. Dieselbe Komponente lässt sich auf drei Arten schreiben – und die Frage „Warum genau so?“ wiegt mehr als die Implementierung selbst.

Woraus ein Frontend-Interview besteht

Meist sind es vier Phasen, und jede erfordert eine eigene Vorbereitung:

Phase	Was geprüft wird	Wie man sich vorbereitet
Screening mit dem Recruiter	Erfahrung, Motivation, Gehaltsvorstellungen	drei Sätze über sich selbst + Gehaltsspanne
Technisches Interview	JavaScript, CSS, Browser, Framework	Besprechung der Fragen unten
Live Coding	wie Sie Code schreiben und argumentieren	den Lösungsweg laut durchsprechen
Systemdesign / Architektur	wie Sie Interface und Zustand entwerfen	die Antwort strukturieren: Kontext → Optionen → Auswahl

Welche Fragen werden am häufigsten gestellt

1. „Erzählen Sie von einem Projekt, auf das Sie stolz sind“

Hier wird nicht der Umfang geprüft, sondern Ihre Rolle. Schlecht: „Wir haben das Frontend auf React umgeschrieben“. Gut: „Ich war für die Migration auf die neue API verantwortlich – ich musste die Kompatibilität aufrechterhalten, hier ist, wie ich es gemacht habe und was es laut den Metriken gebracht hat“.

2. Über JavaScript und den Browser

Typisches Set: Event Loop, Promises versus async/await, Event-Bubbling, Delegation, `this`, Closures, Unterschiede zwischen `var`/`let`/`const`, Unterschied zwischen Kopieren per Referenz und per Wert. Erwartet wird keine Definition, sondern ein Anwendungsbeispiel.

3. Über CSS und Layout

Flexbox versus Grid, Spezifität von Selektoren, wie `position: sticky` funktioniert, was Margin Collapse ist, wie Responsivität ohne Media Queries umgesetzt wurde. Geprüft wird die Fähigkeit zu erklären, nicht die Syntax auswendig zu kennen.

4. Über React (oder Ihr Framework)

Unterschied zwischen State und Props, wozu Keys in Listen dienen, was ein Re-Render ist und wie man ihn vermeidet, `useEffect` und seine Abhängigkeiten, Memoisierung, Context versus State-Manager. Häufig wird darum gebeten, einen Fehler in einem Codefragment zu finden.

5. Über Performance

Was sind Core Web Vitals, wie misst man LCP und CLS, was tun mit überflüssigem JS im Bundle, wozu Code Splitting und Lazy Loading, wie funktioniert Caching. Hier ist es wichtig, konkrete Tools zu nennen: Lighthouse, Performance API, Chrome DevTools.

6. Über Barrierefreiheit und UX

Semantische Tags, ARIA, Fokus und Tastaturnavigation, Kontrast. Eine Ausschlussfrage für viele Kandidaten.

7. „Wie arbeiten Sie mit dem Design in Figma?“

Geprüft wird, ob Sie Zustände sehen können (zum Beispiel Hover, Disabled, fehlende Daten) und nicht nur das perfekte Layout.

Wie Sie antworten, damit Ihre Antwort professionell klingt

Bei technischen Fragen funktioniert dieselbe Struktur wie bei Verhaltensfragen: These → Begründung → Beispiel → Einschränkung. Der letzte Schritt wird am häufigsten vergessen, und genau er unterscheidet Senior von Middle.

«Für diesen Fall würde ich Listen-Virtualisierung verwenden. Der Grund — das DOM verkraftet keine zehntausend Knoten: Beim Scrollen kommt es zu Einbrüchen. In einem früheren Projekt haben wir dadurch die Zeit bis zur Interaktivität um etwa das Dreifache verkürzt. Einschränkung: Virtualisierung funktioniert schlecht bei variabler Zeilenhöhe — dann ist eine Messung nötig».

Beachten Sie: Es gibt eine Lösung, einen Grund, ein konkretes Ergebnis und eine ehrliche Grenze der Anwendbarkeit. Eine solche Antwort kann man nicht «auswendig lernen» — aber man kann sie einüben.

Was beim Live Coding zu tun ist

• Sprechen Sie Ihre Gedanken laut aus. Ein schweigender Kandidat wird niedriger bewertet, selbst wenn der Code richtig ist.
• Beginnen Sie mit Rückfragen. Grenzfälle, Datenformat, Leistungsgrenzen.
• Zuerst eine funktionierende Lösung, dann Optimierung. Versuchen Sie nicht, sofort perfekt zu schreiben.
• Gestehen Sie Sackgassen ein. «Hier stecke ich fest, lassen Sie uns das klären» — eine normale Reaktion; Schweigen ist schlimmer.

Vorbereitungsplan für eine Woche

Tag	Was zu tun ist	Zeit
1	Notieren Sie Ihre 5 Projekte: Rolle, Aufgabe, Ergebnis in Zahlen	40 Min.
2	Gehen Sie die 7 oben genannten Themen durch und markieren Sie, wo die Antwort nicht stimmig ist	40 Min.
3	Beantworten Sie 10 Fragen laut und nehmen Sie sich mit einem Diktiergerät auf	30 Min.
4	Aufnahme analysieren: Wo sind Pausen, wo geht die Struktur verloren	20 Min.
5	Einen vollständigen Dialog mit dem KI-Trainer zu Ihrer Stellenausschreibung durchspielen	30 Min.
6–7	Problematische Antworten wiederholen, den Durchlauf wiederholen	20 Min.

Was von der Vorbereitung zu erwarten ist und was nicht

Was sich ändert: die Geschwindigkeit beim Zusammenbau der Antwort, die Fähigkeit, bei einer unerwarteten Frage die Struktur nicht zu verlieren, die Fähigkeit, die Grenzen der eigenen Lösung zu benennen. Das fällt bereits nach drei bis vier Durchläufen auf.

Was es nicht geben wird: Vorbereitung ersetzt kein Wissen über die Technologie. Wenn Sie den event loop nicht verstehen, hilft eine schöne Antwortstruktur nicht. Zuerst kommt das Wissen, dann die Fähigkeit, es zu vermitteln.

Häufige Fragen

Wie viel Zeit braucht man für die Vorbereitung auf ein Frontend-Interview?

Wenn die technische Basis vorhanden ist — eine Woche mit 30–40 Minuten pro Tag: Struktur der Antworten, lautes Durchsprechen, ein vollständiger Durchlauf des Dialogs. Wenn die Basis bei einem bestimmten Thema Lücken hat (zum Beispiel Event Loop oder CSS-Kaskade), schließen Sie diese zuerst, sonst hilft die Antwortstruktur nicht.

Werden in Frontend-Interviews Algorithmen abgefragt?

Hängt vom Unternehmen ab: In Produktteams werden eher praktische Aufgaben gestellt (eine Komponente schreiben, einen Bug analysieren), in großen Tech-Unternehmen — klassische Algorithmen. Klären Sie das Format vorab beim Recruiter — das ist eine normale Frage.

Was tun, wenn ich die Antwort auf eine technische Frage nicht weiß?

Sagen Sie es direkt und zeigen Sie, wie Sie suchen würden: „Ich habe damit nicht direkt gearbeitet, aber die Logik ähnelt X — ich würde es in der Dokumentation und an einem Prototyp prüfen.“ Das wird höher bewertet als eine erfundene Antwort: Der Interviewer sieht fast immer, wenn ein Kandidat ins Schwimmen gerät.

Muss man Live Coding separat vorbereiten?

Ja, das ist eine eigenständige Fähigkeit. Üben Sie, die Lösung laut auszusprechen, Code in einem Editor ohne Autovervollständigung zu schreiben und mit klärenden Fragen zu beginnen. Selbst ein sicherer Entwickler verliert ohne diese Übung in der ersten Session den Faden.

Wie beantwortet man Fragen zu Gehaltsvorstellungen?

Nennen Sie eine Bandbreite statt einer einzelnen Zahl und orientieren Sie sich am Markt. Wie das ohne Peinlichkeit geht, wird im Artikel Gehaltsverhandlungen.

Wie trainiert man ein Vorstellungsgespräch mit KI?

Beschreiben Sie die Situation in einem Satz — «Vorstellungsgespräch für einen Frontend-Entwickler, React, drei Jahre Erfahrung» — und führen Sie den Dialog im Simulator. Der Trainer stellt Fragen zu Ihrer Rolle und bespricht die Antworten nach dem Gespräch.

Wie geht es weiter

Beginnen Sie mit fünf Projekten: Rolle, Aufgabe, Ergebnis in Zahlen. Führen Sie dann den vollständigen Dialog durch — öffnen Sie HintMeTalk AI, Modus „Trainer“, beschreiben Sie die Situation. Nach der Auswertung wird sichtbar, welche Antworten schwach sind: meist sind es zwei bis drei von zehn, und genau sie entscheiden den Ausgang.

Allgemeine Prinzipien der Vorbereitung auf jedes Vorstellungsgespräch — im Artikel Vorbereitung auf das Vorstellungsgespräch. Und wenn ein Gespräch über Geld bevorsteht — Gehaltsverhandlungen.