فلش‌کارت‌های آموزشی ساخت وب‌سایت واکنش‌گرا با React، Styled Components و اسکرول روان

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

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

عنوان دوره: دوره ساخت وب‌سایت واکنش‌گرا با React، Styled Components و اسکرول روان

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

موضوع میانی: توسعه رابط کاربری مدرن با React

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

• 1. مبانی ساخت رابط کاربری مدرن با React
• 2. راه‌اندازی پروژه React از صفر
• 3. ساختار پوشه‌ها و معماری پروژه React
• 4. مدیریت وابستگی‌ها و پکیج‌های پروژه
• 5. مروری بر JSX و ساخت کامپوننت‌ها
• 6. طراحی کامپوننت‌های قابل استفاده مجدد
• 7. تقسیم رابط کاربری به کامپوننت‌های مستقل
• 8. مدیریت Props در کامپوننت‌های React
• 9. مدیریت State در رابط کاربری
• 10. استفاده از Hookهای پایه در React
• 11. مدیریت رویدادها در کامپوننت‌های React
• 12. ساخت نوار ناوبری واکنش‌گرا
• 13. ایجاد منوی موبایل با React
• 14. مدیریت باز و بسته شدن منوی موبایل
• 15. ساخت بخش Hero برای صفحه اصلی
• 16. طراحی بخش معرفی و محتوای اصلی صفحه
• 17. ساخت بخش خدمات یا ویژگی‌های محصول
• 18. طراحی کارت‌های محتوایی قابل استفاده مجدد
• 19. ساخت بخش‌های آماری و اطلاعاتی صفحه
• 20. طراحی بخش تماس و اطلاعات ارتباطی
• 21. ساخت Footer واکنش‌گرا
• 22. مبانی Styled Components
• 23. نصب و پیکربندی Styled Components
• 24. ساخت کامپوننت‌های استایل‌شده
• 25. استفاده از Props برای کنترل استایل‌ها
• 26. مدیریت تم و مقادیر مشترک در Styled Components
• 27. ایجاد استایل‌های قابل استفاده مجدد
• 28. استفاده از CSS پیشرفته در Styled Components
• 29. مدیریت حالت‌های Hover و Focus
• 30. پیاده‌سازی Media Query در Styled Components
• 31. طراحی Responsive از ابتدا
• 32. ساخت Layout واکنش‌گرا برای دسکتاپ و موبایل
• 33. تنظیم Breakpointهای مناسب برای صفحات مختلف
• 34. مدیریت اندازه فونت و فاصله‌ها در طراحی واکنش‌گرا
• 35. واکنش‌گرا کردن تصاویر و عناصر گرافیکی
• 36. حل مشکلات Overflow در صفحات واکنش‌گرا
• 37. طراحی ناوبری در صفحات کوچک
• 38. بهینه‌سازی تجربه کاربری موبایل
• 39. مبانی اسکرول روان در صفحات وب
• 40. ایجاد لینک‌های داخلی برای بخش‌های مختلف صفحه
• 41. پیاده‌سازی Smooth Scroll با CSS
• 42. پیاده‌سازی Smooth Scroll با JavaScript و React
• 43. اتصال منوی ناوبری به بخش‌های صفحه
• 44. مدیریت رفتار اسکرول هنگام کلیک روی لینک‌ها
• 45. تنظیم Offset برای ناوبری ثابت
• 46. پیاده‌سازی Scroll-to-Section در React
• 47. مدیریت وضعیت منو هنگام اسکرول
• 48. طراحی Header ثابت و واکنش‌گرا
• 49. هماهنگ‌سازی Header با Smooth Scroll
• 50. ایجاد ساختار صفحه تک‌صفحه‌ای با React
• 51. مدیریت ترتیب و چیدمان بخش‌های صفحه
• 52. ساخت کامپوننت‌های Layout مشترک
• 53. مدیریت داده‌های تکرارشونده در کامپوننت‌ها
• 54. استفاده از آرایه‌ها برای تولید عناصر رابط کاربری
• 55. استفاده صحیح از Key در لیست‌های React
• 56. مدیریت تصاویر و Assetهای پروژه
• 57. انتخاب ساختار مناسب برای فایل‌های CSS و Style
• 58. یکپارچه‌سازی React و Styled Components
• 59. ساخت یک صفحه Landing Page کامل
• 60. بهینه‌سازی ظاهر بصری کامپوننت‌ها
• 61. ایجاد تعاملات کاربری در صفحه
• 62. مدیریت وضعیت‌های مختلف عناصر رابط کاربری
• 63. رفع مشکلات رایج در Responsive Design
• 64. رفع مشکلات رایج در Smooth Scroll
• 65. بهینه‌سازی ساختار کامپوننت‌ها
• 66. بهینه‌سازی عملکرد رندر کامپوننت‌های React
• 67. بهبود دسترس‌پذیری عناصر تعاملی
• 68. مدیریت Focus در منوی واکنش‌گرا
• 69. استفاده از Semantic HTML در کامپوننت‌های React
• 70. بهینه‌سازی تصاویر و منابع صفحه
• 71. بررسی عملکرد صفحه در دستگاه‌های مختلف
• 72. تست رابط کاربری در اندازه‌های مختلف نمایشگر
• 73. رفع خطاهای رایج در اجرای پروژه
• 74. ساخت نسخه نهایی وب‌سایت واکنش‌گرا
• 75. بازبینی معماری و کد پروژه
• 76. آماده‌سازی پروژه React برای Build
• 77. ساخت و اجرای نسخه Production
• 78. استقرار وب‌سایت React
• 79. بهینه‌سازی نهایی تجربه کاربری و عملکرد