آموزش عیب‌یابی و دیباگ جاوااسکریپت - آخرین آپدیت

سرفصل ها و درس ها

مقدمه Introduction

• آنچه باید بدانید What you should know

• خوش‌آمدگویی Welcome

• فایل‌های تمرینی Exercise files

• استفاده از چالش‌ها Using challenges

• تغییرات جدید در این به‌روزرسانی What's new in this update

1. درک نیاز به دیباگر 1. Understanding the Need for a Debugger

• اهمیت یک ادیتور و IDE مناسب The importance of a good editor and IDE

• معرفی ابزار دیباگر Introducing our friend, the debugger

• اصطلاحات و مفاهیم مهم Important jargon and concepts

• دیباگرها در مرورگرهای وب Debuggers in web browsers

• چرا دیباگ AJAX می‌تواند دشوار باشد Why debugging AJAX can be tricky

2. مبانی دیباگر 2. Debugger Basics

• مانیتورینگ متغیرها با Watches Monitor variables with watches

• شناسایی موقعیت کد با استفاده از Call Stack Find out where you are using the call stack

• استفاده از Source maps برای دیباگ فایل‌های فشرده (Minified) Source maps to debug minified files

• بررسی سایر گزینه‌های Breakpoint Explore other breakpoint options

• توقف و بررسی: نقاط شکست ساده (Simple Breakpoints) Stop and look around: Simple breakpoints

• ورود، عبور و خروج از توابع (Step into, over, out) Step into, over, and out of functions

• بهره‌برداری بیشتر از API کنسول Leverage more of the Console API

• دیباگ بدون استفاده از دیباگر Debugging without a debugger

• چالش: تشخیص زمان توقف Challenge: Knowing when to stop

• راه حل: جمع‌بندی کلی Solution: Putting it all together

• راه حل: تشخیص زمان توقف Solution: Knowing when to stop

• چالش: جمع‌بندی کلی Challenge: Putting it all together

3. دیباگ در عمل 3. Debugging in Practice

• دیباگ در iOS با استفاده از شبیه‌ساز Debugging on iOS using Simulator

• دیباگ از راه دور (Remote) روی دستگاه اندروید Remote debugging on an Android device

• دیباگ قالب وردپرس در Visual Studio Code Debug a WordPress theme in Visual Studio Code

• عیب‌یابی در استفاده از پلاگین jQuery Debugging the use of a jQuery plugin

• استفاده از دیباگر به عنوان ابزار یادگیری در سایت‌های زنده Use a debugger as a learning tool on a live site

• دیباگ اپلیکیشن Node.js در WebStorm Debugging a Node.js application in WebStorm

• دیباگ اپلیکیشن React در مرورگر کروم Debugging a React application in Chrome

• راه‌اندازی نمونه وردپرس Setting up the WordPress example

• چالش: بررسی کدهای دیگران Challenge: Other people's code

• راه حل: بررسی کدهای دیگران Solution: Other people's code

• چالش: دیباگ با استفاده از IDE Challenge: Debugging with an IDE

• راه حل: دیباگ با استفاده از IDE Solution: Debugging with an IDE

جمع‌بندی Conclusion

• گام‌های بعدی Next steps

• منابع تکمیلی جاوااسکریپت Extra JavaScript resources