---
title: آموزش وب
slug: Learn
tags:
  - Beginner
  - Index
  - Landing
  - Learn
  - NeedsTranslation
  - TopicStub
  - Web
  - آموزش
  - ترجمه
  - رایگان
  - طبقه بندی
  - مقدماتی
  - وب
translation_of: Learn
---
<dl>
 <dt>{{LearnSidebar}}</dt>
</dl>

<div class="summary" dir="rtl">
<p>به منطقۀ آموزشی MDN خوش آمدید. با کمک این مجموعه مقالات می‌توانید توسعۀ وب را از سطوح بسیار مقدماتی و به همراه هر آنچه که برای کدنویسی یک وب سایت ساده نیاز دارید یاد بگیرید.</p>
</div>

<p dir="rtl">هدف MDN تبدیل شما از یک "مبتدی" به یک "متخصص" نیست ولی قطعاً شما را از یک "مبتدی" به یک سطح "قابل قبول" می‌رساند. بعد از آن باید بتوانید راه خود را تعیین کنید، آموزش‌های <a href="https://developer.mozilla.org/en-US/">the rest of MDN</a> و دیگر منابعی که سطح متوسط به پیشرفته در نظر گرفته شده است را دنبال کنید که دانش قبلی زیادی را طلب می‌کند.</p>

<p dir="rtl">اگر کاملاً مبتدی هستید، توسعۀ وب می‌تواند چالش خوبی باشد — ما دستتان را خواهیم گرفت و آن‌قدر اطلاعات در اختیارتان قرار می‌دهیم تا به احساس راحتی برسید و تمامی مباحث را به خوبی یاد بگیرید. باید حس کنید که در خانه هستید، خواه یک دانشجو باشید که می‌خواهد توسعۀ وب یاد بگیرد (به صورت شخصی یا قسمتی از یک کلاس)، معلمی که برای کلاس‌های خود مطالب تهیه می‌کند، یا به عنوان سرگرمی، یا کسی که فقط می‌خواهد بیشتر در مورد نحوۀ کار تکنولوژی‌های تحت وب یاد بگیرد.</p>

<div class="warning">
<p dir="rtl"><strong>مهم</strong>: مطالب آموزشی تهیه شده در اینجا به صورت منظم در حال اضافه شدن است. اگر در مورد موضوعاتی که دوست دارید پوشش داده شوند یا دیده نشده‌اند سؤالی دارید، برای اطلاعات در مورد نحوۀ تماس به قسمت {{anch("Contact us")}} در زیر مراجعه نمایید.</p>
</div>

<h2 dir="rtl" id="از_کجا_شروع_کنیم">از کجا شروع کنیم</h2>

<p dir="rtl"></p>

<ul class="card-grid" dir="rtl">
 <li><span>کاملاً مبتدی:</span>

  <p>اگر شخصی کاملاً مبتدی در زمینۀ توسعۀ وب هستید، توصیۀ ما این است که کار را از قسمت <a href="https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web">شروع کار با وب</a> آغاز کنید که مقدمه‌‌ای عملی برای توسعۀ وب است.</p>
 </li>
 <li><span>سؤالات خاص:</span>
  <p>اگر در مورد توسعۀ وب سؤالات خاصی دارید، قسمت <a href="https://developer.mozilla.org/en-US/docs/Learn/Common_questions">سؤالات متداول</a> ما می‌تواند کمکتان کند.</p>
 </li>
 <li><span>فراتر از مقدماتی:</span>
  <p>اگر کمی دانش قبلی دارید، قدم بعدی یادگیری جزئیات {{glossary("HTML")}} و {{glossary("CSS")}} است: می‌توانید با قسمت <a href="https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML">مقدمه‌ای بر HTML</a> شروع کنید و بعد از آن به سراغ قسمت <a href="https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS">مقدمه‌ای بر CSS</a> بروید.</p>
 </li>
 <li><span>رفتن به‌سوی اسکریپت نویسی</span>
  <p>اگر با HTML و CSS احساس راحتی می‌کنید، و یا به کدنویسی بسیار علاقه دارید، شاید بخواهید به سراغ {{glossary("JavaScript")}} یا توسعۀ سمت سرور بروید. کار را با قسمت‌های <a href="https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps"> قدم‌های اول در جاوا اسکریپت</a> و <a href="https://developer.mozilla.org/en-US/docs/Learn/Server-side/First_steps">قدم‌های اول در سمت سرور</a> شروع کنید.</p>
 </li>
</ul>

<div class="note" dir="rtl">
<p><strong>توجه:</strong> در <a href="https://developer.mozilla.org/en-US/docs/Glossary">واژه‌نامه</a> می‌توانید تعاریف تمامی اصطلاحات را پیدا نمایید.</p>
</div>

<p dir="rtl">{{LearnBox({"title":"مدخل تصادفی واژه نامه"})}}</p>

<h2 dir="rtl" id="مطالب_ارائه_شده">مطالب ارائه شده</h2>

