🎓 دوره آموزشی جامع

📚 اطلاعات دوره

عنوان دوره: راهنمای جامع تست فرانت‌اند با استفاده از ابزارهای پیشرو

موضوع کلی: برنامه نویسی

موضوع میانی: تست فرانت‌اند

📋 سرفصل‌های دوره (100 موضوع)

• 1. مقدمه: چرا و چگونه تست فرانت‌اند
• 2. مفاهیم پایه تست نرم‌افزار
• 3. چرخه عمر توسعه نرم‌افزار و نقش تست در آن
• 4. انواع تست: Unit, Integration, E2E و غیره
• 5. هرم تست و کاربرد آن در فرانت‌اند
• 6. مقدمه‌ای بر Test Driven Development (TDD)
• 7. مقدمه‌ای بر Behavior Driven Development (BDD)
• 8. مفاهیم کلیدی تست: Assertion, Fixture, Mock, Stub, Spy
• 9. چالش‌های منحصربه‌فرد تست فرانت‌اند
• 10. ابزارهای تست اکوسیستم جاوااسکریپت
• 11. راه‌اندازی محیط توسعه برای تست (NPM, Yarn, Vite, Webpack)
• 12. مقدمه‌ای بر Unit Testing
• 13. انتخاب Test Runner: Jest در مقابل Vitest در مقابل Mocha
• 14. نصب و پیکربندی Jest برای پروژه‌های جاوااسکریپت/تایپ‌اسکریپت
• 15. نوشتن اولین تست با Jest: `expect` و Matchers
• 16. گروه‌بندی تست‌ها با `describe`
• 17. مدیریت Setup و Teardown با `beforeEach`, `afterEach`, `beforeAll`, `afterAll`
• 18. Mock کردن توابع با `jest.fn()`
• 19. Mock کردن ماژول‌ها و Dependencies
• 20. Spy کردن توابع با `jest.spyOn()`
• 21. تست کدهای Asynchronous (Promises, Async/Await) در Jest
• 22. Snapshot Testing با Jest: کاربردها و محدودیت‌ها
• 23. بهترین روش‌ها برای Unit Testing توابع جاوااسکریپت
• 24. مقدمه‌ای بر Vitest: مزایا و تفاوت‌ها با Jest
• 25. نصب و پیکربندی Vitest
• 26. نوشتن تست‌های پایه با Vitest: API مشابه Jest
• 27. Mocking و Spying در Vitest
• 28. Snapshot Testing در Vitest
• 29. مقدمه‌ای بر Component Testing
• 30. چرا باید کامپوننت‌ها را تست کنیم؟
• 31. فلسفه و اصول React Testing Library
• 32. نصب و پیکربندی React Testing Library با Jest/Vitest
• 33. کوئری‌کردن عناصر DOM در RTL (getBy, queryBy, findBy)
• 34. تعامل با عناصر (Click, Type) با `fireEvent` و `user-event`
• 35. تست Props و State در کامپوننت‌های React
• 36. تست Event Handlers در کامپوننت‌ها
• 37. Mock کردن فراخوانی‌های API در تست‌های کامپوننت
• 38. تست Custom Hooks و Context در React
• 39. Advanced Querying: Testing Library Custom Queries
• 40. Snapshot Testing کامپوننت‌ها (چه زمانی استفاده کنیم؟)
• 41. بهترین روش‌ها برای تست کامپوننت‌های React
• 42. مقدمه‌ای بر Vue Test Utils برای Vue.js
• 43. نصب و راه‌اندازی Vue Test Utils با Vitest/Jest
• 44. Mount کردن و تعامل با کامپوننت‌های Vue
• 45. تست Vuex/Pinia Stores در کامپوننت‌های Vue
• 46. مقدمه‌ای بر تست Angular با TestBed
• 47. راه‌اندازی محیط تست Angular
• 48. تست کامپوننت‌ها و سرویس‌های Angular
• 49. Mock کردن Dependencies در تست‌های Angular
• 50. اشتباهات رایج در Component Testing و راه‌حل‌ها
• 51. مقدمه‌ای بر Frontend Integration Testing
• 52. استراتژی‌های Integration Testing در فرانت‌اند
• 53. تست تعامل بین چندین کامپوننت React/Vue/Angular
• 54. تست کتابخانه‌های کامپوننت و Design Systems
• 55. تست تعامل Redux/Vuex/NGRX با کامپوننت‌ها
• 56. Mock کردن Backend APIs برای Integration Tests
• 57. استفاده از Mock Service Worker (MSW) برای Mocking Network Requests
• 58. مقدمه‌ای بر End-to-End (E2E) Testing
• 59. اهمیت E2E Testing برای برنامه‌های فرانت‌اند
• 60. انتخاب E2E Testing Framework: Cypress در مقابل Playwright
• 61. نصب و پیکربندی Cypress
• 62. نوشتن اولین تست Cypress: بازدید از صفحات و Assertions
• 63. انتخاب‌گرهای Cypress: بهترین روش‌ها
• 64. تعامل با عناصر در Cypress (`cy.get`, `cy.click`, `cy.type`)
• 65. Assertions در Cypress (`should`, `and`)
• 66. مدیریت عملیات Asynchronous و انتظار در Cypress
• 67. استفاده از Cypress Fixtures برای داده‌های تست
• 68. دستورات سفارشی Cypress (Custom Commands)
• 69. Mock کردن درخواست‌های شبکه با `cy.intercept`
• 70. استراتژی‌های E2E Testing: Page Object Model
• 71. اجرای تست‌های Cypress در Headless Mode
• 72. ادغام Cypress با CI/CD
• 73. مقدمه‌ای بر Playwright: مزایا و تفاوت‌ها با Cypress
• 74. نصب و پیکربندی Playwright برای E2E Testing
• 75. انتخاب‌گرها و تعاملات در Playwright
• 76. تست با مرورگرهای مختلف و دستگاه‌های موبایل در Playwright
• 77. Mock کردن شبکه در Playwright
• 78. تولید تست با Playwright Codegen
• 79. بهترین روش‌ها برای E2E Testing با Playwright
• 80. مقایسه Cypress و Playwright: مزایا و معایب
• 81. چالش‌های رایج در E2E Testing و راهکارها
• 82. تست دسترس‌پذیری (A11y) با ابزارهایی مانند `jest-axe` و `cypress-axe`
• 83. مقدمه‌ای بر تست عملکرد (Performance Testing) در فرانت‌اند
• 84. ابزارهای تست عملکرد (Lighthouse, WebPageTest)
• 85. مقدمه‌ای بر Visual Regression Testing
• 86. ابزارهای Visual Regression Testing (Storybook, Percy, Chromatic)
• 87. استفاده از Storybook برای مستندسازی و تست کامپوننت‌ها
• 88. ادغام Storybook با ابزارهای Visual Regression
• 89. استراتژی‌های Cross-Browser Testing
• 90. تست Localization (L10n) و Internationalization (I18n)
• 91. مقدمات تست امنیت در فرانت‌اند (XSS, CSRF)
• 92. مقدمه‌ای بر Mutation Testing برای جاوااسکریپت
• 93. ابزارهای گزارش‌دهی پوشش کد (Istanbul, Vitest UI)
• 94. استفاده از ESLint و Prettier برای بهبود کیفیت کد
• 95. ادغام تست‌ها در خطوط CI/CD (GitHub Actions, GitLab CI)
• 96. تکنیک‌های پیشرفته Mocking با MSW (Mock Service Worker)
• 97. تست کتابخانه‌های مدیریت State (Zustand, Jotai, XState)
• 98. تست Web Workers و Service Workers
• 99. تست برنامه‌های Real-time (مانند WebSockets)
• 100. اشکال‌زدایی موثر تست‌های فرانت‌اند

