1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
|
---
title: Lerne Webentwicklung
slug: Learn
tags:
- Anfänger
- Beginner
- Index
- Internet
- Landing
- Lernen
- Web
translation_of: Learn
---
<div class="summary">
<p><strong>Willkommen im MDN Lernbereich!</strong><br>
Mit dieser Artikelreihe können Sie es vom Anfänger zum Webentwickler schaffen. Alles was sie brauchen, um einfache Webseiten zu coden, finden Sie hier.</p>
</div>
<p>{{LearnSidebar}}</p>
<p>Das Ziel dieser Artikelserie ist es, Sie von "Beginner" zum "Könner" Level zu bringen. Ein "Experte" werden Sie erst durch viel Übung an eigenen Projekten, wobei MDN immer eine wertvolle Ressource für Sie sein wird.</p>
<p>Wenn Sie ein kompletter Anfänger sind, kann Webentwicklung eine schwere Herausforderung sein - wir werden behilflich "Ihre Hand halten" auf dem Weg zum echten Mozilla Webentwickler. Alle können sich hier daheim fühlen, egal ob sie Student sind, der Webentwicklung lernt (autodidaktisch oder innerhalb eines Kurses), ein Lehrer der nach Unterrichtsmaterial sucht, jemand der seinem Hobby nachgeht oder jemand der mehr über die Technologien, welche das Internet zusammenhalten, wissen möchte.</p>
<div class="warning">
<p><strong>Wichtig:</strong> Der Lernbereich wird ständig erweitert. Die Deutsche Übersetzung ist noch nicht vollständig, daran wird aber gearbeitet. Wenn Sie Fragen zu den Themen haben, dann {{anch("Kontaktieren Sie uns")}}.</p>
</div>
<h2 id="Was_gibts_neues">Was gibt's neues?</h2>
<p>Der Lernbereich wird regelmäßig von uns erweitert. Damit ihr auf dem neusten Stand bleibt, werden alle Neuerungen <a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/Release_notes">hier</a> erfasst. Guckt also gerne später nochmal vorbei!</p>
<p>Wenn ihr Fragen zu Themen habt, die hier nicht oder eurer Meinung nach nur unvollständig beschrieben sind, dann schreibt uns eine Nachricht im <a href="https://discourse.mozilla.org/c/mdn/236">Discourse forum</a>.</p>
<h3 id="Ihr_wollt_ein_Front-end_Web_Entwickler_werden">Ihr wollt ein Front-end Web Entwickler werden?</h3>
<p>Wir haben alle grundlegenden Informationen in einem weiteren Kurs zusammengefasst, damit du alles hast, um dein Ziel zu erreichen.</p>
<h2 id="Wo_anfangen">Wo anfangen</h2>
<p>Wir möchten mit Ihnen auf einen Nenner kommen. Welche Beschreibung trifft am ehesten auf Sie zu?</p>
<ul class="card-grid">
<li><span>Ich bin Anfänger</span>
<p>Herzlich Willkommen! Am besten fangen Sie mit unserer Serie <a href="/de/Learn/Getting_started_with_the_web">"Lerne das Internet kennen" </a>an. Hier erfahren Sie alles über die Grundlagen, welche Sie zum Einstieg in die Webentwicklung brauchen.</p>
</li>
<li><span>Ich kenne das Web</span>
<p>Sehr gut! In dem Fall können Sie sich die wichtigsten Webtechnologien genauer anschauen: <a href="/de/docs/Learn/HTML">HTML</a>, <a href="/de/docs/Learn/CSS">CSS</a> und <a href="/de/docs/Learn/JavaScript">JavaScript</a>.</p>
</li>
<li><span>Ich habe das Web gemeistert.</span>
<p>Großartig! Dann sind Sie möglicherweise an unseren fortgeschrittenen <a href="/en-US/docs/Web/Guide">Guides</a> und <a href="/en-US/docs/Web/Tutorials">Tutorials</a> interessiert. Vielleicht möchten Sie auch selbst <a href="/en-US/Learn/How_to_contribute">zum MDN Lernbereich beitragen</a> ;-)</p>
</li>
</ul>
<div class="note">
<p><span id="result_box" lang="en"><span class="hps">Hinweis:</span> <span class="hps">Wir werden immer mehr Lernmaterial veröffentlichen</span><span class="hps">,</span> <span class="hps">beispielsweise</span> <span class="hps">für erfahrene</span> <span class="hps">Programmierer</span> <span class="hps">zu </span><span class="hps">spezifische</span>n <span class="hps">fortgeschrittenen Techniken</span><span>,</span> <span class="hps">native</span> <span class="hps">Entwickler, die</span> <span class="hps">neu auf dem</span> <span class="hps">Web</span> <span class="hps">sind, oder</span> <span class="hps">Menschen, die</span> <span class="hps">Design-Techniken</span> <span class="hps">lernen wollen</span><span>.</span></span></p>
</div>
<p>{{LearnBox({"title":"Schnell lernen: Vokabular"})}}</p>
<h2 id="Unsere_Themen">Unsere Themen</h2>
<p>Hier ist eine Liste mit unseren Artikelreihen.</p>
<dl>
<dt><a href="/de/docs/Learn/Getting_started_with_the_web">Lerne das Internet kennen</a></dt>
<dd>Gibt eine grundlegende Einführung in Webentwicklung für Anfänger.</dd>
<dt><a href="/de/docs/Learn/HTML">HTML - Webseiten strukturieren</a></dt>
<dd>Hier wird Ihnen die jeder Webseite zugrunde liegende Sprache beigebracht. HTML ist dazu da Webseiten ein Grundgerüst und Struktur zu geben.</dd>
<dt><a href="/de/docs/Learn/CSS">CSS - Webseiten designen</a></dt>
<dd>CSS ist die Sprache, die wir benutzen, um einer Webseite einen bestimmten Stil zu geben. Farben, Schriftarten und die Position eines Elements auf der Webseite, das alles und mehr kann man mit CSS bestimmen. In diesem Bereich lernen sie grundlegendes CSS.</dd>
<dt><a href="/de/docs/Learn/JavaScript">JavaScript - dynamische, benutzerseitige Skriptsprache</a></dt>
<dd>JavaScript ist die Skriptsprache des Internets. Sie wird benutzt um einer Webseite dynamischen Inhalt hinzuzufügen. In dieser Artikelreihe lernen Sie die Grundlagen von JavaScript.</dd>
<dt><a href="/de/docs/Learn/Accessibility">Barrierefreiheit - Mache das Internet für jeden zugänglich</a></dt>
<dd>Barrierefreiheit - hier geht es darum das Internet für alle Zugänglich zu machen, ob für Menschen mit Behinderungen oder für einen mobilen Zugang oder andere Zugangsmöglichkeiten. Diese Artikel geben Ihnen einiges Wissen an die Hand, wie Sie die Zugänglichkeit Ihrer Webseite erhöhen können.</dd>
<dt><a href="/de/docs/Learn/Tools_and_testing">Werkzeuge und Tests</a></dt>
<dd>Hier werden verschiedene Werkzeuge für Webentwickler vorgestellt, zum Beispiel Werkzeuge, um eine Webseite in verschiedenen Browsern zu testen.</dd>
<dt><a href="/de/docs/Learn/Server-side">Serverseitige Webseitenprogrammierung</a></dt>
<dd>Selbst wenn Sie sich auf die benutzerseitige Webseitenentwicklung spezialisiert haben, ist es sinnvoll ein grundlegendes Verständinis für serverseitige Programmierung zu besitzen. Dieses Thema gibt Ihnen eine Einführung darin, wie serverseitige Programmiersprachen funktionieren. Es gibt detailierte Anleitungen für zwei populäre Frameworks, für Django (Python) und Express (node.js).</dd>
</dl>
<h2 id="Wie_kommen_Sie_an_unsere_Code-Beispiele">Wie kommen Sie an unsere Code-Beispiele?</h2>
<p>Die Code-Beispiele, welche sie in unserem Lernbereich finden sind alle über <a href="https://github.com/mdn/learning-area/">Github</a> zugänglich. Sie können diese auf Ihren eigenen Computer kopieren, um mit diesen zu üben.</p>
<h2 id="Kontaktieren_Sie_uns">Kontaktieren Sie uns</h2>
<p>Der gesamte Lernbereich wurde von unseren Freiwilligen erstellt. Wir brauchen Sie in unserem Team, egal ob Sie Anfänger, Lehrer oder ein erfahrener Webentwickler sind. Falls Sie Interesse haben am MDN-Projekt mitzuwirken, dann können Sie und über unsere <a href="/en-US/docs/MDN/Community#Join_our_mailing_lists">Mailing-Listen</a> oder den <a href="/en-US/docs/MDN/Community#Get_into_IRC">IRC Channel</a> erreichen. :)</p>
<h2 id="Weiteres">Weiteres</h2>
<dl>
<dt><a href="https://www.mozilla.org/en-US/newsletter/developer/">Mozilla Developer Newsletter</a></dt>
<dd>Unser Newsletter für Webentwickler. (in Englisch)</dd>
</dl>
<dl>
<dt><a href="https://www.codecademy.com/">Codecademy</a></dt>
<dd>Eine gute, interaktive Webseite, um Programmiersprachen und Webentwicklung zu lernen. (in Englisch)</dd>
<dt><a href="https://code.org/">Code.org</a></dt>
<dd>Für Schüler und Lehrer gedacht.(teilweise in Deutsch)</dd>
<dt><a href="https://www.freecodecamp.com/">freeCodeCamp.com</a></dt>
<dd>Interaktive Seite mit Tutorials und Projekten zum Thema coden. (auf Englisch)</dd>
</dl>
<p><strong><a href="https://edabit.com/challenges">Edabit</a></strong><br>
Tausende interaktive JavaScript-Herausforderungen.</p>
|
