جاوااسکریپتصفر تا پیشرفتهرایگانبه‌روز شده ۱۹ مهر ۱۴۰۵

دوره‌ پروژه‌ محور جاوا اسکریپت برای فرانت‌ اند

Project-Based JavaScript Course for Front-End

این دوره برای کسانی طراحی شده که با HTML و CSS آشنا هستند و می خواهند جاوا اسکریپت را برای ساخت رابط های کاربری واقعی یاد بگیرند .هر مفهوم بلافاصله در یک پروژه به کار گرفته می شود و در پایان ، دانشجو یک پروژه کامل برای نمونه کار خود خواهد داشت.

با همکاری مرکز رشد دانشگاه آزاد اسلامی مشهد
۷۸ قسمت ۱ دقیقه ۱٬۷۸۵ دانشجو تماشای آفلاین ۴.۸ از ۳۶۸ نظر
دوره‌ پروژه‌ محور جاوا اسکریپت برای فرانت‌ اند
ویدیو معرفی به‌زودی

توضیحات دوره

در دوره‌ پروژه‌ محور جاوا اسکریپت ، از مبانی این زبان تا مفاهیم پیشرفته‌ توسعه‌ فرانت‌ اند را به‌ صورت کاربردی و گام‌ به‌ گام یاد می‌ گیرید. در طول دوره با کار روی پروژه‌ های عملی ، نحوه‌ ساخت رابط‌ های کاربری تعاملی ، مدیریت داده‌ ها، کار با API و توسعه‌ اپلیکیشن‌ های واقعی را تجربه می‌ کنید. همچنین با ابزارهای حرفه‌ ای مانند Git، GitHub و Vite آشنا می‌ شوید و اصول عملکرد و امنیت وب را می‌ آموزید. در پایان دوره ، یک فروشگاه آنلاین کامل پیاده‌ سازی می‌کنید و مجموعه‌ ای از پروژه‌ های کاربردی برای تقویت رزومه و ساخت نمونه‌ کار حرفه‌ ای خواهید داشت.

در این دوره چه یاد می‌گیرید؟

  • یادگیری جاوااسکریپت از مبانی تا مفاهیم پیشرفته
  • ساخت رابط‌ های کاربری تعاملی و اپلیکیشن‌ های کاربردی
  • کار با DOM ، رویدادها ، فرم‌ ها و API
  • آشنایی با Git , GitHub , Vite و اصول امنیت و بهینه‌ سازی
  • پیاده‌ سازی پروژه‌ های عملی و ساخت فروشگاه آنلاین
موقعیت‌های شغلی پس از دوره
توسعه‌ دهنده فرانت‌اند (Front-End Developer)برنامه‌ نویس جاوااسکریپت (JavaScript Developer)توسعه‌ دهنده رابط کاربری (UI Developer)فریلنسر طراحی و توسعه وبکارآموز برنامه‌ نویسی فرانت‌ اند
مناسب چه کسانی است؟
  • • علاقه‌ مندان به یادگیری برنامه‌ نویسی فرانت‌اند
  • • طراحان وب مسلط به HTML و CSS
  • • افرادی که قصد ورود به بازار کار توسعه وب را دارند
  • • برنامه‌ نویسانی که می‌ خواهند مهارت جاوااسکریپت خود را تقویت کنند

پیش‌نیازها

آشنایی با HTML و CSS در سطح پایه تا متوسط
کار با کامپیوتر و نصب نرم‌افزار ؛ سابقه‌ برنامه‌ نویسی لازم نیست
سطح دوره: صفر تا پیشرفته

سرفصل‌ها