راهنمای جامع تست فرانت‌اند: از مبتدی تا حرفه‌ای با Jest، Cypress و Playwright

معرفی دوره: کدی بنویسید که از آن مطمئن هستید!

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

دوره «راهنمای جامع تست فرانت‌اند» دروازه‌ای برای ورود شما به دنیای توسعه نرم‌افزار با کیفیت است. در این دوره، ما فراتر از مفاهیم تئوری رفته و به صورت کاملاً عملی و پروژه‌محور، شما را با مدرن‌ترین و قدرتمندترین ابزارهای تست فرانت‌اند مانند Jest، React Testing Library، Cypress و Playwright آشنا می‌کنیم. پس از پایان این دوره، شما قادر خواهید بود برای هر فیچر و کامپوننتی که می‌نویسید، تست‌های قابل اعتماد و کارآمدی طراحی کنید و با اطمینان کامل، محصولی بدون نقص به دست کاربر نهایی برسانید.

درباره دوره: یک نقشه راه کامل برای تسلط بر تست

این دوره یک مجموعه ویدیویی جامع و گام‌به‌گام است که از صفر تا صد مفاهیم تست در دنیای فرانت‌اند را پوشش می‌دهد. ما از فلسفه و چرایی تست‌نویسی شروع می‌کنیم، با انواع تست‌ها (واحد، یکپارچه‌سازی، سر به سر) آشنا می‌شویم و سپس به صورت عمیق، هر یک از ابزارهای کلیدی را با مثال‌های واقعی و کاربردی بررسی می‌کنیم. تمام مفاهیم در قالب یک پروژه واقعی پیاده‌سازی می‌شوند تا شما نه تنها "چه چیزی" را یاد بگیرید، بلکه "چگونه" و "کجا" از آن استفاده کنید را نیز به خوبی درک کنید.

