Webentwicklung lernen
Willkommen bei MDN Webentwicklung Lernen (auch bekannt als Learn). Diese Ressource bietet eine strukturierte Reihe von Tutorials, die die wesentlichen Fähigkeiten und Praktiken lehren, um ein erfolgreicher Front-End-Entwickler zu werden, sowie Herausforderungen und weitere empfohlene Ressourcen.
Über Webentwicklung lernen
-
Lehrt die wesentlichen Fähigkeiten und Kenntnisse, die jeder Front-End-Entwickler für den beruflichen Erfolg und die Relevanz in der Branche benötigt, wie im MDN-Curriculum definiert.
-
Erstellt von der MDN-Community und verfeinert durch Erkenntnisse von Studenten, Lehrern und Entwicklern aus der breiteren Web-Community.
-
Entwickelt, um Sie von "Anfänger" zu "komfortabel" zu bringen (nicht von "Anfänger" zu "Experte"), und Ihnen genug Wissen zu vermitteln, um fortgeschrittenere Ressourcen nutzen zu können (wie den Rest von MDN).
Hinweis: Zuletzt aktualisiert: August 2025 (Änderungsprotokoll anzeigen).
Wissen Sie nicht, wo Sie anfangen sollen?
- Noch nie programmiert?
-
Unsere Einführungsmodule bieten Einführungstutorials und wesentliche Konzepte sowie Hintergrundinformationen für komplette Anfänger. Sie sollten hier beginnen, wenn Sie ein kompletter Anfänger sind (d.h. wenn Sie noch keinen Code-Editor installiert oder Code geschrieben haben).
- Möchten Sie die Grundlagen meistern?
-
Unsere Kernmodule bieten eine strukturierte Reihe von Tutorials, die die wesentlichen Fähigkeiten und Praktiken für einen erfolgreichen Front-End-Entwickler lehren.
- Über die Grundlagen hinaus?
-
Unsere Erweiterungsmodule decken nützliche zusätzliche Fähigkeiten ab, die Sie lernen können, wenn Sie beginnen, Ihr Wissen zu erweitern und sich zu spezialisieren. Gehen Sie zu diesen über, nachdem Sie unsere Kernmodule abgeschlossen haben.
- Arbeiten Sie an einer Schule?
-
Nutzen Sie unsere Module, um Ihren Unterricht zu leiten. Schauen Sie sich unsere Lehrerseite für weitere Ideen an oder melden Sie Ihre Schüler im Scrimba Frontend Developer Career PathMDN Lernpartner an.
Testen Sie Ihre Fähigkeiten
Im Verlauf des Kurses finden Sie mehrere Artikel, die Ihnen helfen sollen, einzuschätzen, ob Sie verstanden haben, was wir Ihnen im Kurs beibringen. Es gibt zwei Arten:
- "Testen Sie Ihre Fähigkeiten"-Artikel kommen häufiger vor und prüfen Ihr Wissen über ein einzelnes isoliertes Merkmal wie HTML-Links, das CSS-Boxmodell oder JavaScript-Funktionen.
- "Herausforderungen" treten seltener auf und testen Ihre Fähigkeit, mehrere Funktionen zusammen zu nutzen, um eine vollständige Website oder ein Programm irgendeiner Art zu erstellen.
Die meisten Fragen enthalten HTML/CSS/JavaScript-Codeblöcke, die den Ausgangscode für jede Aufgabe zeigen. Der empfohlene Weg, jede Aufgabe abzuschließen, ist, die "Play"-Taste in einem der Codeblöcke zu drücken, um das Beispiel im MDN Playground zu öffnen und dann den Code gemäß den Anweisungen der Frage zu bearbeiten.
Wenn Sie einen Fehler machen, können Sie Ihre Arbeit mit der Schaltfläche "Zurücksetzen" im MDN Playground löschen. Wenn Sie wirklich feststecken, können Sie (normalerweise) die Lösung am Ende jedes Abschnitts einsehen oder um Hilfe bitten.
Hinweis: Wenn Sie lieber in Ihrem eigenen Editor oder in einem Online-Editor (wie CodePen oder JSFiddle) arbeiten möchten, können Sie den Code aus dem MDN Playground in Ihre gewählte Umgebung kopieren.
Einige Fragen enthalten keine Codeblöcke, von denen aus gestartet werden kann, und fordern Sie stattdessen auf, Starterdateien herunterzuladen, um auf Ihrer lokalen Maschine zu arbeiten. Manchmal liegt das an der komplexen Natur der Frage, und manchmal wollten wir einfach ein bisschen Abwechslung einbringen.
Unsere Codebeispiele bekommen
Die Codebeispiele, die Sie im Lernbereich antreffen werden, sind alle auf GitHub verfügbar:
- Der einfachste Weg, sie zu bekommen, ist, ein ZIP der neuesten Hauptcode-Zweigstelle herunterzuladen.
- Wenn Sie mit Git und GitHub vertraut sind, könnten Sie auch wählen, das Repository zu klonen.
Kontaktieren Sie uns
Wenn Sie mit uns über etwas in Kontakt treten möchten, nutzen Sie die Kommunikationskanäle. Wir würden gerne von Ihnen hören über alles, was Sie an der Seite für falsch oder fehlend halten, Anfragen für neue Lernthemen, Anfragen für Hilfe mit Gegenständen, die Sie nicht verstehen, oder andere Fragen oder Bedenken.
Wenn Sie daran interessiert sind, Inhalte zu entwickeln oder zu verbessern, schauen Sie sich an, wie Sie helfen können und treten Sie in Kontakt! Wir sprechen gerne mit Ihnen, egal ob Sie Lerner, Lehrer, erfahrener Webentwickler oder jemand anderes sind, der daran interessiert ist, das Lernerlebnis zu verbessern.
Siehe auch
- The Frontend Developer Career Path MDN Lernpartner
-
Scrimba's Frontend Developer Career Path lehrt alles, was Sie wissen müssen, um ein kompetenter Front-End-Webentwickler zu werden, mit unterhaltsamen interaktiven Lektionen und Herausforderungen, kompetenten Lehrern und einer unterstützenden Community. Gehen Sie von null bis zu Ihrem ersten Front-End-Job! Viele der Kurskomponenten sind als eigenständige kostenlose Versionen verfügbar.
- Codecademy
-
Eine großartige interaktive Seite, um Programmiersprachen von Grund auf zu lernen.
- freeCodeCamp.org
-
Interaktive Seite mit Tutorials und Projekten zum Erlernen der Webentwicklung.
- Learn JavaScript
-
Eine ausgezeichnete Ressource für angehende Webentwickler – Lernen Sie JavaScript in einer interaktiven Umgebung, mit kurzen Lektionen und interaktiven Tests, geführt von automatisierten Bewertungen. Die ersten 40 Lektionen sind kostenlos, und der vollständige Kurs ist gegen eine kleine einmalige Zahlung verfügbar.