دوره آموزشی
آموزش های یودمی
دوبله زبان فارسی

دوره کامل پروژه های ری اکت، Next.js و تایپ اسکرپیت در 2025

دوره کامل پروژه های ری اکت، Next.js و تایپ اسکرپیت در 2025

✅ سرفصل و جزئیات آموزش

آنچه یاد خواهید گرفت:

  • ساخت پروژه‌های عالی با استفاده از React

پیش‌نیازهای دوره

  • آشنایی قوی با HTML ،CSS و JS الزامی است. ES6 اختیاری است.

توضیحات دوره

محتوای جدید و هیجان‌انگیز در دوره React

در ادامه می‌توانید منتظر چه مواردی باشید:

  • آموزش جامع TypeScript
  • درس‌های مفصل درباره React همراه با TypeScript
  • آموزش کامل Next.js با TypeScript
  • چند پروژه پیچیده در Next.js
  • بیش از 30 ساعت محتوای جدید !!!

با آخرین استانداردهای صنعت همگام باشید و مهارت‌های لازم برای توسعه مدرن React را به‌خوبی یاد بگیرید!

چه چیزهای جدیدی آمده‌اند؟

ادغام TypeScript:

  • آموزش TypeScript: مبانی و ویژگی‌های پیشرفته TypeScript را بیاموزید.
  • React با TypeScript: نحوه ادغام TypeScript با React برای ساخت برنامه‌های مقاوم و مطمئن را تسلط پیدا کنید.

آموزش‌های Next.js:

  • Next.js با TypeScript: آموزش‌های جامع ساخت برنامه‌های Next.js با استفاده از TypeScript.
  • پروژه‌های پیچیده Next.js: روی پروژه‌های واقعی کار کنید که از تمام قابلیت‌های Next.js بهره می‌برند.

چرا؟

  • استانداردهای صنعتی: هر دو، TypeScript و Next.js، مهارت‌های ضروری برای توسعه مدرن React شده‌اند.
  • ویژگی‌های جدید React: بسیاری از قابلیت‌های جدید React فقط از طریق فریم‌ورک‌هایی مانند Next.js در دسترس است.
  • توسعه فول استک: Next.js امکان توسعه سریع‌تر و بهینه‌تر فول‌استک را با کنار هم بودن کدهای سمت سرور و کلاینت به‌صورت همزمان فراهم می‌کند.
  • افزایش کارایی تیم: TypeScript باعث افزایش نگهداری کد و همکاری بهتر می‌شود که این موضوع آن را به انتخابی محبوب برای تیم‌های بزرگ تبدیل کرده است.

تسلط به React 18: ساخت وباپلیکیشن های مدرن

با دوره جامع ما در زمینه React 18 وارد دنیای پویا و متحول توسعه فرانت‌اند شوید. React کتابخانه‌ی پیشرفته‌ای در جاوااسکریپت برای ساخت رابط‌های کاربری جذاب است که توسط فیسبوک توسعه داده و نگه‌داری می‌شود. این کتابخانه به‌عنوان پایه‌ای مهم در ساخت اپلیکیشن های تک‌صفحه‌ای و اپلیکیشن های موبایل شناخته شده است.

چرا باید React یاد بگیریم؟

  • تقاضای بالا: محبوبیت React آن را به مهارتی ارزشمند برای جویندگان کار در صنعت فناوری تبدیل کرده است.
  • کارایی و عملکرد: استفاده React از DOM مجازی باعث توسعه سریع، مقیاس‌پذیر و کارآمد برنامه‌ها می‌شود.
  • انعطاف‌پذیری و قابلیت استفاده مجدد: ساختار این کتابخانه اجازه می‌دهد کامپوننت‌های قابل استفاده مجدد بسازید که فرآیند توسعه را ساده کرده و نگهداری کد را آسان‌تر می‌کند.

محتوای دوره:

  • مبانی React: درک اصول پایه‌ای React
  • ویژگی‌های جدید: کار عملی با React 18
  • هوک‌ها و مدیریت State: بررسی عمیق useState ،useEffect ،useRef ،useReducer ،useCallback ،useMemo و هوک‌های سفارشی
  • مفاهیم پیشرفته: آموزش رندر شرطی، prop drilling ،context API و موارد دیگر
  • ناوبری و مسیردهی: معرفی React Router 6 برای ناوبری روان در اپلیکیشن
  • مدیریت داده‌ها: استفاده از axios و redux-toolkit برای مدیریت داده‌ها به‌صورت بهینه
  • یادگیری مبتنی بر پروژه: ساخت بیش از 25 پروژه واقعی از جمله Birthday Reminder، سایت فروشگاهی، اپلیکیشن آزمون و کاوشگر کاربران Github

مناسب برای:

توسعه‌دهندگان فرانت‌اند مبتدی و حرفه‌ای که به دنبال تسلط بر React و ارتقای مهارت‌های توسعه وب خود هستند. چه بخواهید آینده شغلی خود را بهبود بخشید و چه بخواهید برنامه‌های وب پرکاربرد بسازید، این دوره دروازه ورود شما به دنیای توسعه‌دهنده حرفه‌ای React است.

تمام معرفی پروژه‌ها برای مشاهده اولیه در دسترس است.

برخی از پروژه‌هایی که در این دوره خواهیم ساخت:

1. Birthday Buddy

2. Tours

3. Reviews

4. آکاردئون

5. Menu

6. Tabs

7. اسلایدر

8. Lorem Ipsum

9. Color Generator

10. Grocery Bud

11. Navbar

12. Sidebar و Modal

13. Strapi Menu

14. Cart

15. Unsplash Images

16. Contentful CMS

17. Mix Master

18. Tailwind Portfolio

19. E-Commerce

20. Jobster

21. Github Users

22. Jobster

23. پروژه کامل فول‌استک Next.js E-Commerce