موضوعات کلیدی دوره

• مبانی و هرم تست: آشنایی با چرایی تست‌نویسی، انواع تست و استراتژی‌های پیاده‌سازی آن.
• تست واحد (Unit Testing): تسلط کامل بر فریم‌ورک Jest برای تست منطق و توابع جاوااسکریپت.
• تست کامپوننت (Component Testing): یادگیری عمیق React Testing Library برای تست کامپوننت‌های React به شیوه‌ای که کاربر با آن‌ها تعامل دارد.
• شبیه‌سازی (Mocking): تکنیک‌های پیشرفته برای ایزوله کردن تست‌ها با شبیه‌سازی APIها، ماژول‌ها و توابع.
• تست سر به سر (End-to-End Testing): پیاده‌سازی سناریوهای کاربری کامل با ابزارهای قدرتمند Cypress و Playwright.
• تست بصری (Visual Regression): اطمینان از عدم تغییر ناخواسته ظاهر رابط کاربری در نسخه‌های مختلف.
• تست کارایی (Performance Testing): ابزارها و تکنیک‌های اولیه برای سنجش سرعت و عملکرد اپلیکیشن.
• یکپارچه‌سازی با CI/CD: اجرای خودکار تست‌ها در فرآیندهای DevOps با ابزارهایی مانند GitHub Actions.

این دوره برای چه کسانی مناسب است؟

• توسعه‌دهندگان فرانت‌اند (جونیور تا سینیور): که می‌خواهند کیفیت کد خود را به سطح بالاتری برسانند و با اعتماد به نفس بیشتری توسعه دهند.
• مدیران تیم‌های فنی و معماران نرم‌افزار: که به دنبال پیاده‌سازی فرهنگ کیفیت و تست در تیم خود هستند.
• مهندسان تضمین کیفیت (QA): که قصد دارند مهارت‌های خود را در زمینه اتوماسیون تست فرانت‌اند گسترش دهند.
• دانشجویان و فارغ‌التحصیلان رشته کامپیوتر: که می‌خواهند با یک مهارت کلیدی و متمایز، شانس خود را برای استخدام در شرکت‌های برتر افزایش دهند.
• توسعه‌دهندگان فریلنسر: که می‌خواهند با ارائه پروژه‌های باکیفیت و بدون باگ، رضایت و اعتماد مشتریان خود را جلب کنند.

چرا باید در این دوره شرکت کنید؟

۱. افزایش چشمگیر اعتماد به نفس و کاهش استرس

با نوشتن تست‌های جامع، دیگر نگران این نخواهید بود که یک تغییر کوچک، بخش دیگری از برنامه را خراب کند. با هر بار اجرای تست‌ها، از صحت عملکرد کد خود مطمئن می‌شوید و با خیالی آسوده کدهای خود را منتشر می‌کنید.

۲. ارتقای مسیر شغلی و افزایش درآمد

توانایی نوشتن تست‌های حرفه‌ای، یکی از مهم‌ترین مهارت‌هایی است که شرکت‌های بزرگ و مدرن به دنبال آن هستند. تسلط بر این مهارت شما را از یک کدنویس معمولی به یک مهندس نرم‌افزار حرفه‌ای تبدیل می‌کند و فرصت‌های شغلی بهتر با درآمد بالاتر را برایتان به ارمغان می‌آورد.

۳. صرفه‌جویی در زمان و هزینه در بلندمدت

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

۴. ساخت محصولاتی که کاربران دوست دارند

تست‌های خوب، تضمین‌کننده یک تجربه کاربری (UX) روان و بدون مشکل هستند. با اطمینان از عملکرد صحیح اپلیکیشن، محصولی پایدار و قابل اعتماد می‌سازید که رضایت و وفاداری کاربران را به همراه دارد.

