فلش‌کارت‌های آموزشی ساخت و استقرار صفحه معرفی واکنش‌گرا با React و Tailwind CSS

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

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

عنوان دوره: دوره ساخت و استقرار صفحه معرفی واکنش‌گرا با React و Tailwind CSS

موضوع کلی: توسعه وب و طراحی رابط کاربری

موضوع میانی: طراحی و پیاده‌سازی صفحات وب واکنش‌گرا

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

• 1. مقدمه‌ای بر توسعه وب مدرن
• 2. اصول طراحی رابط کاربری (UI)
• 3. مبانی طراحی تجربه کاربری (UX)
• 4. معرفی React و مفاهیم اصلی
• 5. نصب و راه‌اندازی محیط توسعه React
• 6. ساختار پروژه React
• 7. مقدمه‌ای بر کامپوننت‌ها در React
• 8. کامپوننت‌های تابعی (Functional Components)
• 9. کامپوننت‌های کلاسی (Class Components)
• 10. مدیریت وضعیت (State) در کامپوننت‌ها
• 11. Props و انتقال داده بین کامپوننت‌ها
• 12. هوک‌های React: useState
• 13. هوک‌های React: useEffect
• 14. هوک‌های React: useContext
• 15. مدیریت رویدادها در React
• 16. رندر شرطی (Conditional Rendering)
• 17. لیست‌ها و کلیدها (Lists and Keys)
• 18. فرم‌ها در React
• 19. مدیریت فرم‌ها با فرم‌های کنترل شده
• 20. مدیریت فرم‌ها با فرم‌های غیرکنترل شده
• 21. مقدمه‌ای بر Tailwind CSS
• 22. نصب و پیکربندی Tailwind CSS
• 23. کلاس‌های ابزاری (Utility Classes) در Tailwind CSS
• 24. سیستم گرید (Grid System) در Tailwind CSS
• 25. سیستم فلکس‌باکس (Flexbox System) در Tailwind CSS
• 26. طراحی واکنش‌گرا با Tailwind CSS
• 27. تنظیمات نمایش (Display Settings)
• 28. فاصله‌گذاری (Spacing) و حاشیه‌نویسی (Margin/Padding)
• 29. رنگ‌ها و تایپوگرافی
• 30. مؤلفه‌های UI آماده در Tailwind CSS
• 31. طراحی هدر (Header) واکنش‌گرا
• 32. طراحی فوتر (Footer) واکنش‌گرا
• 33. طراحی بخش قهرمان (Hero Section)
• 34. طراحی بخش ویژگی‌ها (Features Section)
• 35. طراحی بخش گواهینامه‌ها (Testimonials Section)
• 36. طراحی فرم تماس (Contact Form)
• 37. طراحی بخش درباره ما (About Us Section)
• 38. طراحی دکمه‌ها و لینک‌ها
• 39. طراحی کارت‌ها (Cards)
• 40. طراحی مودال‌ها (Modals)
• 41. طراحی ناوبری (Navigation)
• 42. انیمیشن‌ها و افکت‌های بصری با Tailwind CSS
• 43. اصول دسترسی‌پذیری (Accessibility) در طراحی وب
• 44. پیاده‌سازی دسترسی‌پذیری در React
• 45. بهینه‌سازی تصاویر برای وب
• 46. اصول سئو (SEO) در طراحی صفحات وب
• 47. مقدمه‌ای بر مسیریابی (Routing) در React
• 48. نصب و راه‌اندازی React Router DOM
• 49. مسیریابی پایه (Basic Routing)
• 50. مسیریابی پارامتریک (Parametric Routing)
• 51. مسیریابی تو در تو (Nested Routing)
• 52. مسیریابی محافظت شده (Protected Routes)
• 53. مدیریت خطا در مسیریابی
• 54. مقدمه‌ای بر مدیریت وضعیت پیشرفته
• 55. Redux Toolkit
• 56. استفاده از Context API برای مدیریت وضعیت
• 57. مقدمه‌ای بر تست نویسی در React
• 58. تست واحد (Unit Testing) کامپوننت‌ها
• 59. تست یکپارچگی (Integration Testing)
• 60. تست End-to-End (E2E)
• 61. مقدمه‌ای بر استقرار (Deployment)
• 62. انتخاب پلتفرم استقرار
• 63. استقرار در Netlify
• 64. استقرار در Vercel
• 65. استقرار در GitHub Pages
• 66. پیکربندی دامنه سفارشی
• 67. مقدمه‌ای بر CI/CD (Continuous Integration/Continuous Deployment)
• 68. پیاده‌سازی CI/CD با GitHub Actions
• 69. مدیریت متغیرهای محیطی (Environment Variables)
• 70. مانیتورینگ و لاگینگ برنامه
• 71. بهینه‌سازی عملکرد برنامه
• 72. تحلیل و رفع مشکلات عملکردی
• 73. اصول طراحی و پیاده‌سازی API (مقدماتی)
• 74. اتصال React به API های RESTful
• 75. مدیریت خطا در ارتباط با API
• 76. نکات پیشرفته در طراحی رابط کاربری
• 77. الگوهای طراحی UI/UX
• 78. مطالعات موردی طراحی صفحات معرفی
• 79. مرور ابزارهای طراحی UI
• 80. اصول ارتباط بصری
• 81. روانشناسی رنگ در طراحی
• 82. تایپوگرافی پیشرفته
• 83. طراحی برای موبایل اول (Mobile-First Design)
• 84. اصول بسته‌بندی (Bundling) با Webpack
• 85. مقدمه‌ای بر Vite
• 86. استفاده از Vite برای توسعه سریع
• 87. ساختاردهی مجدد پروژه برای مقیاس‌پذیری
• 88. مقدمه‌ای بر معماری میکروسرویس (مفهومی)
• 89. امنیت در توسعه وب (مقدماتی)
• 90. مدیریت داده‌های کاربر (با رعایت حریم خصوصی)
• 91. پروتکل‌های ارتباطی امن (HTTPS)
• 92. مرور قوانین مربوط به داده‌های کاربر
• 93. اصول اخلاقی در طراحی و توسعه
• 94. ملاحظات فرهنگی در طراحی جهانی
• 95. ساخت یک صفحه معرفی کامل (پروژه عملی)
• 96. تمرین‌های عملی پیاده‌سازی UI
• 97. تمرین‌های عملی واکنش‌گرایی
• 98. تمرین‌های عملی مسیریابی
• 99. تمرین‌های عملی مدیریت وضعیت
• 100. تمرین‌های عملی استقرار