---
title: מדריך Web Development
slug: Learn
translation_of: Learn
---
<div class="summary">
<p>ברוכים הבאים לאזור הלמידה של MDN. קבוצה זו של מאמרים שואפת לספק לאנשים חסרי רקע בתכנות את הכלים הדרושים על מנת להתחיל לפתח אתרי אינטרנט ויישומי אינטרנט..</p>

<p>מטרתו של אזור זה של MDN היא לא לקחת אתכם מ-"מתחילים" -"מומחה" אלא לקחת אתכם מ-"מתחילים" ל"נוח". משם אתם אמורים להיות מסוגלים להתקדם בכוחות עצמכם, ללמוד מיתר התכנים באתר שלנו ובאתרים אחרים.</p>

<p>אם אתם חסרי רקע לחלוטין בתכנות חשוב להבין ש-web development יכול להיות מאתגר - אנו נסייע כמה שניתן על מנת לספק מספיק פרטים כדי שתוכלו להרגיש בנוח וללמוד את הנושאים כראוי.</p>
</div>

<div class="warning">
<p><strong>חשוב</strong>: התוכן באיזור הלמידה מתעדכן באופן שוטף. אם יש לכם שאלות בנוגע לנושאים שאנו דנים בהם או שתרצו שנוסיף נושאים חדשים, הרגישו חופשי ליצור עמנו קשר ב {{anch("Contact us")}}</p>
</div>

<h2 id="היכן_להתחיל">היכן להתחיל?</h2>

<p>אנחנו רוצים לפגוש אותך היכן שאתה נמצא. מה מהתיאורים הבאים מתאים לך יותר?</p>

<ul class="card-grid">
 <li><span>מתחילים - הכרות ראשונית עם סביבת האינטרנט</span>

  <p>אם אתם חסרי רקע ב-web development אנחנו ממליצים לכם להתחיל עם מודול  <a href="/he/Learn/Getting_started_with_the_web">"מתחילים עם סביבת אינטרנט"</a> אשר מספק את כל הבסיס וההקדמה כדי ל-web development.</p>
 </li>
 <li><span>מתקדמים - הכרות עם HTML ו-CSS</span>
  <p>אם כבר יש לכם את ידע הבסיס, ואתם רוצים להתקדם ללמוד {{glossary("HTML")}} ו - {{glossary("CSS")}} יותר לעומק, אנו ממליצים לכם על סדרת המודולים בנושא <a href="https://developer.mozilla.org/he/docs/Learn/HTML">HTML</a> - וסדרת המודולים בנושא <a href="https://developer.mozilla.org/he/docs/Learn/CSS">CSS</a> שלנו. </p>
 </li>
 <li><span>מתקדמים - הכרות עם JavaScript</span>
  <p>אם אתם מרגישים כבר בנוח עם HTML ועם CSS, או אם אתם מעוניינים בעיקר ללמוד את שפת התכנות JavaScript, אנו ממליצים ללכת להתקדם לסדרת המודולים בנושא <a href="/he/docs/Learn/JavaScript">JavaScript — Dynamic client-side scripting</a> או ל-<a href="https://developer.mozilla.org/he/docs/Learn/Server-side">Server-side website programming</a>. אנחנו נשמח גם אם תסייעו להרחיב את <a href="/he/Learn/How_to_contribute">איזור הלמידה</a>. </p>
 </li>
 <li><span>Frameworks and tooling:</span>
  <p>לאחר שליטה בסיסית ב  HTML, CSS, ו JavaScript כדאי ללמוד על <a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools">client-side web development tools</a>, and then consider digging into <a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks">client-side JavaScript frameworks</a>, and <a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/Server-side">server-side website programming</a>. </p>
 </li>
</ul>

<div class="note">
<p><strong>הערה:</strong> ה<a href="/he/docs/Glossary">מילון </a>שלנו מכיל הסבר לכל מונח וביטוי. נסו להפיק ממנו את המירב.</p>
</div>

<p>{{LearnBox({"title":"Random glossary entry"})}}</p>

<h2 id="נושאי_הלימוד">נושאי הלימוד</h2>

<p>אלו הנושאים שנגע בהם באיזור הלימוד של MDN:</p>

