فلش‌کارت‌های آموزشی از صفر تا قهرمانی: آموزش جامع Front-End Developer با Dominic Myers

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

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

عنوان دوره: دوره از صفر تا قهرمانی: آموزش جامع Front-End Developer با Dominic Myers

موضوع کلی: توسعه وب فرانت‌اند

موضوع میانی: HTML، CSS و JavaScript

📋 سرفصل‌های دوره

• 1. معرفی دنیای توسعه فرانت‌اند و نقش آن
• 2. ابزارهای ضروری توسعه‌دهنده (VS Code, مرورگرها)
• 3. نصب و راه‌اندازی محیط توسعه
• 4. آشنایی با ساختار اولیه سند HTML
• 5. تگ‌های هدینگ، پاراگراف و فرمت‌بندی متن
• 6. انواع لیست‌ها: مرتب، نامرتب و تعریفی
• 7. ایجاد لینک‌ها: داخلی، خارجی و لنگر
• 8. تصاویر در HTML: ویژگی‌ها و بهینه‌سازی
• 9. افزودن محتوای چندرسانه‌ای: Audio و Video
• 10. ساختاردهی اطلاعات با جداول HTML
• 11. فرم‌های HTML: اصول و تگ Form
• 12. انواع ورودی‌ها (Input Types): Text, Number, Email, Password
• 13. کنترل‌های فرم پیشرفته: Select, Textarea, Button
• 14. ویژگی‌های فرم (Action, Method, Target)
• 15. HTML5 و تگ‌های معنایی (Semantic Tags)
• 16. Header, Nav, Main, Article, Section, Aside, Footer
• 17. متا تگ‌ها و اهمیت آنها (Charset, Viewport, Description)
• 18. کامنت‌گذاری در HTML و بهترین شیوه‌ها
• 19. کار با Iframes
• 20. کاراکترهای خاص و موجودیت‌های HTML (Entities)
• 21. اصول دسترسی‌پذیری (Accessibility) در HTML
• 22. اعتبار سنجی کدهای HTML (HTML Validation)
• 23. ساختاردهی یک وب‌سایت چند صفحه‌ای
• 24. بهترین شیوه‌ها و نکات پیشرفته HTML
• 25. اولین پروژه عملی: ساخت یک صفحه HTML استاتیک
• 26. معرفی CSS: شیوه نامه‌های آبشاری
• 27. روش‌های اتصال CSS به HTML (Inline, Internal, External)
• 28. انتخابگرهای CSS: تگ، کلاس و ID
• 29. انتخابگرهای ترکیبی (Combinators): Descendant, Child, Sibling
• 30. انتخابگرهای ویژگی (Attribute Selectors)
• 31. شبه‌کلاس‌ها (Pseudo-classes): Hover, Focus, Active, Visited
• 32. شبه‌عناصر (Pseudo-elements): Before, After, First-line, First-letter
• 33. مدل جعبه‌ای CSS (Box Model): Content, Padding, Border, Margin
• 34. وراثت (Inheritance) و خصوصیت (Specificity) در CSS
• 35. واحدهای اندازه‌گیری در CSS (px, em, rem, %, vw, vh)
• 36. مدیریت رنگ‌ها: Hex, RGB, RGBA, HSL, HSLA
• 37. استایل‌دهی متن و فونت‌ها (Font-family, Size, Weight, Line-height)
• 38. پس‌زمینه‌ها (Backgrounds): Color, Image, Repeat, Position, Size
• 39. خصوصیت Display: Block, Inline, Inline-block
• 40. موقعیت‌یابی عناصر (Positioning): Static, Relative, Absolute, Fixed, Sticky
• 41. Z-Index و مدیریت لایه‌ها
• 42. شناورسازی عناصر (Floats) و تکنیک Clearfix
• 43. مقدمه‌ای بر Flexbox برای طراحی ریسپانسیو
• 44. خصوصیات کانتینر Flexbox (Direction, Justify, Align-items, Wrap)
• 45. خصوصیات آیتم‌های Flexbox (Grow, Shrink, Basis, Order, Self)
• 46. مقدمه‌ای بر CSS Grid برای چیدمان‌های پیچیده
• 47. خصوصیات کانتینر Grid (Template-columns, Rows, Gap)
• 48. خصوصیات آیتم‌های Grid (Grid-column, Grid-row, Grid-area)
• 49. طراحی واکنش‌گرا (Responsive Design) و اصول آن
• 50. مدیا کوئری‌ها (Media Queries) و کاربرد آنها
• 51. رویکردهای Mobile-First و Desktop-First
• 52. بهینه‌سازی تصاویر برای طراحی واکنش‌گرا (srcset, picture)
• 53. انتقال‌های CSS (Transitions) برای جلوه‌های بصری
• 54. تبدیل‌های CSS (Transforms): Translate, Rotate, Scale, Skew
• 55. انیمیشن‌های CSS (Animations) و Keyframes
• 56. سایه‌ها (Shadows): Text-shadow, Box-shadow
• 57. گرادیانت‌ها (Gradients): خطی و شعاعی
• 58. متغیرهای CSS (Custom Properties)
• 59. معرفی پیش‌پردازنده‌های CSS (مانند Sass/SCSS)
• 60. آشنایی با فریمورک‌های CSS (مانند Bootstrap یا Tailwind - مفهوم کلی)
• 61. CSS Reset در مقابل Normalize
• 62. ابزارهای توسعه‌دهنده برای عیب‌یابی CSS
• 63. پروژه عملی: طراحی یک لایه ریسپانسیو با Flexbox و Grid
• 64. معرفی JavaScript: زبان تعامل‌پذیری وب
• 65. روش‌های اتصال JavaScript به HTML
• 66. متغیرها: var, let و const
• 67. انواع داده‌ها (Data Types): String, Number, Boolean, Null, Undefined
• 68. عملگرها (Operators): حسابی، انتسابی، مقایسه‌ای، منطقی
• 69. تبدیل نوع (Type Coercion)
• 70. دستورات شرطی: If, Else If, Else
• 71. دستور Switch
• 72. حلقه‌ها (Loops): For, While, Do-While
• 73. حلقه‌های For...of و For...in
• 74. توابع: اعلان (Declaration) در مقابل عبارت (Expression)
• 75. توابع Arrow (ES6)
• 76. محدوده (Scope): سراسری، محلی و بلوکی
• 77. Hoisting در JavaScript
• 78. آرایه‌ها: ایجاد و متدهای اصلی (Push, Pop, Shift, Unshift)
• 79. متدهای تکرار آرایه (ForEach, Map, Filter, Reduce)
• 80. آبجکت‌ها (Objects): خصوصیات و متدها
• 81. کار با JSON: تبدیل و تحلیل داده
• 82. معرفی DOM: مدل شیءگرای سند
• 83. انتخاب عناصر DOM (getElementById, querySelector, querySelectorAll)
• 84. دستکاری محتوا و ویژگی‌های عناصر (textContent, innerHTML, style)
• 85. ایجاد و افزودن عناصر جدید به DOM
• 86. حذف و جایگزینی عناصر در DOM
• 87. مدیریت رویدادها (Event Handling) با addEventListener
• 88. آبجکت Event و اطلاعات آن
• 89. رویدادهای پرکاربرد (Click, Mouseover, Keydown, Submit)
• 90. حباب‌زایی (Bubbling) و تسخیر (Capturing) رویدادها
• 91. نمایندگی رویداد (Event Delegation)
• 92. اعتبار سنجی فرم‌ها با JavaScript
• 93. ذخیره‌سازی در مرورگر: LocalStorage و SessionStorage
• 94. مقدمه‌ای بر JavaScript ناهمگام (Asynchronous JS)
• 95. Callbacks و چالش‌های آن
• 96. Promises: اصول و حالات (Pending, Resolved, Rejected)
• 97. Async/Await برای کدنویسی ناهمگام تمیزتر
• 98. استفاده از Fetch API برای درخواست‌های HTTP
• 99. مدیریت خطا (Error Handling) با Try...Catch
• 100. پروژه جامع نهایی: ساخت یک اپلیکیشن تعاملی (مانند To-Do List یا ماشین حساب ساده)