فلش‌کارت‌های آموزشی آموزش جامع React با استفاده از Tailwind CSS برای ساخت رابط‌های کاربری پویا و واکنش‌گرا

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

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

عنوان دوره: دوره آموزش جامع React با استفاده از Tailwind CSS برای ساخت رابط‌های کاربری پویا و واکنش‌گرا

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

موضوع میانی: یادگیری و پیاده‌سازی کتابخانه‌های مدرن جاوا اسکریپت

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

• 1. مقدمه‌ای بر توسعهٔ وب و فرانت‌اند
• 2. مبانی HTML و ساختار صفحات وب
• 3. اصول CSS برای استایل‌دهی ظاهری
• 4. مقدمه‌ای بر جاوا اسکریپت و مفاهیم پایه
• 5. متغیرها، انواع داده و عملگرها در جاوا اسکریپت
• 6. ساختارهای کنترلی: شرط‌ها و حلقه‌ها
• 7. توابع در جاوا اسکریپت: تعریف و فراخوانی
• 8. کار با آرایه‌ها و اشیاء در جاوا اسکریپت
• 9. مفاهیم DOM و دستکاری عناصر صفحه
• 10. رویدادها در جاوا اسکریپت و مدیریت آن‌ها
• 11. مقدمه‌ای بر کتابخانه‌ها و فریم‌ورک‌های فرانت‌اند
• 12. چرا React؟ مزایا و کاربردها
• 13. نصب Node.js و npm/yarn
• 14. ایجاد اولین پروژه React با Create React App
• 15. ساختار پروژه React و فایل‌های اصلی
• 16. کامپوننت‌ها در React: مبانی و انواع
• 17. Props: انتقال داده بین کامپوننت‌ها
• 18. State: مدیریت وضعیت داخلی کامپوننت‌ها
• 19. مدیریت رویدادها در کامپوننت‌های React
• 20. کار با فرم‌ها در React
• 21. شرطی‌سازی رندرینگ در React
• 22. لیست‌ها و کلیدها (Keys) در React
• 23. مقدمه‌ای بر Hooks در React
• 24. هوک useState برای مدیریت وضعیت
• 25. هوک useEffect برای اثرات جانبی
• 26. هوک useContext برای مدیریت وضعیت سراسری
• 27. هوک useRef برای ارجاع به عناصر DOM
• 28. مقدمه‌ای بر Tailwind CSS
• 29. نصب و پیکربندی Tailwind CSS در پروژه React
• 30. اصول طراحی با Tailwind CSS: کلاس‌های کاربردی
• 31. استفاده از Grid و Flexbox با Tailwind CSS
• 32. طراحی واکنش‌گرا (Responsive Design) با Tailwind CSS
• 33. استفاده از کامپوننت‌های آماده Tailwind CSS
• 34. سفارشی‌سازی Tailwind CSS
• 35. مقدمه‌ای بر مسیریابی (Routing) در React
• 36. نصب React Router DOM
• 37. تعریف مسیرها و صفحات مختلف
• 38. لینک‌دهی بین صفحات
• 39. پارامترهای مسیر (Route Parameters)
• 40. مسیریابی تو در تو (Nested Routes)
• 41. مقدمه‌ای بر مدیریت وضعیت پیشرفته
• 42. معرفی Context API برای مدیریت وضعیت سراسری
• 43. استفاده از Context API با هوک useContext
• 44. مدیریت وضعیت پیچیده با Redux (مقدماتی)
• 45. مفاهیم اصلی Redux: Store, Actions, Reducers
• 46. اتصال React به Redux
• 47. آشنایی با React Hooks برای مدیریت وضعیت (تکمیلی)
• 48. مقدمه‌ای بر Fetch API و درخواست‌های HTTP
• 49. انجام درخواست‌های GET با Fetch API
• 50. ارسال داده با درخواست‌های POST
• 51. مدیریت خطاها در درخواست‌های شبکه
• 52. مقدمه‌ای بر ساخت API در بک‌اند (تئوری)
• 53. مفاهیم RESTful API
• 54. کار با داده‌های JSON
• 55. مقدمه‌ای بر احراز هویت و مجوزها (مفاهیم)
• 56. ذخیره‌سازی داده‌ها در مرورگر: Local Storage و Session Storage
• 57. مقدمه‌ای بر تست‌نویسی در React (مبانی)
• 58. تست واحد (Unit Testing) برای کامپوننت‌ها
• 59. تست ادغام (Integration Testing)
• 60. مقدمه‌ای بر معماری کامپوننت‌ها
• 61. کامپوننت‌های نمایشی (Presentational Components)
• 62. کامپوننت‌های کانتینر (Container Components)
• 63. الگوهای طراحی در React
• 64. مقدمه‌ای بر بهینه‌سازی عملکرد در React
• 65. استفاده از React.memo
• 66. استفاده از useCallback و useMemo
• 67. Lazy Loading و Code Splitting
• 68. مقدمه‌ای بر Server-Side Rendering (SSR) و Next.js (مفاهیم)
• 69. معرفی ابزارهای توسعهٔ وب (Developer Tools)
• 70. اشکال‌زدایی (Debugging) در React
• 71. کار با React DevTools
• 72. مقدمه‌ای بر اصول UI/UX (کاربرپسندی)
• 73. اهمیت دسترسی‌پذیری (Accessibility) در وب
• 74. اصول دسترسی‌پذیری با استفاده از Tailwind CSS
• 75. مقدمه‌ای بر استقرار (Deployment) برنامه‌های React
• 76. استفاده از Netlify یا Vercel
• 77. تنظیمات استقرار
• 78. مباحث پیشرفته‌تر در React (اشاره)
• 79. بررسی کتابخانه‌های جانبی محبوب React
• 80. معرفی ابزارهای مدیریت پروژه
• 81. آشنایی با مفاهیم CI/CD (مقدماتی)
• 82. مروری بر اصول برنامه‌نویسی تمیز (Clean Code)
• 83. نکات تکمیلی برای پروژه‌های واقعی
• 84. اصول طراحی رابط کاربری مدرن
• 85. کاربرد انیمیشن‌های ساده در React
• 86. مقدمه‌ای بر الگوهای طراحی واکنش‌گرا
• 87. اهمیت امنیت در برنامه‌های فرانت‌اند (مبانی)
• 88. راهکارهای جلوگیری از حملات رایج XSS
• 89. معرفی منابع یادگیری مداوم در حوزه فرانت‌اند
• 90. جمع‌بندی و گام‌های بعدی در مسیر توسعهٔ فرانت‌اند
• 91. پروژه‌های عملی برای تمرین بیشتر
• 92. تکنیک‌های پیشرفته‌تر در Tailwind CSS
• 93. استفاده از کامپوننت‌های سفارشی با Tailwind CSS
• 94. مدیریت وضعیت سراسری با Zustand (مقدماتی)
• 95. مقدمه‌ای بر GraphQL (مفاهیم)
• 96. کار با کتابخانه‌های نمودار (Charts)
• 97. مقدمه‌ای بر PWA (Progressive Web Apps)
• 98. اصول طراحی تجربه کاربری (UX) در React
• 99. مدیریت ریسورس‌های استاتیک در React
• 100. بهینه‌سازی تصاویر در وب