این دوره برای چه کسانی مناسب است؟

  • همه کسانی که می‌خواهند React را یاد بگیرند.

دوره کامل پروژه های ری اکت، Next.js و تایپ اسکرپیت در 2025

  • React چیست؟ 06:04
  • اهداف 02:22
  • ساختار 01:01
  • پیش‌نیازها 01:52
  • رفع تاری ویدئو 01:35
  • مرور دوره 00:30
  • اطلاعات گردش کاری 00:32
  • مرورگر 00:55
  • VS Code 01:52
  • ترمینال 01:15
  • Node.js 03:43
  • Create-React-App 11:16
  • معرفی 00:58
  • ساختار پوشه 08:59
  • حذف Boilerplate 02:27
  • اولین کامپوننت 10:13
  • اولین آزمون None
  • افزونه‌ها و تنظیمات 12:53
  • تابع ایجاد عنصر 04:30
  • قواعد JSX 09:41
  • افزونه‌ها، تنظیمات و بهترین شیوه‌های JSX None
  • کامپوننت‌های تو در تو 04:03
  • ابزارهای توسعه‌دهنده React 02:12
  • BookList 10:25
  • کامپوننت‌های تو در تو و ابزار توسعه‌دهنده React None
  • CSS 10:32
  • تصاویر محلی (پوشه public) 07:16
  • JSX - CSS 07:27
  • JSX - جاوااسکریپت 06:30
  • CSS و استایل‌دهی در React با JSX None
  • Propها - راه‌اندازی پایه 09:40
  • Prop ها - راه‌اندازی نسبتا داینامیک 04:29
  • Props - چندین رویکرد 04:45
  • Children Prop 06:30
  • درک props در React None
  • لیست ساده 08:35
  • لیست صحیح 06:25
  • Key Prop 04:07
  • آبجکت به عنوان Prop 05:34
  • درک لیست‌ها و props در React None
  • مبانی رویداد 13:08
  • ارسال فرم 05:50
  • ارسال فرم - مثال دکمه 03:41
  • تابع ناشناس (arrow) 03:20
  • ویژگی‌های کامپوننت‌ها 05:08
  • مدیریت رویداد در React و مبانی None
  • Prop Drilling 05:40
  • مثال پیچیده - معرفی 02:02
  • مثال پیچیده - باگ 03:42
  • مثال پیچیده - رفع اشکال 03:21
  • انتقال props در React None
  • ماژول‌های ES6 09:58
  • تصاویر محلی (پوشه src) 05:42
  • چالش اعداد 06:28
  • چالش عنوان 02:25
  • دستورات Import و Export در React None
  • پوشه Build 02:33
  • استقرار 02:46
  • اصول React None
  • معرفی 01:57
  • راه‌اندازی 00:26
  • نصب 03:20
  • کد پایه SRC 08:14
  • ساختار 10:50
  • کامپوننت‌ها 06:32
  • لوگوی Nav 02:36
  • اسکرول نرم 03:21
  • لینک‌های صفحات 07:34
  • لینک‌های شبکه اجتماعی 07:26
  • کامپوننت‌های Hero و درباره ما 02:16
  • کامپوننت عنوان 04:30
  • کامپوننت خدمات 04:10
  • کامپوننت تورها 07:55
  • کامپوننت فوتر 05:01
  • رویکرد جایگزین - کامپوننت لینک‌های صفحه 07:04
  • رویکرد جایگزین - کامپوننت‌های بیشتر 12:09
  • راه‌اندازی استقرار مداورم 05:57
  • استقرار مداورم - مزایا 05:27
  • اشتباهات استقرار مداورم 04:55
  • معرفی VITE 01:53
  • VITE - نصب / راه‌اندازی 08:49
  • معرفی 00:52
  • راه‌اندازی 02:31
  • مرور کلی 08:53
  • نمونه خطا 03:37
  • مبانی useState 09:54
  • رندر اولیه و رندرهای مجدد 03:01
  • قواعد کلی هوک‌های React 02:36
  • مثال آرایه useState - راه‌اندازی 06:12
  • مثال آرایه useState - کامل 07:29
  • اطلاعات اضافی useState 01:31
  • مثال آبجکت useState - راه‌اندازی 05:17
  • اطلاعات Auto Batching 01:27
  • مثال آبجکت در useState - کامل 05:54
  • توابع تنظیم UseState - اشتباهات متداول 03:15
  • فرم بروزرسانی تابعی useState 04:21
  • useState - مثال SetTimeout 04:13
  • مبانی مدیریت State در React None
  • مثال کد 06:00
  • مبانی useEffect 07:02
  • هوک useEffect - چندین افکت 03:57
  • چالش واکشی با useEffect - معرفی 03:34
  • چالش واکشی داده با useEffect - کامل 09:19
  • اطلاعات پاک‌سازی useEffect 01:15
  • مسابقه React useEffect None
  • بازگشت‌های متعدد 05:44
  • بازگشت‌های متعدد - راه‌اندازی واکشی داده 03:38
  • بازگشت‌های متعدد - واکشی داده 09:09
  • خطای واکشی داده 04:01
  • اهمیت سفارش 06:46
  • لوکیشن تابع واکشی 02:54
  • قوانین هوک‌های React 02:16
  • مسابقه رندر شرطی و واکشی داده None
  • Vanilla.js (اختیاری) 05:17
  • مرور کوتاه بر Short Circuit 05:22
  • مثال‌های Short Circuit 07:41
  • عملگر شرطی سه‌تایی 04:04
  • چالش تغییر وضعیت 05:45
  • چالش کاربر 05:49
  • تابع پاکسازی useEffect - راه‌اندازی/چالش 06:40
  • useEffect - مثال تایمر 05:30
  • useEffect - مثال شنونده رویدادها 03:29
  • ممکن است نیازی به Effect نداشته باشید 03:36
  • مسابقه رندر شرطی React و منطق Short-Circuit None
  • ساختار پروژه - نمونه پوشه 06:22
  • ساختار پروژه - صادرات نام‌گذاری شده 04:22
  • ساختار پروژه - گروه صادراتی 06:43
  • مسابقه ساختار پروژه React و روش‌های خروجی گرفتن None
  • مقدمه‌ای بر استفاده بهینه از جاوااسکریپت 04:59
  • چالش استفاده بهینه از جاوااسکریپت 07:12
  • استفاده بهینه از جاوااسکریپت - کامل 10:06
  • مسابقه استفاده بهینه از جاوااسکریپت None
  • فرم‌ها - راه‌اندازی 05:01
  • ورودی‌های کنترل‌شده 10:02
  • چالش کاربر - راه‌اندازی 02:48
  • چالش کاربر - افزودن کاربر جدید 09:20
  • چالش کاربر - حذف کاربر 02:08
  • چندین ورودی 11:54
  • ورودی چک‌باکس 03:40
  • ورودی انتخاب 04:38
  • FormData API 11:11
  • ورودی‌ها و فرم‌های کنترل‌شده در React None
  • هوک useRef - نود DOM 07:22
  • هوک useRef - رندر اولیه 04:53
  • مفاهیم پایه React useRef None
  • هوک‌های سفارشی - Toggle 05:55
  • هوک‌های سفارشی - واکشی Person 06:47
  • هوک‌های سفارشی - واکشی Generic 03:27
  • مسابقه هوک‌های سفارشی React None
  • چالش Context API 02:51
  • Context API - بررسی Prop Drilling 11:04
  • راه‌حل Context API 08:06
  • هوک سفارشی Context API 03:05
  • Context API - راه‌اندازی سراسری 11:34
  • مسابقه React Context API None
  • معرفی useReducer 02:29
  • چالش useReducer 05:16
  • راه‌اندازی useReducer 09:52
  • مبانی Reducer 09:47
  • عملیات و State پیش‌فرض 05:26
  • بازنشانی لیست 01:34
  • حذف Person 04:25
  • Import یا Export 04:45
  • درک هوک useReducer در React None
  • مقدمه‌ای بر عملکرد 00:40
  • رندر مجدد کامپوننت 05:02
  • ابزارهای توسعه‌دهنده React 04:20
  • Lower State 03:36
  • چالش Lower State 05:20
  • ()React.memo 03:43
  • Mind Grenade 05:11
  • هوک UseCallback 05:20
  • هوک useCallback - کاربرد متداول 02:21
  • هوک useMemo 05:28
  • هوک UseTransition 07:57
  • React Suspense 09:27
  • کوییز عملکرد React None
  • آزمون تمرینی React None
  • معرفی 03:01
  • راه‌اندازی 13:44
  • راه‌اندازی - فایل Figma 02:06
  • راه‌اندازی Birthday Buddy 01:55
  • Birthday Buddy - وارد کردن لیست 05:02
  • Birthday Buddy - رندر لیست 06:16
  • Birthday Buddy - پاک‌سازی لیست 02:24
  • Birthday Buddy - CSS (اختیاری) 13:48
  • Tours - راه‌اندازی 01:11
  • Tours - واکشی تورها 07:45
  • Tours - رندر تورها 11:55
  • Tours - حذف تور 03:59
  • Tours - ادامه مطلب 06:32
  • Tours - واکشی مجدد 04:34
  • Tours - CSS (اختیاری) 18:37
  • نقدها - راه‌اندازی 00:53
  • نقدها - داده‌ها 03:21
  • نقدها - آیکون‌های React 03:46
  • نقدها - First Person 04:30
  • نقدها - قبلی و بعدی 05:06
  • نقدها - بررسی شماره 04:18
  • نقدها - Person تصادفی 04:02
  • نقدها - عملگر مدولوس 06:22
  • نقدها - CSS (اختیاری) 13:10
  • سوالات - راه‌اندازی 00:56
  • سوالات - رندر لیست 07:31
  • سوالات - Toggle 04:16
  • سوالات - راه‌اندازی جایگزین 11:05
  • سوالات - CSS (اختیاری) 08:40
  • منو - راه‌اندازی 00:44
  • منو - کامپوننت عنوان 03:26
  • منو - رندر آیتم‌ها 06:34
  • منو - دسته‌بندی های منحصر به فرد 07:05
  • منو - نمایش دسته‌بندی ها 02:57
  • منو - فیلتر آیتم‌ها 05:12
  • منو - CSS (اختیاری) 10:47
  • تب‌ها - راه‌اندازی 00:46
  • تب‌ها - واکشی شغل‌ها 06:39
  • تب‌ها - نمایش شغل 05:55
  • تب‌ها - وظایف و کتابخانه UUID 06:46
  • تب‌ها - کانتینر دکمه 02:27
  • تب‌ها - آیتم فعلی 04:48
  • تب‌ها - CSS (اختیاری) 12:57
  • اسلایدر - راه‌اندازی 01:39
  • اسلایدر - ساختار 10:07
  • اسلایدر - CSS 12:04
  • اسلایدر - منطق اولیه 06:11
  • اسلایدر - آیتم جاری و قبلی/بعدی 08:16
  • اسلایدر - اسلاید خودکار (autoplay) 03:37
  • اسلایدر - اطلاعات کتابخانه 01:06
  • اسلایدر - راه‌اندازی React Slick 09:06
  • اسلایدر - React Slick کامل 09:05
  • Lorem Ipsum - راه‌اندازی 00:56
  • Lorem Ipsum - ساختار 06:42
  • Lorem Ipsum - ارسال فرم 06:43
  • Lorem Ipsum - کتابخانه Nanoid 01:52
  • Lorem Ipsum - CSS (اختیاری) 05:26
  • Color Generator - راه‌اندازی 01:49
  • Color Generator - ساختار فرم 06:59
  • Color Generator - ورودی رنگ HTML 02:38
  • Color Generator - کتابخانه Values.js 03:27
  • Color Generator - رندر لیست 08:46
  • Color Generator - React Toastify 04:54
  • Color Generator - تغییر/افزودن رنگ 06:47
  • Color Generator - API کلیپ‌بورد 03:58
  • Color Generator - CSS (اختیاری) 10:15
  • Grocery Bud - راه‌اندازی 01:21
  • Grocery Bud - کامپوننت فرم 06:48
  • Grocery Bud - افزودن آیتم 08:03
  • Grocery Bud - رندر آیتم‌ها 04:05
  • Grocery Bud - آیتم تکی 05:41
  • Grocery Bud - حذف آیتم 01:36
  • Grocery Bud - ذخیره‌سازی محلی 11:47
  • Grocery Bud - ویرایش آیتم (راه‌اندازی کلی) 05:30
  • Grocery Bud - React Toastify 03:56
  • Grocery Bud - CSS (اختیاری) 08:43
  • نوار ناوبری - راه‌اندازی 01:19
  • نوار ناوبری - داده‌ها 02:08
  • نوار ناوبری - راه‌اندازی اولیه 10:01
  • نوار ناوبری - راه‌اندازی اولیه CSS 05:44
  • نوار ناوبری - تنظیمات ثابت 06:05
  • نوار ناوبری - راه‌اندازی داینامیک 08:19
  • نوار ناوبری - سوال 05:19
  • نوار ناوبری - اپلیکیشن کامل 11:44
  • سایدبار/مودال - راه‌اندازی 00:56
  • سایدبار/مودال - کامپوننت‌ها 02:44
  • سایدبار/مودال - کانتکست سراسری 06:57
  • سایدبار/مودال - کامپوننت صفحه اصلی 06:13
  • سایدبار/مودال - کامپوننت مودال 15:04
  • سایدبار/مودال - JSX کامپوننت سایدبار 05:37
  • سایدبار/مودال - CSS سایدبار 09:11
  • سایدبار/مودال - Toggle سایدبار 02:24
  • Strapi - راه‌اندازی 01:03
  • Strapi - داده‌ها 01:43
  • Strapi - کانتکست سراسری 04:49
  • Strapi - کامپوننت‌ها 06:13
  • Strapi - CSS نوار ناوبری 05:47
  • Strapi - Hero 05:58
  • Strapi - JSX سایدبار 08:15
  • Strapi - استایل سایدبار 10:56
  • Strapi - لینک‌های ناوبری 08:10
  • Strapi - منطق PageId 03:34
  • Strapi - JSX زیرمنو 08:12
  • Strapi - CSS زیرمنو 10:10
  • Strapi - مخفی کردن زیرمنو (بخش اول) 06:54
  • Strapi - مخفی کردن زیرمنو (بخش دوم) 12:13
  • معرفی سبد خرید 00:51
  • سبد خرید - راه‌اندازی 05:33
  • سبد خرید - کانتکست سراسری 03:14
  • سبد خرید - راه‌اندازی useReducer 06:30
  • سبد خرید - راه‌اندازی عملیات 04:22
  • سبد خرید - ساختار داده‌ها 03:50
  • سبد خرید - آبجکت Map 06:42
  • سبد خرید - سوئیچ به ()Map 05:25
  • سبد خرید - پاک کردن سبد 04:09
  • سبد خرید - حذف آیتم 07:34
  • سبد خرید - افزایش مقدار 04:22
  • سبد خرید - کاهش مقدار 03:26
  • سبد خرید - محاسبه مجموع ها 07:35
  • سبد خرید - ساختار واکشی 04:36
  • سبد خرید - واکشی کامل 04:27
  • سبد خرید - CSS (اختیاری) 17:30
  • معرفی 01:17
  • شروع‌کننده 00:35
  • راه‌اندازی 02:15
  • درخواست GET 10:37
  • راه‌اندازی هدرها 05:11
  • درخواست POST 06:18
  • مقدار پیش‌فرض سراسری 06:25
  • نسخه سفارشی 07:11
  • Interceptor ها 10:01
  • معرفی 02:43
  • شروع‌کننده 00:37
  • سرور (بک‌اند) - راه‌اندازی 06:46
  • اپلیکیشن تسک‌ها (فرانت‌اند) - راه‌اندازی 04:29
  • نسخه اختصاصی Axios 05:09
  • متدهای HTTP 07:55
  • API Docs 06:23
  • معرفی React Query 03:00
  • نصب و راه‌اندازی React Query 01:55
  • اولین کوئری 07:22
  • رندر داده 05:30
  • مدیریت خطا 05:56
  • Thunder Client 03:57
  • ایجاد تسک - چالش 08:27
  • ایجاد تسک - راه‌اندازی اولیه 09:02
  • UseMutation Helpers 08:27
  • ویرایش تسک - چالش 04:35
  • ویرایش تسک - کامل 05:31
  • حذف تسک 04:53
  • ریفکتور 12:42
  • راه‌اندازی سرور جایگزین 02:19
  • معرفی 00:34
  • دانلود 00:16
  • شروع‌کننده 01:21
  • ساختار 05:10
  • تم تاریک - راه‌اندازی اولیه 06:07
  • تم تاریک - اضافه/حذف کلاس 04:13
  • تم تاریک - CSS 10:42
  • تم تاریک - ترجیح کاربران به حالت تاریک (CSS) 02:39
  • فرم جستجو 06:55
  • اطلاعات API Unsplash 00:28
  • ثبت‌نام API Unsplash 00:41
  • دریافت آدرس صحیح 08:03
  • راه‌اندازی React Query 02:47
  • راه‌اندازی کوئری 03:29
  • رندر تصاویر 05:39
  • ابزارهای توسعه‌دهنده React Query 02:15
  • راه‌اندازی مقدار جستجوی سراسری 05:15
  • فیکس کردن UseQuery 04:04
  • حالت تاریک - بررسی جاوااسکریپت 05:25
  • ذخیره‌سازی محلی 03:10
  • متغیرهای محیطی (ENV Variables) 05:26
  • استقرار 05:25
  • CSS (اختیاری) 11:31
  • معرفی 01:42
  • شروع‌کننده 00:21
  • راه‌اندازی 00:50
  • کامپوننت Hero 04:35
  • Undraw 01:54
  • داده‌های پروژه 04:51
  • Headless CMS 01:28
  • ساخت حساب کاربری Contentful 00:43
  • نوع محتوا 04:31
  • محتوا 05:51
  • مستندات API Contenful 06:49
  • نصب و راه‌اندازی SDK Contentful 04:06
  • واکشی پروژه‌ها 09:22
  • رندر پروژه‌ها 03:54
  • استقرار 05:59
  • Webhooks 04:17
  • CSS (اختیاری) 10:29
  • معرفی 01:08
  • راه‌اندازی 00:30
  • شروع‌کننده 00:55
  • اطلاعات SPA و React Router 03:11
  • روتر پایه 04:39
  • راه‌اندازی صفحات 06:31
  • کامپوننت لینک 03:40
  • صفحات تو در تو 08:50
  • صفحات تو در تو - مثال پیچیده‌تر 03:23
  • نوار ناوبری 05:02
  • راه‌اندازی Styled Components 05:41
  • بسته‌بندی Styled Components 04:41
  • CSS نوار ناوبری (اختیاری) 09:08
  • صفحه درباره ما 02:17
  • طرح صفحه 03:06
  • صفحه خطا 06:21
  • صفحه خطا - CSS 04:26
  • اطلاعات لودر 04:59
  • لودر - صفحه فرود 01:35
  • بررسی CocktailDB 02:15
  • واکشی نوشیدنی‌ها 05:00
  • خطای صفحه تکی 06:33
  • لیست کوکتل 07:18
  • کارت کوکتل 05:10
  • لیست کوکتل و CSS کارت کوکتل (اختیاری) 05:53
  • بارگذاری سراسری و کانتکست 06:32
  • کوکتل تک - راه‌اندازی 07:15
  • رندر کوکتل تک 04:52
  • چالش مواد اولیه 07:14
  • بررسی اضافه 05:00
  • CSS کوکتل تکی (اختیاری) 05:17
  • راه‌اندازی React Toastify 01:36
  • ساختار خبرنامه 05:56
  • ارسال فرم HTML 04:35
  • عملیات - راه‌اندازی 08:24
  • ارسال فرم 06:37
  • مدیریت خطاها 08:50
  • State ناوبری 02:10
  • ساختار فرم جستجو 04:08
  • فرم جستجو - کامل 06:56
  • CSS فرم جستجو (اختیاری) 02:06
  • راه‌اندازی React Query 05:15
  • React Query - راه‌اندازی صفحه فرود 07:34
  • React Query - صفحه فرود کامل 05:02
  • React Query - صفحه تک کوکتل 05:48
  • ریدایرکت‌ها 01:01
  • معرفی پروژه 01:37
  • مقدمه Tailwind 09:52
  • راه‌اندازی پروژه 07:02
  • دارایی‌های اضافی 04:46
  • نوار ناوبری 13:29
  • Hero 09:04
  • کلاس سفارشی 02:01
  • بخش مهارت‌ها 11:07
  • بخش درباره ما 03:49
  • بخش پروژه‌ها 09:57
  • معرفی 02:44
  • Github 00:20
  • راه‌اندازی 02:46
  • نصب 03:46
  • استور 03:31
  • قطعه اول 07:39
  • ابزارهای توسعه‌دهنده Redux 01:40
  • هوک useSelector 08:37
  • آیکون‌های Hero 03:04
  • آیتم‌های سبد خرید - داده محلی 02:15
  • کانتینر سبد خرید 09:08
  • آیتم سبد خرید 03:24
  • Reducers - پاک کردن سبد خرید 07:38
  • Reducers - بازگرداندن State 02:45
  • Reducers - حذف آیتم 06:38
  • Reducers - افزایش و کاهش 06:20
  • Reducers - محاسبه مجموع‌ها 06:08
  • راه‌اندازی مودال 02:28
  • مودال کامل 09:29
  • createAsyncThunk 13:03
  • createAsyncThunk - گزینه‌های بیشتر 09:24
  • نوتیشن کال‌بک Builder 05:27
  • معرفی 06:30
  • DaisyUI 09:51
  • دارایی‌ها 01:43
  • VITE + TailwindCSS 04:35
  • راه‌اندازی DaisyUI 01:48
  • نصب وابستگی‌ها 00:48
  • ایجاد صفحات 07:20
  • ساختار مسیر 11:19
  • صفحه خطا 07:02
  • ورودی فرم 05:38
  • صفحه لاگین 09:59
  • دکمه ارسال 03:42
  • صفحه ثبت نام 05:39
  • کلاس سفارشی 02:36
  • کامپوننت هدر 05:30
  • ساختار نوار ناوبری 12:23
  • کامپوننت لینک‌های ناوبری 04:31
  • کامپوننت Toggle 03:41
  • افزودن تم 03:12
  • تنظیم تم 06:43
  • صفحه درباره ما 04:19
  • کامپوننت Hero 09:35
  • آدرس پایه (Base URL) 06:49
  • لودر صفحه فرود 09:56
  • محصولات ویژه 12:24
  • فرمت قیمت 03:35
  • واکشی محصول تکی 08:42
  • رندر محصول تکی 05:15
  • محصول تک - رنگ‌ها 05:43
  • محصول تکی - مقدار 06:23
  • ایجاد ورودی‌های مقدار 04:32
  • صفحه محصولات - راه‌اندازی 08:06
  • لیست محصولات 11:35
  • کانتینر محصولات 09:50
  • فیلترها - ورودی جستجو 08:31
  • فیلترها - ورودی انتخاب 08:44
  • فیلترها - ورودی بازه 08:17
  • فیلترها - ورودی چک‌باکس 03:42
  • بارگذاری سراسری 03:27
  • فیلترها - پارامترها 14:10
  • صفحه‌بندی - راه‌اندازی 09:26
  • صفحه‌بندی - کامل 07:17
  • راه‌اندازی Redux Toolkit 09:22
  • عملکرد افزودن به سبد خرید 05:09
  • AddItem Reducer 08:34
  • ریفکتور و ذخیره‌سازی محلی 06:26
  • ردیوسرهای پاک، حذف و ویرایش 09:13
  • صفحه سبد خرید 09:04
  • مجموع سبد خرید 05:13
  • آیتم‌های سبد خرید - راه‌اندازی 14:41
  • آیتم‌های سبد خرید - عملکرد 04:12
  • راه‌اندازی User Slice 05:26
  • ریفکتور Toggle تم 05:22
  • خروج و دسترسی به کاربر 14:25
  • ثبت نام کاربر - مستندات 06:46
  • ثبت نام کاربر - کامل 06:02
  • راه‌اندازی ورود کاربر 02:36
  • دسترسی به Store در Redux Toolkit در اکشن 05:19
  • صفحه ورود - عملیات کامل 06:35
  • ورود کاربر - Reducer 04:02
  • کاربر نمونه 06:20
  • صفحه تسویه حساب - راه‌اندازی 05:41
  • صفحه تسویه حساب - محدود کردن دسترسی 05:46
  • ایجاد درخواست سفارش 06:15
  • راه‌اندازی فرم پرداخت 05:16
  • فرم پرداخت - کامل 09:36
  • خطاهای احراز هویت 04:20
  • درخواست سفارش‌ها 03:53
  • صفحه سفارشات - راه‌اندازی 08:39
  • لیست سفارشات 11:45
  • صفحه‌بندی پیچیده 15:25
  • راه‌اندازی React Query 05:44
  • React Query - صفحه فرود 03:45
  • React Query - صفحه محصول تک 04:26
  • React Query - صفحه تمامی محصولات 05:50
  • React Query - صفحه سفارشات 06:35
  • حذف کوئری‌های React Query 03:18
  • به‌روزرسانی دوره!!! محتوای جدید !!! 02:13
  • معرفی، راه‌اندازی، فایل‌ها و پوشه‌ها 17:35
  • توضیحات نوع و استنتاج نوع 12:49
  • نوع Union و Any 15:15
  • آرایه‌ها و اشیاء 18:32
  • پارامترهای تابع و مقادیر برگشتی تابع 15:58
  • پارامترهای اختیاری، پیش‌فرض و باقی‌مانده 16:58
  • آبجکت‌ها به عنوان پارامتر و بررسی خصوصیات اضافی 14:39
  • Type Alias و نوع تلاقی 20:40
  • مبانی رابط کاربری (Interface) 21:13
  • رابط کاربری - پیشرفته 26:01
  • تاپل‌ها و Enums 17:18
  • اعلام نوع، نوع ناشناخته و نوع Never 22:45
  • ماژول‌های ES6 16:13
  • مراقبت‌های نوع (Type Guarding) - بخش اول 16:25
  • مراقبت‌های نوع (Type Guarding) - بخش دوم 15:26
  • جنریک ها 39:22
  • واکشی داده و فایل‌های اعلان نوع 32:40
  • کلاس‌ها 22:11
  • پروژه تسک‌ها - بخش اول 28:06
  • پروژه تسک‌ها - بخش دوم 13:54
  • راه‌اندازی و مبانی 24:50
  • useState و رویدادها 27:41
  • چالش و راه‌حل 17:06
  • Context API و useReducer 32:33
  • واکشی داده 24:03
  • Redux Toolkit 19:56
  • پروژه تسک‌ها 20:37
  • اطلاعات Next.js، راه‌اندازی، صفحه اصلی و کامپوننت لینک 12:58
  • مسیرهای تو در تو 13:05
  • فایل طرح‌بندی، نوار ناوبری، فونت‌ها و متادیتا 14:44
  • کامپوننت‌های سرور در برابر کامپوننت‌های کلاینت 09:12
  • واکشی داده 15:34
  • طرح‌بندی‌های تو در تو و صفحات داینامیک 09:49
  • تصاویر 20:52
  • گزینه‌های بیشتر مسیردهی 07:41
  • عملیات سرور 13:32
  • فایل عملیات 14:26
  • دریافت کاربران و اعتبارسنجی مجدد کش 08:45
  • هوک‌های useFormStatus و useFormState 14:51
  • دکمه حذف، ورودی مخفی و متد Bind 12:02
  • Route Handlers - بخش اول 08:59
  • Route Handlers - بخش دوم 13:25
  • میان‌افزار، بیلد محلی و کش 15:49
  • نمای کلی پروژه 10:44
  • راه‌اندازی 02:59
  • ایجاد صفحات 03:51
  • نصب و راه‌اندازی Shadcn-ui 03:18
  • کامپوننت دکمه 09:10
  • راه‌اندازی کامپوننت‌ها 03:53
  • کامپوننت کانتینر 03:39
  • کامپوننت نوار ناوبری - بلوپرینت 05:14
  • کامپوننت لوگو 03:32
  • کامپوننت‌های NavSearch و CartButton 06:13
  • Shadcn - تغییر تم 03:09
  • Shadcn - تاگل حالت تاریک 11:16
  • کامپوننت منوی کشویی لینک‌ها - راه‌اندازی اولیه 07:42
  • ساخت پروژه Supabase 04:49
  • راه‌اندازی Prisma 03:57
  • اتصال Prisma به Supabase 07:11
  • عملیات CRUD در Prisma 03:35
  • تمرین نوشتن کوئری‌های Prisma 06:06
  • مدل محصول 04:28
  • Seed کردن پایگاه داده 04:03
  • ایجاد کامپوننت‌های بیشتر 04:16
  • کامپوننت‌های SectionTitle و EmptyList 03:40
  • توابع واکشی محصولات 04:36
  • محصولات ویژه 05:33
  • کامپوننت گرید محصولات 15:08
  • کامپوننت Hero 05:01
  • کامپوننت چرخنده Hero 05:16
  • کانتینر بارگذاری 10:30
  • کامپوننت کانتینر محصولات 19:34
  • کامپوننت لیست محصولات 08:09
  • کامپوننت جستجوی نوار ناوبری 15:39
  • واکشی جزئیات محصول 09:31
  • صفحه جزئیات محصولات - راه‌اندازی 08:22
  • استقرار روی Vercel 06:56
  • راه‌اندازی کامپوننت Toast 01:56
  • احراز هویت Clerk 10:40
  • کامپوننت لینک خروج 04:07
  • کامپوننت آیکون کاربر 05:03
  • کامپوننت منوی کشویی لینک‌ها - کامل 06:49
  • تست ارائه‌دهنده احراز هویت در تولید 04:18
  • ساختار صفحات مدیریت 13:45
  • محدود کردن دسترسی به صفحات ادمین 08:54
  • راه‌اندازی صفحه ساخت محصول و کتابخانه Faker 07:34
  • کامپوننت ورودی فرم 08:13
  • باقی کامپوننت‌های فرم 11:51
  • کامپوننت دکمه ارسال 05:22
  • کامپوننت کانتینر فرم 15:41
  • CreateProductAction - رویکرد اول + توابع Helper 12:49
  • کتابخانه Zod و اسکیما محصول 11:29
  • پیام‌های خطای سفارشی 13:53
  • اعتبارسنجی تصویر 07:45
  • آپلود تصویر در سطل Supabase 14:14
  • واکشی محصولات ادمین 09:58
  • دکمه آیکون و عملیات حذف محصول 08:51
  • صفحه کامل محصولات مدیریت 04:37
  • حذف تصویر قدیمی از Supabase Bucket 07:37
  • واکشی جزئیات محصول ادمین 03:38
  • ویرایش صفحه محصول 12:21
  • کامپوننت به‌روزرسانی کانتینر تصویر 15:23
  • کامپوننت جدول بارگذاری 05:17
  • مدل مورد علاقه 05:37
  • دکمه‌ها و عملیات مورد علاقه 09:37
  • کامپوننت‌های FavoriteToggleButton و FavoriteToggleForm 09:23
  • تاگل کردن اکشن مورد علاقه 05:18
  • صفحه علاقه‌مندی‌ها 05:34
  • کتابخانه React Share 12:11
  • مدل نقد 08:37
  • کامپوننت‌های ورودی امتیاز و ارسال نقد 14:40
  • عمل ایجاد نقد 05:09
  • کامپوننت‌های امتیازدهی و نظر 09:37
  • کامپوننت نقد محصولات 12:00
  • کامپوننت امتیازدهی محصول - کامل 04:30
  • واکشی نقدهای کاربر و حذف اقدام نقد 03:59
  • صفحه نقدها 10:41
  • محدود کردن دسترسی به دکمه ارسال نقد 06:22
  • مدل سبد خرید و آیتم سبد 09:43
  • کامپوننت انتخاب مقدار محصول 13:18
  • کامپوننت افزودن به سبد خرید 08:11
  • عمل افزودن به سبد خرید - بخش اول 11:48
  • عملیات افزودن به سبد خرید - بخش دوم 12:47
  • صفحه سبد خرید و کامپوننت مجموع سبد 17:12
  • کامپوننت لیست آیتم‌های سبد خرید 16:05
  • عمل حذف آیتم سبد خرید 10:26
  • عملیات ویرایش آیتم سبد خرید 06:55
  • رفع باگ 07:40
  • مدل سفارش و اکشن های سفارش 08:51
  • صفحات سفارشات و فروش 14:53
  • راه‌اندازی Stripe و کلیدهای API 03:01
  • ریفکتور مدل سفارش و createOrderAction 06:57
  • صفحه تسویه حساب 06:12
  • مسیر پرداخت 12:17
  • تأیید مسیر 04:55
  • آزمون عملکرد Stripe 03:59
  • راه‌اندازی Atlas - ویدیوی اختیاری!!! 06:09
  • نصب و راه‌اندازی 13:36
  • فرم جستجو 07:30
  • مرور کلی GraphQL 18:50
  • Apollo Client و کوئری 21:32
  • پروفایل کاربر، کانتینر آمار و کامپوننت کارت کاربر 13:02
  • توابع Utils 23:03
  • نمودارها و کامپوننت بارگذاری 18:46
  • مقدمه 02:51
  • نصب و راه‌اندازی مخزن بخش 04:28
  • فایل‌ها و پوشه‌ها 02:36
  • بررسی اولین فایل تست 09:02
  • آزمون جزئیات اعتبارسنجی 11:14
  • اطلاعات Vitest 07:00
  • کامپوننت SearchByText 08:37
  • مرور متدهای SearchByText 06:27
  • فایل تست متدهای SearchByText 16:43
  • مثال توسعه مبتنی بر تست 03:59
  • کامپوننت SearchByRole 05:28
  • مرور متدهای SearchByRole 04:18
  • فایل تست SearchByRole 13:48
  • کامپوننت تعامل کاربر 09:10
  • تعاملات کاربر - فایل تست 18:23
  • تست فرم - Sandbox 16:35
  • تست ورودی‌های خالی 07:39
  • تست تایپ در ورودی‌های خالی 03:36
  • ریفکتور 10:47
  • تست فرم - تست‌های باقی‌مانده 11:21
  • اپلیکیشن نقدها - منطق 24:23
  • اپلیکیشن نقدها - تست‌های واحد کامپوننت لیست 13:41
  • اپلیکیشن نقدها - تست‌های واحد کامپوننت فرم 14:16
  • اپلیکیشن نقدها - تست‌های یکپارچه‌سازی کامپوننت‌های sandbox 12:04
  • ساخت و پیکربندی قالب برای تست برنامه‌های React 13:17
  • مرور کلی و راه‌اندازی 06:59
  • مروری بر Shadcn-ui و راه‌اندازی 18:54
  • طرح‌بندی، صفحه اصلی و ایجاد صفحات 14:46
  • احراز هویت Clerk و لینک‌های ناوبری 08:14
  • طرح داشبورد، سایدبار و نوار ناوبری 18:56
  • کامپوننت Dropdownlinks، تغییر تم و Toggle تم 19:13
  • کامپوننت فرم Shadcn-ui و تایپ‌ها 18:23
  • کامپوننت‌های فرم سفارشی 12:06
  • ادامه عملکرد ایجاد شغل 10:34
  • Prisma، رندر و ایجاد عملیات شغل 18:23
  • کامپوننت Toast، راه‌اندازی React Query و فرم ایجاد شغل کامل 15:13
  • عمل دریافت تمام شغل‌ها و راه‌اندازی صفحه 21:09
  • فرم جستجو 15:20
  • لیست شغل‌ها و کارت شغل 15:18
  • اطلاعات شغل و حذف شغل 11:11
  • صفحه شغل تکی و ویرایش کامل شغل 13:33
  • Seed کردن پایگاه داده 10:18
  • اکشن های آمار و نمودارها 13:21
  • کارت‌های آمار، اسکللت بارگذاری و کانتینر نمودارها 15:59
  • صفحه‌بندی - کانتینر دکمه 15:19
  • صفحه‌بندی - کانتینر دکمه پیچیده 13:33
  • معرفی و راه‌اندازی 17:26
  • ساختار و Styled Components 23:18
  • راه‌اندازی صفحات 32:01
  • صفحه خطا و ثبت‌نام (بخش اول) 36:00
  • صفحه ثبت‌نام (بخش دوم) 30:30
  • درخواست‌های HTTP 30:19
  • ورود کاربر و راه‌اندازی داشبورد 33:42
  • نوار ناوبری و قابلیت Toggle 26:35
  • سایدبار کوچک و بزرگ 22:40
  • صفحه پروفایل 36:42
  • صفحه افزودن شغل - بخش اول 26:28
  • اضافه کردن شغل - بخش دوم 31:37
  • ایجاد شغل 23:59
  • تمام شغل‌ها 30:32
  • کامپوننت شغل 34:15
  • ویرایش شغل و تست کاربر 40:48
  • کانتینر آمار 24:11
  • کانتینر نمودارها 20:09
  • کانتینر جستجو 23:49
  • صفحه‌بندی 26:00
  • پارامترهای کوئری 22:52
  • ریفکتور و خروج کاربر 25:41
  • Debounce 23:57
  • راه‌اندازی و React Router 27:16
  • صفحات اولیه، Context API و داده‌های جعلی 30:36
  • کامپوننت‌های اطلاعات، کارت و دنبال‌کنندگان 33:37
  • نمودارها - بخش اول 27:50
  • محاسبه آمار - بخش اول 28:47
  • محاسبه آمار - بخش دوم 30:40
  • درخواست‌های API 33:32
  • درخواست‌های API - بخش دوم 29:23
  • احراز هویت 32:42
  • احراز هویت (بخش دوم) و استقرار 36:22

