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

بوت‌کمپ مدرن React 18 - یک راهنمای کامل برای توسعه‌دهندگان

بوت‌کمپ مدرن React 18 - یک راهنمای کامل برای توسعه‌دهندگان

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

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

  • بهترین شیوه‌ها برای ساخت یک اپلیکیشن فرانت‌اند با React 18
  • استفاده از هوک‌ها و Redux Toolkit در یک پروژه React
  • تشخیص زمان مناسب برای استفاده از یک راهکار مدیریت استیت 
  • مدیریت احراز هویت کاربر و پرداخت‌ها

توضیحات دوره

ما پنج پروژه خواهیم ساخت که هر کدام به تدریج پیچیده‌تر می‌شوند. این دوره را با ساخت یک کلون از نتفلیکس با ویژگی‌هایی مانند پرداخت و احراز هویت کاربر به پایان خواهیم رساند. در پایان این دوره، شما چندین نمونه عملی برای به نمایش گذاشتن دانش خود خواهید داشت!

در اینجا لیستی از مواردی که در این دوره یاد خواهید گرفت آمده است:

  • تفاوت بین وانیلا جاوا اسکریپت و React 18
  • چگونگی استفاده از تمام هوک‌های مختلف React
  • رندر شرطی و نگاشت در میان لیستی از عناصر
  • دریافت داده از یک API خارجی و مدیریت استیت‌های موفقیت، در حال بارگذاری و خطا
  • مدیریت احراز هویت کاربر
  • ساخت یک پایگاه داده Postgres برای مدیریت روابط پیچیده
  • استفاده از تایپ‌اسکریپت برای کدنویسی بدون باگ
  • تمام روش‌های مهم برای مدیریت استیت شامل useState و useContext useReducer و Redux Toolkit
  • مدیریت پرداخت‌های اشتراکی با Stripe
  • صفحه‌بندی مبتنی بر اسکرول با استفاده از Observer Intersection API
  • بهینه‌سازی عملکرد با جلوگیری از رندرهای غیرضروری

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

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