<p dir="rtl">در زیر می‌توانید فهرست موضوعاتی که در MDN وجود دارد را ببینید.</p>

<dl>
 <dt dir="rtl"><a href="https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web">شروع کار با وب</a></dt>
 <dd dir="rtl">برای کسانی که در توسعه وب کاملاً مبتدی هستند، مقدمه‌ای را رائه می‌دهد.</dd>
 <dt dir="rtl"><a href="https://developer.mozilla.org/en-US/docs/Learn/HTML">HTML — ساختار وب</a></dt>
 <dd dir="rtl">HTML زبانی است که برای ساخت قسمت‌های مختلف محتوا و تعریف آنچه که معنی و هدف آنهاست، از آن استفاده می‌کنیم. در این قسمت HTML را با جزئیات کامل آموزش می‌دهیم.</dd>
 <dt dir="rtl"><a href="https://developer.mozilla.org/en-US/docs/Learn/CSS">CSS — ظاهر وب</a></dt>
 <dd dir="rtl">CSS زبانی است که از آن برای استایل و چیدمانِ محتوای وب و همچنین اضافه کردن حرکات، مثل پویانمایی‌ها استفاده می‌کنیم. این قسمت CSS را با جزئیات تحت پوشش قرار می‌دهد.</dd>
 <dt dir="rtl"><a href="https://developer.mozilla.org/en-US/docs/Learn/JavaScript">JavaScript — اسکریپت نویسی پویا سمت کاربر</a></dt>
 <dd dir="rtl">جاوا اسکریپت یک زبان اسکریپتی است که برای اضافه کردن کنش‌های تعاملی به صفحات وب مورد استفاده قرار می‌گیرد. این قسمت به تمام نکاتی که برای نوشتن و خواندنِ راحت جاوا اسکریپت لازم است می‌پردازد.</dd>
 <dt dir="rtl"><a href="https://developer.mozilla.org/en-US/docs/Learn/Accessibility">دسترسی‌پذیری — وب را برای همه قابل استفاده کنید</a></dt>
 <dd>Accessibility is the practice of making web content available to as many people as possible regardless of disabilities, device, locale, or other differentiating factors relevant to them. This topic gives you all you need to know.</dd>
 <dt dir="rtl"><a href="https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing">ابزارها و تست ها</a></dt>
 <dd dir="rtl">این قسمت ابزارهایی را تحت پوشش قرار می‌دهد که توسعه‌دهندگان را در کارشان کمک می‌کند، مانند ابزارهای تست در مرورگرهای مختلف.</dd>
 <dt dir="rtl"><a href="https://developer.mozilla.org/en-US/docs/Learn/Server-side">برنامه نویسی سمت سرور وب سایت</a></dt>
 <dd>Even if you are concentrating on client-side web development, it is still useful to know about how servers and server-side code features work. This topic provides a general introduction to how the server-side works, and detailed tutorials detailing how to build up a server-side app using two popular frameworks — Django (Python) and Express (node.js). </dd>
</dl>

<h2 dir="rtl" id="دریافت_کد_مثال‌ها">دریافت کد مثال‌ها</h2>

<p dir="rtl">کد مثال‌هایی که در آموزش‌ها با آن مواجه هستید، همگی<a href="https://github.com/mdn/learning-area/"> در گیت‌هاب موجود هستند</a>. اگر می‌خواهید همۀ آنها را بر روی کامپیوتر خود داشته باشید، راحت‌ترین روش بدین صورت است:</p>

<ol>
 <li dir="rtl"><a href="http://git-scm.com/downloads">گیت </a>را بر روی دستگاه خود نصب کنید. این نرم افزار، یک سیستم کنترل نسخه است که گیت‌هاب بر اساس آن کار می‌کند.</li>
 <li dir="rtl"><a href="https://github.com/join">یک حساب گیت‌هاب برای خود بسازید</a>. این کار بسیار ساده و آسان است.</li>
 <li dir="rtl">بعد از ساخت حساب، با کمک نام کاربری و رمز عبور خود به <a href="https://github.com">github.com</a> وارد شوید.</li>
 <li dir="rtl">در کامپیوتر خود <a href="https://www.lifewire.com/how-to-open-command-prompt-2618089">command prompt</a> (ویندوز) یا terminal (<a href="https://help.ubuntu.com/community/UsingTheTerminal">لینوکس</a>, <a href="http://blog.teamtreehouse.com/introduction-to-the-mac-os-x-command-line">مکینتاش</a>) را باز کنید.</li>
 <li dir="rtl">برای کپی کردن مخزن آموزش‌ها به پوشه‌ای با نام learning-area به مکانی که command prompt/terminal برای استفاده دستورات خود باز کرده‌اند، دستور زیر را بنویسید:
  <pre class="brush: bash line-numbers  language-bash"><code class="language-bash">git clone https://github.com/mdn/learning-area</code></pre>
 </li>
 <li dir="rtl">حالا می‌توانید به پوشۀ مورد نظر رفته و فایل‌های جدید را در آن ببینید. (هم می‌توانید از finder/file explorer  استفاده کنید و هم از دستور <a href="https://en.wikipedia.org/wiki/Cd_%28command%29">cd command</a>).</li>