۱۲ فصل · ۷۸ قسمت · ۱ دقیقه
۱جاوا اسکریپت چیست و کجا اجرا می شود (مرورگر و Node.js)۰:۰۰ ویژه دانشجو
۲نصب و تنظیم VS Code ، افزونه های لازم و Live Server۰:۰۰ ویژه دانشجو
۳آشنایی با DevTools مرورگر : Network , Console , Sources۰:۰۰ ویژه دانشجو
۴ساختار پوشه پروژه و اتصال فایل جاوا اسکریپت به HTML (type=module و defer)۰:۰۰ ویژه دانشجو
۱متغیر ها (let و const و دلیل کنار گذاشتن var ) ، انواع داده و typeof۰:۰۰ ویژه دانشجو
۲تبدیل نوع ، مقادیر Truthy و Falcy ، تفاوت == و ===۰:۰۰ ویژه دانشجو
۳عملگر ها از جمله ?? , ?. , || , &&۰:۰۰ ویژه دانشجو
۴شرط ها ، switch و انواع حلقه (for , while , for...of , for...in )۰:۰۰ ویژه دانشجو
۵توابع : پارامتر پیش فرض ، Arrow Function ، تابع به عنوان مقدار۰:۰۰ ویژه دانشجو
۶کار با رشته ها و Template Literal۰:۰۰ ویژه دانشجو
۱آرایه‌ها و متد های کاربردی : map ، filter , reduce , find , some , every , flat , flatMap۰:۰۰ ویژه دانشجو
۲متدهای جدید تر آرایه : toSorted , toReversed , with و at۰:۰۰ ویژه دانشجو
۳آبجکت‌ ها: Object.keys , Object.values , Object.entries , Object.groupBy ، Destructuring، Spread و Rest۰:۰۰ ویژه دانشجو
۴Map و Set و متدهای مجموعه‌ ای جدید Set (union , intersection و ...)۰:۰۰ ویژه دانشجو
۵JSON.stringify , JSON.parse و structuredClone۰:۰۰ ویژه دانشجو
۶- مفهوم Immutability و اهمیت آن در کدنویسی۰:۰۰ ویژه دانشجو
۱DOM چیست و ساختار درختی صفحه۰:۰۰ ویژه دانشجو
۲انتخاب المان‌ها با querySelector و querySelectorAll و پیمایش بین آن‌ ها۰:۰۰ ویژه دانشجو
۳تغییر متن ، attribute ، کلاس‌ها (classList , dataset) و استایل۰:۰۰ ویژه دانشجو
۴ساخت و حذف المان ، template و DocumentFragment۰:۰۰ ویژه دانشجو
۵امنیت در DOM : تفاوت textContent و innerHTML و آسیب‌ پذیری XSS۰:۰۰ ویژه دانشجو
۶الگوی رندر لیست از روی آرایه۰:۰۰ ویژه دانشجو
۱addEventListener و شیء Event , Bubbling و Capturing۰:۰۰ ویژه دانشجو
۲Event Delegation در لیست‌ های پویا۰:۰۰ ویژه دانشجو
۳رویدادهای کیبورد ، ماوس ، Pointer و Touch۰:۰۰ ویژه دانشجو
۴کار با فرم‌ها : رویداد submit , preventDefault و FormData۰:۰۰ ویژه دانشجو
۵اعتبارسنجی با Constraint Validation API و پیام‌ های خطای سفارشی Debounce و Throttle۰:۰۰ ویژه دانشجو
۱localStorage و sessionStorage , محدودیت‌ ها و نکات امنیتی۰:۰۰ ویژه دانشجو
۲ذخیره و بازیابی داده‌ های JSON۰:۰۰ ویژه دانشجو
۳آشنایی با IndexedDB و موارد استفاده‌ آن۰:۰۰ ویژه دانشجو
۴آشنایی با Cookie۰:۰۰ ویژه دانشجو
۱Scope , Hoisting و Closure با مثال‌ های کاربردی۰:۰۰ ویژه دانشجو
۲this و متد های call، apply و bind۰:۰۰ ویژه دانشجو
۳پروتوتایپ ، کلاس‌ ها ، فیلد های خصوصی (#) ، static و وراثت۰:۰۰ ویژه دانشجو
۴Getter و Setter۰:۰۰ ویژه دانشجو
۵ماژول‌ های ES: import و export , Dynamic Import و Top-level await۰:۰۰ ویژه دانشجو
۶مدیریت خطا : try/catch/finally و ساخت خطای سفارشی۰:۰۰ ویژه دانشجو
۷آشنایی با Iterator و Generator۰:۰۰ ویژه دانشجو
۱Event Loop , Call Stack , Microtask و Macrotask۰:۰۰ ویژه دانشجو
۲setTimeout , setInterval , Callback و مشکل Callback Hell۰:۰۰ ویژه دانشجو
۳Promise و متدهای all , allSettled , race , any و withResolvers۰:۰۰ ویژه دانشجو
۴async و await و مدیریت خطا۰:۰۰ ویژه دانشجو
۵Fetch API , متدهای HTTP ، هدرها و کدهای وضعیت۰:۰۰ ویژه دانشجو
۶لغو درخواست با AbortController۰:۰۰ ویژه دانشجو
۷مدیریت حالت‌ های Loading , Error و Empty در رابط کاربری۰:۰۰ ویژه دانشجو
۸صفحه‌بندی ، جستجو و Infinite Scroll۰:۰۰ ویژه دانشجو
۹آشنایی با CORS و راه‌ حل‌ های آن۰:۰۰ ویژه دانشجو
۱ساخت کامپوننت‌ های قابل استفاده‌ مجدد با جاوا اسکریپت خالص۰:۰۰ ویژه دانشجو
۲مودال با المان dialog و Popover API۰:۰۰ ویژه دانشجو
۳آکاردئون ، تب ، منوی ریسپانسیو ، Dropdown و Tooltip۰:۰۰ ویژه دانشجو
۴اسلایدر با CSS Scroll Snap و جاوا اسکریپت۰:۰۰ ویژه دانشجو
۵IntersectionObserver برای Lazy Loading و انیمیشن هنگام اسکرول۰:۰۰ ویژه دانشجو
۶آشنایی با ResizeObserver و MutationObserver۰:۰۰ ویژه دانشجو
۷انیمیشن: Web Animations API , requestAnimationFrame و View Transitions API۰:۰۰ ویژه دانشجو
۸Drag and Drop۰:۰۰ ویژه دانشجو
۹دسترس‌پذیری : مدیریت فوکوس , ویژگی‌ های aria و پشتیبانی از کیبورد۰:۰۰ ویژه دانشجو
۱۰تم تاریک و روشن با prefers-color-scheme۰:۰۰ ویژه دانشجو
۱Node.js و npm و فایل package.json۰:۰۰ ویژه دانشجو
۲راه‌ اندازی پروژه با Vite و کار با متغیر های محیطی۰:۰۰ ویژه دانشجو
۳Git , GitHub: commit , branch , pull request۰:۰۰ ویژه دانشجو
۴ESLint و Prettier۰:۰۰ ویژه دانشجو
۵دیباگ حرفه‌ ای: Breakpoint , Network , Performance و Memory۰:۰۰ ویژه دانشجو
۶مقدمه‌ ای بر تست‌ نویسی با Vitest۰:۰۰ ویژه دانشجو
۷انتشار پروژه روی هاست۰:۰۰ ویژه دانشجو
۱Core Web Vitals و اندازه‌ گیری با Lighthouse۰:۰۰ ویژه دانشجو
۲جلوگیری از Reflow و Repaint غیرضروری۰:۰۰ ویژه دانشجو
۳Code Splitting و Lazy Import۰:۰۰ ویژه دانشجو
۴آشنایی با Web Workers۰:۰۰ ویژه دانشجو
۵- اصول امنیت فرانت‌اند : XSS ، پاکسازی ورودی و نگهداری توکن۰:۰۰ ویژه دانشجو
۱پیاده‌سازی فروشگاه آنلاین با Vite و ماژول‌ های ES ، بدون فریم‌ ورک۰:۰۰ ویژه دانشجو
۲لیست محصولات با فیلتر ، جستجو ، مرتب‌ سازی و صفحه‌ بندی از روی API۰:۰۰ ویژه دانشجو
۳صفحه‌ جزئیات محصول و مسیریابی سمت کلاینت با History API۰:۰۰ ویژه دانشجو
۴سبد خرید با ذخیره‌ دائمی و محاسبه‌ مجموع۰:۰۰ ویژه دانشجو
۵فرم پرداخت با اعتبارسنجی کامل۰:۰۰ ویژه دانشجو
۶ریسپانسیو بودن، دسترس‌ پذیری ، تم تاریک و حالت‌ های Loading و Error۰:۰۰ ویژه دانشجو
۷تست توابع کلیدی ، انتشار پروژه و نوشتن README۰:۰۰ ویژه دانشجو
۸معرفی کوتاه TypeScript و مسیر یادگیری بعدی (TypeScript ، سپس React یا Vue و Next.js یا Nuxt)۰:۰۰ ویژه دانشجو
۹نحوه‌ نمایش پروژه‌ ها در GitHub و رزومه۰:۰۰ ویژه دانشجو

نحوه مشاهده دوره

ویدیوهای این دوره با اسپات‌پلیر پخش می‌شوند تا از کپی غیرمجاز محافظت شوند و بتوانید آن‌ها را آفلاین هم ببینید. فهرست قسمت‌ها، پیشرفت، پرسش از مدرس و آزمون همچنان در کلاس درس همین سایت است.

ویندوزمکاندرویدiOSنسخه وب
  1. پس از ثبت‌نام، از پیشخوان › لایسنس‌ها لایسنس دوره را دریافت کنید.
  2. اسپات‌پلیر را روی دستگاه خود نصب کنید یا نسخه وب آن را باز کنید.
  3. لایسنس را وارد کنید؛ هر قسمت یک بار دانلود و بعد بدون اینترنت پخش می‌شود.
  4. هر لایسنس روی ۳ دستگاه فعال می‌شود و شماره موبایل شما روی ویدیو نمایش داده می‌شود.

مدرس دوره

حسین مداحی
حسین مداحی
برنامه نویس فول استک وب
مدرس اصلی دوره
مشهد

حسین مداحی هستم ، برنامه‌ نویس فول‌ استک وب با حدود ۱۰ سال سابقه فعالیت تخصصی و علاقه‌ مند به تلفیق مهندسی نرم‌ افزار با اصول بازاریابی دیجیتال و سئو . در طول این سال‌ ها به عنوان فریلنسر و مدیر تیم توسعه ، پروژه‌ های متعددی را در حوزه وب و فرانت‌اند با تمرکز بر فناوری‌ های مدرن جاوا اسکریپت به سرانجام رسانده‌ ام . همچنین با سابقه آموزش بیش از ۳۰۰ دانشجو در آموزشگاه‌ های معتبر و پلتفرم‌ های آنلاین ، همواره در تلاش برای اشتراک‌ گذاری دانش فنی خود با علاقه‌ مندان حوزه برنامه‌ نویسی هستم.

JavaScriptNode.jsReactNext.js
۱۰ سال سابقه۱ دوره در آکادمیصفحهٔ مدرس

آخرین به‌روزرسانی‌ها

به‌روزرسانی: ۱۹ مهر ۱۴۰۵

این دوره زنده است؛ با تغییر ابزارها، قسمت‌ها بازضبط و تمرین‌ها تازه می‌شوند و همهٔ به‌روزرسانی‌ها برای دانشجویان رایگان است.

۱۹ مهر ۱۴۰۵افزودن قسمت تازه «ساخت نمونه‌کار در کار استار»
۱۰ مهر ۱۴۰۵بازضبط قسمت «سئوی پایه با Rank Math» با نسخه جدید ابزارها
۱ مهر ۱۴۰۵به‌روزرسانی فایل‌های تمرین فصل «فروشگاه با ووکامرس»
۲۳ شهریور ۱۴۰۵اصلاح و تکمیل توضیحات قسمت «راه‌اندازی ووکامرس»
۱۴ شهریور ۱۴۰۵افزودن تمرین تکمیلی به فصل «قالب و صفحه‌ساز»
۵ شهریور ۱۴۰۵افزودن قسمت تازه «کاربران و نقش‌ها»
۲۷ مرداد ۱۴۰۵بازضبط قسمت «نصب وردپرس روی لوکال» با نسخه جدید ابزارها
۱۸ مرداد ۱۴۰۵به‌روزرسانی فایل‌های تمرین فصل «ورود به بازار فریلنسری»
۹ مرداد ۱۴۰۵اصلاح و تکمیل توضیحات قسمت «سئوی پایه با Rank Math»
۳۱ تیر ۱۴۰۵افزودن تمرین تکمیلی به فصل «فروشگاه با ووکامرس»

مسیر دریافت مدرک

گواهینامه این دوره با خرید صادر نمی‌شود؛ پشت هر گواهینامه یک آزمون و یک پروژه داوری‌شده است و هر کارفرما می‌تواند آن را با کد یکتا در صفحهٔ استعلام مدرک بررسی کند.

  1. حداقل ۸۰٪ دوره را ببینید (قسمت‌های اسپات‌پلیر را پس از دیدن در کلاس درس «دیدم» علامت بزنید).
  2. درخواست مدرک ثبت کنید؛ از همان لحظه ۷۲ ساعت فرصت دارید.
  3. آزمون ۲۰ دقیقه‌ای بدهید (۶۰ نمره).
  4. پروژه پایانی را ارسال کنید؛ مدرس تا ۴۰ نمره می‌دهد.
  5. با نمره کل ۷۰ یا بیشتر، گواهینامهٔ دوزبانه صادر می‌شود.

گواهینامهٔ دوزبانه با مرکز رشد دانشگاه آزاد اسلامی مشهد

گواهینامهٔ پایان دوره در دو نسخهٔ فارسی و انگلیسی صادر می‌شود که هر دو یک کد استعلام دارند؛ نسخهٔ انگلیسی را می‌توانید برای رزومهٔ بین‌المللی، لینکدین یا مهاجرت کاری ارائه دهید.

نسخهٔ فارسی
گواهینامهٔ پایان دوره
بدین‌وسیله گواهی می‌شود نام و نام خانوادگی شما دورهٔ «دوره‌ پروژه‌ محور جاوا اسکریپت برای فرانت‌ اند» را با موفقیت گذرانده است.
ENGLISH VERSION
Certificate of Completion
This certifies that Your Full Name has successfully completed “Project-Based JavaScript Course for Front-End”.

راهنما و سوالات متداول

ثبت‌نام و پرداختپس از پرداخت، دوره فوراً به «دوره‌های من» در پیشخوان اضافه می‌شود.
دریافت لایسنساز پیشخوان › لایسنس‌ها، لایسنس اسپات‌پلیر را بگیرید و دوره را آنلاین یا آفلاین ببینید.
یادگیری و پرسشزیر هر قسمت در کلاس درس از مدرس همان فصل سوال بپرسید؛ پاسخ همان‌جا می‌آید.
آزمون، پروژه و گواهینامهبا دیدن ۸۰٪ دوره، آزمون و پروژهٔ پایانی را انجام دهید و گواهینامهٔ دوزبانه بگیرید.

بله. پس از ثبت‌نام، دسترسی شما به ویدیوها و به‌روزرسانی‌های بعدی دوره همیشگی است.

پس از تماشای حداقل ۸۰٪ دوره، درخواست گواهینامه ثبت می‌کنید. در مهلت ۷۲ ساعته آزمون می‌دهید و پروژه را ارسال می‌کنید؛ مدرس پروژه را داوری می‌کند و با کسب حداقل ۷۰ از ۱۰۰، گواهینامه با لوگوی کار استار و مرکز رشد دانشگاه آزاد مشهد و کد استعلام صادر می‌شود.

هر پروژه را خود مدرس با دقت داوری می‌کند. محدودیت ظرفیت تضمین می‌کند پروژه شما سریع و با کیفیت بررسی شود، نه اینکه در صف طولانی بماند.

زیر هر قسمت از دوره یک بخش پرسش و پاسخ هست. سوال شما مستقیم برای مدرس ارسال می‌شود و پاسخ همان‌جا زیر همان قسمت نمایش داده می‌شود.

ویدیوهای دوره با اسپات‌پلیر پخش می‌شوند. پس از ثبت‌نام، لایسنس دوره را از پنل کاربری بگیرید و در اپ ویندوز، مک، اندروید یا نسخه وب اسپات‌پلیر وارد کنید. هر قسمت یک بار دانلود می‌شود و بعد بدون اینترنت هم قابل تماشاست. هر لایسنس روی ۳ دستگاه فعال می‌شود.

گواهینامه پایان دوره مشترکاً با لوگوی کار استار آکادمی و مرکز رشد دانشگاه آزاد اسلامی واحد مشهد صادر می‌شود و کد استعلام آنلاین دارد.

خیر. گواهینامه گذراندن یک دوره آموزشی مهارتی است و جایگزین مدرک کاردانی، کارشناسی یا بالاتر نیست؛ اما به‌عنوان سابقه آموزشی در رزومه قابل ارائه است.

نظرات دانشجویان

۴.۸از ۳۶۸ نظر
۵
۰
۴
۰
۳
۰
۲
۰
۱
۰
فقط دانشجویان این دوره می‌توانند نظر ثبت کنند تا نظرها واقعی بمانند.