Ressourcen
Hier findest du eine kuratierte Liste an Lernmaterialien. Egal ob du lieber liest, Videos schaust oder interaktiv lernst.
Deutsche Ressourcen
Section titled “Deutsche Ressourcen”Perfekt für den Einstieg, wenn du dich erstmal auf die Konzepte und nicht auf die Sprache konzentrieren willst.
MDN Web Docs (Deutsch) Die Bibel der Webentwicklung. Hier schaust du nach, wie ein HTML-Tag oder CSS-Befehl funktioniert.
ProgrammierenLernen.de Gute Einsteiger-Tutorials für HTML, CSS und JavaScript.
SELFHTML Wiki Der Klassiker. Ein riesiges Wiki zu allen Web-Themen.
The Morpheus Tutorials (YouTube) Deutscher YouTube-Kanal mit sehr tiefgehenden Erklärungen zu Informatik-Grundlagen, Python, JS und mehr.
Englische Ressourcen (Empfohlen)
Section titled “Englische Ressourcen (Empfohlen)”Die Tech-Welt spricht Englisch. Je früher du dich daran gewöhnst, desto besser. Die englischen Ressourcen sind meist aktueller und umfangreicher.
freeCodeCamp DER Ort um Code zu lernen. Interaktive Kurse, bei denen du direkt im Browser programmierst. Sehr zu empfehlen!
The Odin Project Ein kompletter Open-Source Lehrplan für Fullstack Webentwicklung. Bringt dir alles von Git bis React bei.
W3Schools Super zum schnellen Nachschlagen von Syntax mit 'Try it yourself' Editor.
JavaScript.info Sehr detailliertes, modernes Tutorial für JavaScript. Geht tief ins Detail.
YouTube Kanäle (Englisch)
Section titled “YouTube Kanäle (Englisch)” Traversy Media Crash Kurse zu fast allem (HTML, CSS, JS, Node, React, PHP...).
Kevin Powell Der CSS-König. Wenn du CSS wirklich verstehen willst, schau hier rein.
Fireship Kurze, schnelle Videos (100 Seconds of Code), die neue Technologien erklären. Sehr unterhaltsam.
Web Dev Simplified Erklärt komplexe Konzepte sehr einfach und verständlich.
Tools & Editor
Section titled “Tools & Editor”Das Werkzeug ist genauso wichtig wie das Handwerk.
Visual Studio Code Der Standard-Editor für Webentwicklung. Kostenlos, schnell und extrem erweiterbar.
Git & GitHub Versionskontrolle ist Pflicht. Hier ist das offizielle Buch (Pro Git) auf Deutsch.
Chrome DevTools Lerne, wie du deine Webseite direkt im Browser untersuchst und debuggst.
Design Ressourcen
Section titled “Design Ressourcen”Auch wenn du kein Designer bist, muss deine Seite gut aussehen.
- Google Fonts - Tausende kostenlose Schriftarten.
- FontAwesome - Die Standard-Bibliothek für Icons.
- Coolors.co - Generiere passende Farbpaletten für deine Projekte.
- Undraw - Kostenlose Open-Source Illustrationen für deine Webseite.
- Unsplash - Hochwertige, kostenlose Stock-Fotos.
Spielerisch Lernen
Section titled “Spielerisch Lernen”Coden muss nicht trocken sein.
- Flexbox Froggy - Lerne CSS Flexbox, indem du Frösche platzierst.
- Grid Garden - Lerne CSS Grid, indem du einen Garten bewässerst.
- Exercism - Löse kleine Algorithmus-Rätsel in verschiedenen Sprachen (Mentoren-Feedback inklusive).
- Codewars - Trainiere deine Logik mit kleinen “Katas” (Übungsaufgaben).