</ol>

<p dir="rtl">هر زمان که لازم باشد، می‌توانید با انجام مراحل زیر تغییرات صورت گرفته در مخزن گیت‌هاب را در پوشۀ <code>learning-area</code> اعمال نمایید:</p>

<ol>
 <li dir="rtl">در command prompt/terminal خود، با کمک <code>cd</code> به پوشه <code>learning-area</code> بروید. مثلاً اگر در پوشۀ بالایی آن هستید:

  <pre class="brush: bash line-numbers  language-bash"><code class="language-bash">cd learning-area</code></pre>
 </li>
 <li dir="rtl">مخزن را با کمک دستور زیر بروزرسانی کنید:
  <pre class="brush: bash line-numbers  language-bash"><code class="language-bash">git pull</code></pre>
 </li>
</ol>

<article class="approved text-content">
<div class="boxed translate-rendered">
<h2 dir="rtl" id="ارتباط_با_ما">ارتباط با ما</h2>

<p dir="rtl">اگر در مورد هر موضوعی خواستید با ما در ارتباط باشید، بهترین روش ارسال یک پیام از طریق <a href="https://developer.mozilla.org/en-US/docs/MDN/Community/Conversations#Asynchronous_discussions">لیستهای ایمیل</a> یا<a href="https://developer.mozilla.org/en-US/docs/MDN/Community/Conversations#Chat_in_IRC"> کانال های IRC </a>برای ماست. بسیار مشتاق شنیدن در مورد چیزهای اشتباه و یا کمبودهای موجود در سایت، درخواست موضوعات جدید آموزشی، درخواست کمک در مورد موضوعاتی که درک نمی کنید، یا هر چیز دیگری هستیم.</p>

<p dir="rtl">اگر هم که علاقه مند به کمک در توسعه/بهبود محتوا هستید، نگاهی به قسمت <a href="https://developer.mozilla.org/en-US/Learn/How_to_contribute">چطور می توانید کمک کنید</a> بیاندازید، و در ارتباط با شید! بیش از هرچیز از مصاحبت با شما خوشحالیم، خواه  یک شخص یادگیرنده باشید، یا معلم، یا توسعه دهنده با تجربه وب، یا کسی که می خواهد به بهبود تجربه آموزشی کمک کند.</p>

<h2 dir="rtl" id="همچنین_ببینید">همچنین ببینید</h2>

<dl>
 <dt dir="rtl"><a href="https://www.mozilla.org/en-US/newsletter/developer/">خبرنامه توسعه موزیلا</a></dt>
 <dd dir="rtl">خبرنامه مخصوص توسعه دهندگان وب، که منبع عالی برای تمامی سطوح توسعه است.</dd>
</dl>

<dl>
 <dt dir="rtl"><a href="https://www.codecademy.com/">Codecademy</a></dt>
 <dd dir="rtl">سایتی تعاملی فوق العاده برای آموزش زبان های برنامه نویسی از ابتدا.</dd>
 <dt dir="rtl"><a href="https://code.org/">Code.org</a></dt>
 <dd dir="rtl">کدنویسی مقدماتی به صورت تئوری و عملی که بیشتر برای کودکان و افراد کاملا مبتدی مناسب است.</dd>
 <dt dir="rtl"><a href="https://www.freecodecamp.com/">freeCodeCamp.com</a></dt>
 <dd dir="rtl">سایتی تعاملی حاوی آموزش ها و پروژه های یادگیری توسعه وب.</dd>
</dl>

<dl>
 <dt dir="rtl"><a href="https://learning.mozilla.org/web-literacy/">Web Literacy Map</a></dt>
 <dd dir="rtl">فریم ورکی برای سطح اولیه یادگیری وب و مهارت های قرن 21، که امکان دسترسی به فعالیت های آموزشی طبقه بندی شده را فراهم می کند.</dd>
 <dt dir="rtl"><a href="https://learning.mozilla.org/activities">Teaching activities</a></dt>
 <dd dir="rtl">سری فعالیت های یاددهی برای یادگیری (و آموزش) که توسط بنیاد موزیلا ایجاد شده است، و همه چیز را آموزش می دهد، از دانش اولیه وب گرفته تا امنیت جاوااسکریپت و هک Minecraft.</dd>
</dl>
</div>
</article>

<article class="localized">
<div class="editor-wrapper" id="editor-wrapper">
<div class="ckeditor-container editor-container dirty">
<div class="editor">
<div class="editor-tools"></div>

<div style="height: 107px;">
<div style="border: 1px solid rgb(182, 182, 182); width: 894px; position: fixed; top: 0px;"></div>
</div>
</div>
</div>
</div>
</article>