<dl>
 <dt><a href="/he/docs/Learn/Getting_started_with_the_web">תחילת הדרך עם ה-Web</a></dt>
 <dd>מספק הכרות בסיסית ומעשית לפיתוח אינטרנט עבור מתחילים וחסרי רקע.</dd>
 <dt><a href="/en-US/docs/Learn/HTML">HTML - בונים את האינטרנט </a></dt>
 <dd>HTML זו השפה שבה אנחנו משתמשים על מנת לתת מבנה לתוכן שלנו ולהגדיר מה המשמעות שלהם או מטרתם. נושא זה מלמד את שפת HTML לעומק.  </dd>
 <dt><a href="/he/docs/Learn/CSS">CSS - מעצבים את האינטרנט</a></dt>
 <dd>CSS היא השפה שאנחנו משתמשים בה על מנת לעצב את התוכן שלנו ועל מנת לפרוס את התוכן שלנו באתר, כמו גם להוסיף הנפשות ואנימציות שונות. נושא זה מלמד היבטים רבים של שפת CSS והכלים העומדים לרשותנו. </dd>
 <dt><a href="/he/docs/Learn/JavaScript">JavaScript - תכנות צד לקוח </a></dt>
 <dd>JavaScript היא שפת תכנות דינאמית אשר משמשת על מנת להוסיף פונקציונליות דינאמית לאתרי אינטרנט. נושא זה מלמד את כל הכלים והנושאים הנדרשים על מנת להבין ולכתוב בשפת  JavaScript.</dd>
 <dt><a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/Forms">Web forms — Working with user data</a></dt>
 <dd>Web forms are a potent tool for interacting with users — most commonly, they are used for collecting data from users, or allowing them to control a user interface. In the articles listed below, we'll cover all the essential aspects of structuring, styling, and interacting with web forms.</dd>
 <dt><a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/Accessibility">נגישות אתרים</a></dt>
 <dd>נגישות אתרים זה מושג המאגד בתוכו מספר פרקטיקות מקובלות אשר מטרתן היא להפוך את התוכן ברשת לנגיש עבור כמה שיותר אנשים, ללא השפעה של מוגבלות פיזית, סוג המכשיר, מיקום וגורמים נוספים. נושא זה נוגע בכל מה שאתם צריכים לדעת בנושא.</dd>
 <dt><a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/Performance">Web Performance - הפיכת האתר למהיר ורספונסיבי</a></dt>
 <dd>ביצועים זו האמנות של הפיכת אתרי אינטרנט ויישומים מבוססי web למהירים ורספונסיביים לאינטראקציות של המשתמש, ללא השפעה של מהירות הגלישה של המשתמש, גודל המסך, הגבלות מכשיר וכד׳. </dd>
 <dt><a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/Tools_and_testing">כלים ובדיקות</a></dt>
 <dd>נושא זה מכסה את כל הכלים שמפתחים צריכים על מנת לבחון ולבדוק את הפיתוח שלהם. </dd>
 <dt><a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/Server-side">תכנות צד-שרת</a></dt>
 <dd>גם אם אתם מתרכזים בפיתוח צד-לקוח, יהיה זה שימושי והכרחי מאוד עבורכם להבין מהם שרתים ומהו קוד של צד השרת וכיצד הם עובדים יחד. נושא זה מעניק הכרות כללית כיצד צד השרת עובד, ומדריכים מפורטים המראים כיצד לבנות יישום צד שרת באמצעות שתי פריימוורקים פופולרים - Django (Python) and Express (node.js). </dd>
</dl>

<h2 id="דוגמאות_הקוד_שלנו">דוגמאות הקוד שלנו</h2>

<p>כל דוגמאות הקוד שלנו זמינים כמובן גם ב-<a href="https://github.com/mdn/learning-area/">GitHub</a>. אם תרצו להוריד עותק מרוכז שלהם למחשב, תוכלו להוריד <a href="https://github.com/mdn/learning-area/archive/master.zip">קובץ ZIP</a> מרוכז.</p>

<p>אם אתם מעדיפים להעתיק את המאגר בדרך יותר מורכבת אך מאפשרת לכם לקבל עדכונים אוטומטיים לדוגמאות הקוד, ראו ההסבר בשפה האנגלית <a href="https://developer.mozilla.org/en-US/docs/Learn">פה</a>. </p>

<h2 id="צרו_עמנו_קשר">צרו עמנו קשר</h2>

<p>אם תרצו ליצור עמנו קשר בכל נושא, הדרך הטובה ביותר היא ב-<a href="https://discourse.mozilla-community.org/t/learning-web-development-marking-guides-and-questions/16294">learning area discourse thread</a> או בערוצי ה-<a href="https://developer.mozilla.org/en-US/docs/MDN/Community/Conversations#Chat_in_IRC">IRC</a>. היינו רוצים לשמוע האם לדעתכם חסר משהו באתר, או נושא לא מוסבר לעומק או לא ברור וכמובן אם מצאתם שגיאה. כמובן, הרגישו חופשי לפנות בכל שאלה או בעיה. </p>

<p>אם אתם מעוניינים לעזור ולפתח את התוכן פה באתר שלנו שלנו, ראו את המאמר בנושא <a href="/e he/Learn/How_to_contribute">how you can help</a> וצרו עמנו קשר. אנחנו יותר מנשמח לדבר אתכם בנושא בין אם אתם סטודנטים, מורים, מפתחים מנוסים או סתם בא לכם לעזור לשפר את חווית הלמידה של הגולשים באתר.</p>

<h2 id="ראו_גם">ראו גם</h2>

<dl>
 <dt><a href="https://www.mozilla.org/en-US/newsletter/developer/">Mozilla developer newsletter</a></dt>
 <dd>הניוזלטר שלנו למפתחי Web - מקור מידע מעולה לכל רמות הניסיון. </dd>
 <dt><a href="https://www.youtube.com/playlist?list=PLo3w8EB99pqLEopnunz-dOOBJ8t-Wgt2g">Web demystified</a></dt>
 <dd>סדרה מצויינת של סרטוני וידאו המסבירה את הבסיס של פיתוח Web, נועדה בעיקר לחסרי רקע. נוצרה על ידי  <a href="https://twitter.com/JeremiePat">Jérémie Patonnier</a>.</dd>
 <dt><a href="https://www.codecademy.com/">Codecademy</a></dt>
 <dd>אתר אינטראקטיבי מעולה ללימוד שפות תכנות מהבסיס.</dd>
 <dt><a href="https://code.org/">Code.org</a></dt>
 <dd>אתר בסיסי לתכנות אשר נועד בעיקר לחסרי רקע/ילדים.</dd>
 <dt><a href="https://www.freecodecamp.org/">freeCodeCamp.org</a></dt>
 <dd>אתר אינטראקטיבי מעולה ללימוד פיתוח Web.</dd>
 <dt><a href="https://learning.mozilla.org/activities">Teaching activities</a></dt>
 <dd>A series of teaching activities for teaching (and learning) created by the Mozilla Foundation, covering everything from basic web literacy and privacy to JavaScript and hacking Minecraft.</dd>
 <dt><a href="https://edabit.com/">Edabit</a></dt>
 <dd>Hundreds of free interactive coding challenges in various languages.</dd>
</dl>