39,730,000 7,946,000 تومان

مشخصات آموزش

دوره کامل پروژه های ری اکت، Next.js و تایپ اسکرپیت در 2025

  • تاریخ به روز رسانی: 1404/06/14
  • سطح دوره:همه سطوح
  • تعداد درس:749
  • مدت زمان :100:35:48
  • حجم :49.11GB
  • زبان:دوبله زبان فارسی
  • دوره آموزشی:AI Academy

آموزش های مرتبط

The Great Courses
2,495,000 499,000 تومان
  • زمان: 06:19:16
  • تعداد درس: 40
  • سطح دوره:
  • زبان: دوبله فارسی
The Great Courses
6,787,000 1,357,400 تومان
  • زمان: 17:11:52
  • تعداد درس: 113
  • سطح دوره:
  • زبان: دوبله فارسی
The Great Courses
8,360,500 1,672,100 تومان
  • زمان: 21:10:47
  • تعداد درس: 202
  • سطح دوره:
  • زبان: دوبله فارسی
The Great Courses
5,720,500 1,144,100 تومان
  • زمان: 14:29:26
  • تعداد درس: 36
  • سطح دوره:
  • زبان: دوبله فارسی
The Great Courses
4,206,500 841,300 تومان
  • زمان: 10:39:08
  • تعداد درس: 64
  • سطح دوره:
  • زبان: دوبله فارسی
The Great Courses
4,391,000 878,200 تومان
  • زمان: 11:07:45
  • تعداد درس: 63
  • سطح دوره:
  • زبان: دوبله فارسی
The Great Courses
7,261,000 1,452,200 تومان
  • زمان: 18:23:18
  • تعداد درس: 103
  • سطح دوره:
  • زبان: دوبله فارسی
The Great Courses
490,000 98,000 تومان
  • زمان: 00:57:00
  • تعداد درس: 20
  • سطح دوره:
  • زبان: دوبله فارسی
The Great Courses
490,000 98,000 تومان
  • زمان: 00:41:00
  • تعداد درس: 9
  • سطح دوره:
  • زبان: دوبله فارسی

آیا سوالی دارید؟

ما به شما کمک خواهیم کرد تا شغل و رشد خود را افزایش دهید.
امروز با ما تماس بگیرید