دوره پروژه محور: توسعه پنل مدیریت (Dashboard) حرفه‌ای با ری‌اکت و MUI همراه با فلش‌کارت آموزشی — ارائه روی فلش مموری

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

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

عنوان دوره: دوره پروژه محور: توسعه پنل مدیریت (Dashboard) حرفه‌ای با ری‌اکت و MUI

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

موضوع میانی: ری‌اکت (React)

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

• 1. آشنایی با مفاهیم پایه برنامه نویسی
• 2. مقدمه ای بر توسعه وب مدرن
• 3. نصب Node.js و npm/yarn
• 4. راه اندازی اولیه پروژه ری‌اکت با Create React App
• 5. مقدمه ای بر JSX
• 6. تفاوت JavaScript و JSX
• 7. ساختار کامپوننت ها در ری‌اکت
• 8. کامپوننت های تابعی (Functional Components)
• 9. کامپوننت های کلاسی (Class Components)
• 10. Props: ارسال داده به کامپوننت ها
• 11. State: مدیریت وضعیت داخلی کامپوننت ها
• 12. هوک ها (Hooks): معرفی و کاربرد
• 13. هوک useState
• 14. مدیریت رویدادها (Event Handling)
• 15. لیست ها و کلیدها (Lists and Keys)
• 16. شرایط رندرینگ (Conditional Rendering)
• 17. فرم ها در ری‌اکت (Forms in React)
• 18. ورودی های کنترل شده (Controlled Inputs)
• 19. ورودی های غیرکنترل شده (Uncontrolled Inputs)
• 20. کامپوننت های سطح بالاتر (Higher-Order Components - HOCs)
• 21. رندرینگ در سطح سرور (Server-Side Rendering - SSR)
• 22. مقدمه ای بر مدیریت وضعیت (State Management)
• 23. معرفی Context API
• 24. استفاده از Context API
• 25. مقدمه ای بر Redux
• 26. نصب Redux و React-Redux
• 27. ساختار Redux: Actions, Reducers, Store
• 28. نوشتن اولین Reducer
• 29. نوشتن اولین Action
• 30. اتصال Redux به ری‌اکت
• 31. استفاده از `useSelector` و `useDispatch`
• 32. مقدمه ای بر React Router DOM
• 33. نصب React Router DOM
• 34. تنظیم مسیرها (Routes)
• 35. لینک ها (Links) و ناوبری (Navigation)
• 36. پارامترهای مسیر (Route Parameters)
• 37. مسیرهای تودرتو (Nested Routes)
• 38. ناوبری برنامه ریزی شده (Programmatic Navigation)
• 39. مقدمه ای بر Material-UI (MUI)
• 40. نصب Material-UI
• 41. مقدمه ای بر سیستم گرید (Grid System) در MUI
• 42. استفاده از کامپوننت های پایه MUI (Button, Typography, etc.)
• 43. شخصی سازی کامپوننت های MUI
• 44. استفاده از Theme در MUI
• 45. معرفی کامپوننت های Layout MUI (Container, Box, etc.)
• 46. استفاده از کامپوننت ها برای ساختار پنل مدیریت
• 47. طراحی و پیاده سازی Header/Navbar
• 48. طراحی و پیاده سازی Sidebar Navigation
• 49. طراحی و پیاده سازی Main Content Area
• 50. معرفی کامپوننت Data Grid در MUI
• 51. نحوه استفاده از Data Grid برای نمایش داده ها
• 52. پیکربندی ستون ها در Data Grid
• 53. مرتب سازی و فیلترینگ در Data Grid
• 54. صفحه بندی (Pagination) در Data Grid
• 55. ویرایش درون خطی (Inline Editing) در Data Grid
• 56. معرفی کامپوننت Form Controls در MUI
• 57. پیاده سازی فرم های ورودی (TextField, Select, etc.)
• 58. اعتبارسنجی (Validation) فرم ها
• 59. استفاده از کامپوننت های Card برای نمایش اطلاعات
• 60. طراحی داشبوردهای ساده
• 61. استفاده از آیکون ها در MUI
• 62. مدیریت وضعیت کلی برنامه (Global State Management)
• 63. مفاهیم پایه API Interaction
• 64. انجام درخواست های HTTP با Fetch API
• 65. انجام درخواست های HTTP با Axios
• 66. مدیریت حالت های لودینگ (Loading States)
• 67. مدیریت خطاها (Error Handling) در درخواست های API
• 68. معرفی React Query (TanStack Query)
• 69. نصب React Query
• 70. استفاده از `useQuery` برای دریافت داده ها
• 71. استفاده از `useMutation` برای ارسال داده ها
• 72. Caching و Invalidation در React Query
• 73. مدیریت خطاها و لودینگ با React Query
• 74. مقدمه ای بر احراز هویت (Authentication)
• 75. پیاده سازی صفحه ورود (Login Page)
• 76. پیاده سازی صفحه ثبت نام (Register Page)
• 77. ذخیره سازی توکن احراز هویت (JWT)
• 78. محافظت از مسیرها (Protected Routes)
• 79. مقدمه ای بر مدیریت دسترسی (Authorization)
• 80. پیاده سازی سطوح دسترسی مختلف
• 81. نمایش یا مخفی کردن کامپوننت ها بر اساس نقش کاربر
• 82. مقدمه ای بر چرخه حیات کامپوننت ها (Lifecycle Methods - Class Components)
• 83. استفاده از `useEffect` Hook برای مدیریت Side Effects
• 84. پاکسازی (Cleanup) در `useEffect`
• 85. استفاده از `useRef` Hook
• 86. استفاده از `useCallback` و `useMemo` برای بهینه سازی
• 87. مقدمه ای بر تست نویسی (Testing)
• 88. معرفی Jest و React Testing Library
• 89. نوشتن اولین تست برای کامپوننت ها
• 90. تست تعاملات کاربر (User Interactions)
• 91. تست رسیدن (Rendering) کامپوننت ها
• 92. مقدمه ای بر Progressive Web Apps (PWAs)
• 93. اضافه کردن Service Worker
• 94. قابلیت نصب برنامه (App Installability)
• 95. بهینه سازی عملکرد (Performance Optimization)
• 96. Code Splitting
• 97. Lazy Loading Components
• 98. Memoization
• 99. مقدمه ای بر Type Checking با PropTypes
• 100. مقدمه ای بر Type Checking با TypeScript