۵. یادگیری ابزارهای روز و مورد تقاضای بازار

در این دوره، شما با کتابخانه‌ها و فریم‌ورک‌هایی کار می‌کنید که توسط بزرگترین شرکت‌های فناوری دنیا مانند متا، گوگل و مایکروسافت استفاده و پشتیبانی می‌شوند. این دانش شما را در لبه تکنولوژی نگه می‌دارد.

سرفصل‌های جامع دوره (بیش از ۱۰۰ درسنامه عملی)

این دوره شامل سرفصل‌های بسیار جامعی است که شما را از یک فرد مبتدی به یک متخصص تست فرانت‌اند تبدیل می‌کند. در ادامه نگاهی کلی به ساختار فصل‌ها خواهیم داشت:

فصل اول: مبانی و استراتژی‌های تست

• تست نرم‌افزار چیست و چرا اهمیت دارد؟
• آشنایی با هرم تست (Unit, Integration, E2E)
• معرفی TDD (Test-Driven Development) و BDD (Behavior-Driven Development)
• انتخاب ابزار مناسب برای هر نوع تست

فصل دوم: شروع کار با Jest، قدرتمندترین فریم‌ورک تست جاوااسکریپت

• راه‌اندازی و پیکربندی اولیه Jest
• نوشتن اولین تست واحد (Unit Test)
• آشنایی با Matcher‌های پرکاربرد (toBe, toEqual, ...)
• گروه‌بندی تست‌ها با describe و it
• کار با توابع Setup و Teardown (beforeEach, afterAll, ...)

فصل سوم: تست کامپوننت‌های React با React Testing Library (RTL)

• فلسفه RTL: تست بر اساس رفتار کاربر
• راه‌اندازی RTL در یک پروژه React
• رندر کردن کامپوننت‌ها و انواع کوئری‌ها (getBy, findBy, queryBy)
• شبیه‌سازی رویدادهای کاربر (کلیک، تایپ و...) با User Event
• تست State، Props و Context در کامپوننت‌ها

فصل چهارم: تکنیک‌های پیشرفته در Jest و RTL

• مفهوم Mocking و چرایی استفاده از آن
• شبیه‌سازی ماژول‌ها و توابع با `jest.mock` و `jest.spyOn`
• تست هوک‌های سفارشی (Custom Hooks)
• کار با تایمرهای جعلی (Fake Timers)
• تست کدهای ناهمگام (Asynchronous) و مدیریت Promise‌ها

فصل پنجم: تست درخواست‌های شبکه (API Testing)

• استراتژی‌های تست کامپوننت‌های وابسته به API
• معرفی و استفاده از کتابخانه Mock Service Worker (MSW)
• نوشتن تست‌های یکپارچه‌سازی برای سناریوهای fetch/error/loading

فصل ششم: اتوماسیون مرورگر با Cypress برای تست‌های End-to-End

• نصب و راه‌اندازی Cypress
• معرفی معماری و داشبورد Cypress
• نوشتن اولین تست E2E: بازدید از صفحه، تعامل با المان‌ها
• دستورات (Commands) پرکاربرد در Cypress
• مدیریت Assertions و Timeouts
• استفاده از Fixtures برای داده‌های تستی

فصل هفتم: الگوهای پیشرفته در Cypress

• نوشتن دستورات سفارشی (Custom Commands)
• مدیریت احراز هویت (Authentication) در تست‌ها
• تست درخواست‌های شبکه و Stub کردن API‌ها
• استفاده از Page Object Model برای مدیریت بهتر تست‌ها

فصل هشتم: آشنایی با Playwright، نسل جدید ابزارهای تست E2E

• مقایسه Playwright با Cypress
• نصب و پیکربندی Playwright
• ضبط تست‌ها با Codegen
• نوشتن تست‌های موازی برای مرورگرهای مختلف (Cross-browser Testing)

فصل نهم: تست‌های غیرعملکردی (Non-Functional)

• مقدمه‌ای بر تست دسترس‌پذیری (Accessibility Testing) با jest-axe
• آشنایی با تست رگرسیون بصری (Visual Regression Testing) با Storybook
• مقدمه‌ای بر تست کارایی با Lighthouse

فصل دهم: ادغام تست‌ها در فرآیند CI/CD

• مفهوم Continuous Integration و Continuous Deployment
• پیکربندی GitHub Actions برای اجرای خودکار تست‌ها
• تولید گزارش پوشش کد (Code Coverage)
• استراتژی‌های اجرای تست در Pipeline