بوت‌کمپ مدرن React 18 - یک راهنمای کامل برای توسعه‌دهندگان

  • یک تنظیمات کوچک 02:55
  • React چیست؟ 04:54
  • ساخت یک اپلیکیشن با Vanilla JS 14:15
  • بحث درباره مشکلاتی که با آنها مواجه شدیم 02:18
  • ساخت همان اپلیکیشن با ReactJS 18:28
  • ساخت یک اپلیکیشن React 12:31
  • بررسی فایل‌ها و پوشه‌ها 09:51
  • مدیریت استیت و رویدادها 08:50
  • معرفی پروژه 02:58
  • Class در برابر ClassName 07:39
  • ساختار JSX 07:52
  • فهرست کردن تمام مواردی که باید روی آنها کار کنیم 02:41
  • اتصال دو طرفه 10:25
  • تعریف یک استیت از نوع آرایه 11:51
  • پیمایش در لیست برای رندر عناصر 05:25
  • پراپ Key 04:21
  • محاسبه مقدار 05:13
  • رندر شرطی عناصر JSX 04:08
  • حذف یک آیتم 06:23
  • اتصال دو طرفه برای یک آیتم لیست 07:37
  • هوک useEffect 10:09
  • معرفی پروژه 07:27
  • ساختار JSX 10:06
  • اتصال دوطرفه 08:23
  • یک روش تمیزتر و بهینه‌تر (DRY) برای اتصال دو طرفه 07:12
  • اعتبارسنجی ورودی و استایل‌دهی شرطی 08:20
  • ذخیره لیست فروشگاه و پیمایش برای رندر عناصر 12:37
  • نصب وابستگی‌ها 07:13
  • محاسبه استیت جدید 07:28
  • معرفی پروژه 06:57
  • ساخت ساختار JSX برای صفحه اصلی 12:54
  • تقسیم JSX به کامپوننت‌ها 10:31
  • انتقال Props به کامپوننت‌ها 10:50
  • درک مسیریابی 09:45
  • چگونه React محتوا را به مرورگر رندر می‌کند؟ (CSR در مقابل SSR) 12:06
  • نصب react-router-dom 05:04
  • تعریف قوانین مسیریابی 05:37
  • اضافه کردن صفحه‌ای دیگر به اپلیکیشن ما 03:22
  • مسیرهای تو در تو برای عناصر مشترک 08:26
  • ناوبری مبتنی بر لینک 07:13
  • تعریف مسیرهای داینامیک 05:31
  • هوک useParams برای استخراج پارامترها 08:00
  • هوک useNavigate برای ناوبری برنامه‌نویسی شده 05:55
  • داده‌ها از کجا خواهند آمد؟ 07:00
  • واکشیدن داده از API با اپ React ما 06:21
  • پیمایش در داده‌های واکشی شده 08:07
  • کپسوله کردن منطق Fetch در یک هوک سفارشی 05:32
  • مدیریت استیت در حال بارگذاری 07:06
  • مدیریت استیت خطا 04:21
  • جستجوی داده‌ها بر اساس کلیدواژه 12:00
  • یک راه‌حل سریع 02:33
  • هوک سفارشی دیگر 07:40
  • پیمایش و رندر داده‌ 13:25
  • پراپ Children 06:41
  • ساخت کامپوننت اطلاعات دستور پخت 08:11
  • مشکلات احتمالی با استیت تعریف شده 03:33
  • هوک useReducer 14:18
  • افزودن پارامترهای Query 09:46
  • مدیریت استیت خطا با پیام خطا 06:15
  • صفحه خطای 404 05:23
  • صفحات تو در تو بیشتر 06:27
  • انتقال داده به Outlet با استفاده از useOutletContext 07:02
  • جمع‌بندی نهایی 03:54
  • استقرار اپلیکیشن 07:06
  • مشاهده استقرار ما 01:29
  • React دارای هوک‌های زیادی است 03:22
  • هوک useRef 01:44
  • ساخت یک مینی‌پروژه با useState 09:44
  • بهبود عملکرد با useRef 07:54
  • ارجاع دادن به عناصر با useRef 08:41
  • هوک useMemo 13:13
  • Memo و Props 07:42
  • هوک useCallback 15:00
  • مقدمه‌ای بر TypeScript 03:47
  • ساخت یک اپلیکیشن React با TypeScript 04:31
  • یک درس سریع تایپ‌اسکریپت 16:08
  • بررسی کد شروع 05:22
  • مدیریت استیت با TypeScript 07:02
  • استفاده از Props با TypeScript 07:33
  • پارامترها با TypeScript 15:40
  • نصب پکیج‌ها با استفاده از TypeScript 02:50
  • معرفی پروژه اصلی 08:44
  • ساخت یک اپ React با TypeScript 02:30
  • ادغام Tailwind 08:07
  • ساخت نوار ناوبری 11:59
  • ساخت صفحه اصلی 11:44
  • ساخت صفحه ورود 09:38
  • ساخت صفحه طرح ها 14:56
  • ساخت صفحه مرور 24:22
  • ساخت صفحه تماشا 07:49
  • پیاده‌سازی ناوبری صفحات 09:15
  • چگونه داده‌ها را دریافت خواهیم کرد؟ 06:45
  • ساخت سرور Express 09:20
  • ایجاد یک Endpoint برای دریافت لیست فیلم‌ها 03:20
  • استفاده از useReducer با TypeScript 15:46
  • واکشی داده‌ از هوک 08:50
  • استفاده از داده‌ها در صفحه مرور ما 06:26
  • اصلاح استایل‌های کارت 01:08
  • افزودن پس‌زمینه نوار ناوبری به صورت شرطی 04:20
  • رفتن به صفحه تماشا 02:40
  • ایجاد Endpoint دریافت فیلم 02:56
  • واکشی و رندر کردن داده‌ها در React 08:52
  • مقدمه‌ای بر صفحه‌بندی 03:48
  • انواع صفحه‌بندی 05:16
  • Offsets و Limits 04:34
  • بازگرداندن داده‌های صفحه‌بندی شده از سرور 03:04
  • استفاده از Intersection Observer API برای تشخیص دیده شدن یک عنصر 13:12
  • اضافه کردن داده‌ها به جای جایگزینی 06:13
  • اضافه کردن استیت بارگذاری 07:27
  • جلوگیری از دریافت مجدد داده زمانی که کلاینت تمام داده‌ها را دارد 08:13
  • مقدمه‌ای بر راه‌حل‌های پایگاه داده 05:53
  • راه‌اندازی یک پایگاه داده Postgres 04:36
  • SQL خام در برابر ORM 06:11
  • تعریف اسکیمای ما و اتصال به پایگاه داده 11:17
  • نوشتن و اجرای اسکریپت ابتدایی 10:15
  • بازسازی Endpointها برای واکشی داده با Prisma 09:11
  • مقدمه‌ای بر احراز هویت 04:51
  • بازسازی Endpointهای مشترک به فایل‌های جداگانه 07:31
  • اعتبارسنجی ورودی‌های کاربر 14:45
  • اعتبارسنجی برای اطمینان از عدم وجود کاربر 04:12
  • سه روش مختلف برای ذخیره رمز عبور 06:20
  • هش و ذخیره رمز عبور 05:38
  • ذخیره کاربر 02:33
  • ساخت و بازگرداندن JSON Web Token 08:31
  • Endpoint ورود 09:38
  • Endpoint من 09:03
  • بازگشت به سمت کلاینت 01:32
  • اصلاح کارت فرم 06:42
  • کتابخانه React Hook Form 02:12
  • راه‌اندازی فرم با هوک useForm 07:05
  • مدیریت استیت و اتصال دوطرفه 08:13
  • اعتبارسنجی مقادیر ورودی فرم 09:23
  • مدیریت استیت های خطا 06:13
  • گرد هم آوردن امکانات 02:31
  • ساخت هوک useAuth 06:07
  • ارسال درخواست‌های HTTP 07:05
  • مدیریت خطاهای احراز هویت 08:54
  • رفتن به صفحه مرور بعد از احراز هویت موفق 03:35
  • ذخیره JWT در کوکی مرورگر 05:41
  • مقدمه‌ای بر Redux Toolkit 12:37
  • تعریف استیت سراسری 06:23
  • ثابت نگه داشتن استیت احراز هویت 10:47
  • تعریف مسیرهای خصوصی 07:13
  • اضافه کردن منطق خروج از سیستم 04:43
  • وقت کسب درآمد است 02:52
  • اضافه کردن محصولات به Stripe 02:55
  • اتصال سرور ما به Stripe 08:07
  • تعریف Endpoint محصولات 05:03
  • هوک usePlans 12:37
  • رندر کردن طرح‌ها 12:21
  • تعریف یک Endpoint برای Session 11:33
  • خرید اشتراک از سمت کلاینت 12:33
  • مرور تمام جریان‌های کاربری 04:36
  • نمایش صفحه طرح‌ها فقط در صورت احراز هویت 01:35
  • یک Middleware برای بررسی احراز هویت 11:48
  • ساخت یک Endpoint برای اشتراک من 08:25
  • هدایت کاربرانی که طرح دارند به صفحه مدیریت طرح‌ها 14:15
  • مدیریت تغییر مسیر صفحات 04:46
  • اضافه کردن منطق دسترسی به Endpoint لیست فیلم‌ها 11:04
  • هدایت کاربر به صفحه طرح‌ها در صورت نداشتن اشتراک 04:33
  • دسترسی‌های طرح Premium 09:35

8,117,000 1,623,400 تومان

مشخصات آموزش

بوت‌کمپ مدرن React 18 - یک راهنمای کامل برای توسعه‌دهندگان

  • تاریخ به روز رسانی: 1404/06/21
  • سطح دوره:مقدماتی
  • تعداد درس:161
  • مدت زمان :20:33:17
  • حجم :9.78GB
  • زبان:دوبله زبان فارسی
  • دوره آموزشی: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
  • سطح دوره:
  • زبان: دوبله فارسی

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

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