آموزش مدیریت حالت در React 18

سرفصل ها و درس ها

بررسی اجمالی دوره Course Overview

• بررسی اجمالی دوره Course Overview

تصمیم گیری در مورد نحوه رسیدگی به وضعیت Deciding How to Handle State

• مخاطبان هدف و پیش نیازها Target Audience and Prerequisites

• دستور جلسه Agenda

• تاریخچه مختصری از مدیریت React State A Brief History of React State Management

• هشت راه برای مدیریت وضعیت Eight Ways to Handle State

• ساختارهای داده جاوا اسکریپت JavaScript Data Structures

• خلاصه Summary

مدیریت ایالت محلی و ایالت دوردست Managing Local State and Remote State

• مقدمه Intro

• راه اندازی نسخه ی نمایشی Setup Demo

• اعلام وضعیت با UseState Declaring State with UseState

• قوانین هوک The Rules of Hooks

• پیاده سازی رویداد Handlers Implementing Event Handlers

• React Developer Tools React Developer Tools

• پیاده سازی حالت مشتق شده و کاوش رندرهای زمانی که واکنش نشان می دهد Implementing Derived State and Exploring When React Renders

• واکشی و ذخیره داده ها از طریق UseEffect Fetching and Storing Data via UseEffect

• چهار راه برای رسیدگی به تماس های API Four Ways to Handle API Calls

• مدیریت خطاها از طریق مرزهای خطا Handling Errors via Error Boundaries

• وضعیت بارگیری Handling Loading State

• اجرای Async/wait در useEffect Implementing Async/await in useEffect

• ایجاد یک هوک سفارشی Creating a Custom Hook

• مصرف قلاب سفارشی Consuming a Custom Hook

• خلاصه Summary

مدیریت وضعیت URL و ذخیره سازی وب Managing URL State and Web Storage

• مقدمه Intro

• پیکربندی نقطه ورودی React Router Configuring React Router's Entry Point

• ایجاد طرح بندی برنامه Creating an App Layout

• اعلام مسیرها Declaring Routes

• اعلام مکان‌گردان‌های URL Declaring URL Placeholders

• خواندن متغیرهای URL Reading URL Placeholders

• هندلینگ 404 Handling 404s

• خواندن متغیرهای URL در صفحه جزئیات Reading URL Placeholders on the Detail Page

• پیاده سازی ناوبری سمت مشتری Implementing Client-side Navigation

• واکشی بر اساس پارامتر URL Fetching Based on a URL Parameter

• مدیریت 404s در صفحه جزئیات Handling 404s on the Detail Page

• تغییر مسیر از طریق useNavigation Redirecting via useNavigation

• خلاصه Summary

مدیریت وضعیت مشترک، مشتق شده و غیرقابل تغییر Managing Shared, Derived, and Immutable State

• مقدمه Intro

• ایجاد یک انتخاب سایز کفش Creating a Shoe Size Select

• اجرای حالت مشتق شده Implementing Derived State

• تصمیم گیری محل نگهداری ایالت Deciding Where to Store State

• حالت بالابر Lifting State

• چرا تغییر ناپذیری؟ Why Immutability?

• مدیریت تغییرناپذیری Handling Immutability

• پیاده سازی Immutable-friendly Add Implementing Immutable-friendly Add

• نمایش اقلام سبد خرید Displaying Cart Items

• پیاده سازی به روز رسانی غیر قابل تغییر Implementing Immutable-friendly Update

• پیاده سازی حذف غیر قابل تغییر Implementing Immutable-friendly Delete

• حالت استخراج برای سرصفحه سبد خرید Deriving State for Cart Header

• Lazy Initializing State و LocalStorage Lazy Initializing State and localStorage

• خلاصه Summary

مدیریت وضعیت فرم و اعتبارسنجی Managing Form State and Validation

• مقدمه Intro

• ایجاد Checkout Creating Checkout

• متمرکز کردن کنترل کننده های تغییر و رویدادهای پایدار Centralizing Change Handlers and Persisting Events

• تصمیمات اعتبار سنجی فرم Form Validation Decisions

• مقدمه ای بر فهرست ایالت ها Intro to State Enums

• پیاده سازی State Enum در پرداخت Implementing a State Enum on Checkout

• ذخیره فرم ارسال و خالی کردن سبد خرید Saving the Form Submission and Emptying Cart

• حالت Enums در مقابل ماشین های حالت محدود State Enums vs. Finite State Machines

• اجرای اعتبارسنجی فرم "در حال پرواز". Implementing "On-the-fly" Form Validation

• ردیابی لمس برای اعتبار سنجی فوری Tracking Touch for Instant Validation

• خلاصه Summary

مدیریت دولت از طریق Refs Managing State via Refs

• مقدمه Intro

• چه زمانی یک مرجع را در نظر بگیرید When to Consider a Ref

• پیاده سازی ورودی های کنترل نشده Implementing Uncontrolled Inputs

• ورودی های کنترل شده در مقابل ورودی های کنترل نشده Controlled vs. Uncontrolled Inputs

• اجتناب از تنظیم حالت در مؤلفه‌های Umounted Avoiding Setting State on Umounted Components

• ذخیره یک مقدار قبلی Storing a Previous Value

• خلاصه Summary

مدیریت وضعیت پیچیده با useReducer Managing Complex State with useReducer

• مقدمه Intro

• چرا از Reducer استفاده کنیم؟ Why useReducer?

• استخراج مدیریت حالت برای استفاده از Reducer Extracting State Management to useReducer

• مدیریت انواع اقدام غیرمنتظره Handling Unexpected Action Types

• مدیریت کاهش دهنده های افزودن در Handling Add In Reducers

• مدیریت به روز رسانی ها در کاهنده ها Handling Updates in Reducers

• کاهش دهنده های مصرف Consuming Reducers

• عملیات اعزام Dispatching Actions

• useState در مقابل useReducer useState vs. useReducer

• خلاصه Summary

به اشتراک گذاری وضعیت و توابع از طریق Context Sharing State and Functions via Context

• مقدمه Intro

• چرا زمینه؟ Why Context?

• اعلام یک زمینه Declaring a Context

• اعلان یک Context Provider Declaring a Context Provider

• زمینه مصرف کننده Consuming Context

• ایجاد کامپوننت ارائه دهنده Creating a Provider Component

• بسته بندی برنامه در یک ارائه دهنده زمینه Wrapping the App In a Context Provider

• ایجاد یک UseContext Hook قابل استفاده مجدد Creating a Reusable UseContext Hook

• مصرف متن از طریق هوک سفارشی Consuming Context Via Custom Hook

• نیاز به ارائه دهنده زمینه Requiring a Context Provider

• خلاصه Summary

مدیریت دولت از طریق کتابخانه های شخص ثالث Managing State via Third-party Libraries

• مقدمه Intro

• نحوه اجرای دموها How to Run the Demos

• ایالت محلی Local State

• دولت جهانی Global State

• وضعیت سرور Server State

• حالت تغییرناپذیر Immutable State

• حالت را تشکیل دهید Form State

• خلاصه: چگونه وضعیت را مدیریت کنیم Summary: How to Handle State

• تمرینات توصیه شده Recommended Exercises