آموزش Modern React with Redux [به روز رسانی 2023]

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

بیایید شیرجه بزنیم! Let's Dive In!

• نحوه دریافت کمک How to Get Help

• به انجمن ما بپیوندید! Join Our Community!

• منابع دوره Course Resources

• بیایید یک برنامه بسازیم! Let's Build an App!

• سوالات انتقادی Critical Questions

• مفاهیم اصلی Core Concepts

• چند سوال انتقادی دیگر A Few More Critical Questions

• تنظیم گره Node Setup

• ایجاد یک پروژه React Creating a React Project

• Create React App چیست؟ What is Create React App?

ایجاد محتوا با JSX Creating Content with JSX

• نمایش محتوای اصلی Showing Basic Content

• JSX چیست؟ What is JSX?

• چاپ متغیرهای جاوا اسکریپت در JSX Printing JavaScript Variables in JSX

• عبارات مختصر JS Shorthand JS Expressions

• نمایش مقادیر جاوا اسکریپت در JSX Showing Javascript Values in JSX

• بررسی اجمالی ورزش Exercise Overview

• تمرین سریع با JSX Quick Practice with JSX

• راه حل تمرین Exercise Solution

• چیدمان اجزای معمولی Typical Component Layouts

• سفارشی کردن عناصر با Props Customizing Elements with Props

• تبدیل HTML به JSX Converting HTML to JSX

• استفاده از Styling در JSX Applying Styling in JSX

• اطلاعات بیشتر در مورد JSX More on JSX

• تبدیل JSX را تمرین کنید Practice JSX Conversion

• راه حل تمرین Exercise Solution

• استخراج کامپوننت ها Extracting Components

• بررسی اجمالی سیستم های ماژول Module Systems Overview

• واردات و صادرات Imports and Exports

• چیت شیت برای JSX Cheatsheet for JSX

ساختمان با اجزای قابل استفاده مجدد Building with Reusable Components

• بررسی اجمالی پروژه Project Overview

• ایجاد اجزای اصلی Creating Core Components

• معرفی سیستم Props Introducing the Props System

• تصویر حرکت داده ها Picturing the Movement of Data

• افزودن لوازم جانبی Adding Props

• استفاده از ساختارشکنی استدلال Using Argument Destructuring

• با Props تمرین کنید Practice with Props

• راه حل تمرین Exercise Solution

• React Developer Tools The React Developer Tools

• متداول ترین اشتباه پراپس The Most Common Props Mistake

• برقراری ارتباط با لوازم جانبی Communicating With Props

• تصاویر برای برنامه Images for the App

• از جمله تصاویر Including Images

• مدیریت قابلیت دسترسی به تصویر Handling Image Accessibility

• بررسی نحوه عملکرد CSS Review on how CSS Works

• افزودن کتابخانه های CSS با NPM Adding CSS Libraries with NPM

• انبوهی از HTML! A Big Pile of HTML!

• آخرین بیت از یک ظاهر طراحی شده Last Bit of Styling

وضعیت: چگونه برنامه خود را تغییر دهید State: How to Change Your App

• نمای کلی برنامه App Overview

• راه اندازی اولیه برنامه Initial App Setup

• معرفی سیستم رویداد Introducing the Event System

• رویدادها در جزئیات Events in Detail

• تغییرات در رویداد Handlers Variations on Event Handlers

• مسابقه در مورد رویدادها Quiz on Events

• با رویدادها ورزش کنید Exercise with Events

• راه حل تمرین Exercise Solution

• معرفی سیستم دولتی Introducing the State System

• بیشتر در مورد ایالت More on State

• درک فرآیند رندر مجدد Understanding the Re-Rendering Process

• این پنج امتیاز را گرفتید؟ Got These Five Points?

• چرا تخریب آرایه؟ Why Array Destructuring?

• بازگشت به برنامه Back to the App

• انتخاب یک عنصر تصادفی Picking a Random Element

• ساخت لیست در React List Building in React

• تصاویر برای برنامه Images for the App

• بارگیری و نمایش SVG ها Loading and Showing SVGs

• افزایش اندازه تصویر Increasing Image Size

• افزودن CSS سفارشی Adding Custom CSS

• طراحی نهایی Finalizing Styling

• جمع بندی و بررسی برنامه App Wrapup and Review

استفاده از API با React Using an API with React

• نمای کلی برنامه App Overview

• راه اندازی پروژه Project Setup

• مسیر رو به جلو The Path Forward

• مروری بر درخواست های HTTP Overview of HTTP Requests

• آشنایی با API Understanding the API

• ایجاد یک درخواست HTTP Making an HTTP Request

• [اختیاری] استفاده از Async: Await [Optional] Using Async:Await

• پاکسازی واکشی داده Data Fetching Cleanup

• تفکر در مورد جریان داده Thinking About Data Flow

• ارتباط کودک با والدین Child to Parent Communication

• پیاده سازی ارتباط کودک با والدین Implementing Child to Parent Communication

• ارتباط صعودی Upward Communication

• رسیدگی به ارسال فرم Handling Form Submission

• مدیریت عناصر ورودی Handling Input Elements

• [اختیاری] خوب اما چرا؟ [Optional] OK But Why?

• ایجاد یک ورودی کنترل شده Creating a Controlled Input

• راه حل تمرین Exercise Solution

• اجرای جستجو Running the Search

• یادآوری در Async: در انتظار Reminder on Async:Await

• ارتباط فهرست تصاویر پایین است Communicating the List of Images Down

• ساخت فهرستی از تصاویر Building a List of Images

• مدیریت به روز رسانی لیست Handling List Updates

• یادداشت ها در مورد کلیدها Notes on Keys

• نمایش تصاویر Displaying Images

• لمس یک ظاهر طراحی شده A Touch of Styling

• جمع بندی برنامه App Wrapup

نحوه رسیدگی به فرم ها How to Handle Forms

• نمای کلی برنامه App Overview

• راه اندازی اولیه Initial Setup

• موقعیت مکانی State Location

• یادآوری در رویداد Handlers Reminder on Event Handlers

• CSS اضافی Extra CSS

• دریافت عناوین جدید Receiving New Titles

• اضافه کردن یک ظاهر طراحی شده Adding Styling

• وضعیت به روز رسانی Updating State

• آن حالت را تغییر ندهید! Don't Mutate That State!

• به روز رسانی ایالت - برگه تقلب State Updates - Cheat Sheet

• [اختیاری] افزودن عناصر به شروع یا پایان [Optional] Adding Elements to the Start or End

• افزودن عناصر Adding Elements

• [اختیاری] راه حل تمرین [Optional] Exercise Solution

• [اختیاری] درج عناصر [Optional] Inserting Elements

• درج عناصر Inserting Elements

• [اختیاری] راه حل تمرین [Optional] Exercise Solution

• [اختیاری] حذف عناصر [Optional] Removing Elements

• حذف عناصر Removing Elements

• [اختیاری] راه حل تمرین [Optional] Exercise Solution

• [اختیاری] اصلاح عناصر [Optional] Modifying Elements

• [فوق العاده اختیاری] چرا نحو خاص؟ [Super Optional] Why the Special Syntax?

• اصلاح عناصر Modifying Elements

• [اختیاری] راه حل تمرین [Optional] Exercise Solution

• [اختیاری] افزودن، تغییر یا حذف ویژگی های شی [Optional] Adding, Changing, or Removing Object Properties

• چیت شیت برای تغییرات ایالت Cheatsheet for State Changes

• اضافه کردن یک کتاب، برای واقعی! Adding a Book, For Real!

• تولید شناسه های تصادفی Generating Random ID's

• نمایش لیست Displaying the List

• حذف رکوردها Deleting Records

• تغییر حالت نمایش فرم Toggling Form Display

• مقادیر فرم پیش فرض Default Form Values

• به روز رسانی عنوان Updating the Title

• بستن فرم هنگام ارسال Closing the Form on Submit

• راه حل بهتر! A Better Solution!

• درهم ریختن دو هندلر در یک Collapsing Two Handlers into One

• افزودن تصاویر Adding Images

پایداری داده با درخواست های API Data Persistence with API Requests

• افزودن ماندگاری داده Adding Data Persistence

• راه اندازی سرور Server Setup

• چه اتفاقی افتاده؟ What Just Happened?

• چگونه API کار می کند How the API Works

• معرفی REST Client Introducing the REST Client

• خطاهای ECONNREFUSED 127.0.0.1:3001 در VSCode ECONNREFUSED 127.0.0.1:3001 Errors in VSCode

• با استفاده از REST Client Using the REST Client

• ایجاد یک رکورد جدید Creating a New Record

• واکشی فهرستی از رکوردها Fetching a List of Records

• معرفی useEffect Introducing useEffect

• useEffect در اکشن useEffect in Action

• بیشتر در مورد useEffect More on useEffect

• چه زمانی اجرا می شود؟ When Does it Run?

• به روز رسانی یک رکورد Updating a Record

• فکر کردن در مورد به روز رسانی Thinking About Updates

• حذف یک رکورد Deleting a Record

ارتباط با استفاده از سیستم زمینه Communication Using the Context System

• معرفی زمینه Introducing Context

• زمینه در عمل Context in Action

• تغییر مقادیر زمینه Changing Context Values

• بیشتر در مورد تغییر زمینه More on Changing Context

• برنامه در مقابل حالت جزء Application vs Component State

• Refactoring برای استفاده از زمینه Refactoring to Use Context

• بازسازی برنامه Refactoring the App

• یادداشت سریع Quick Note

• یادآوری در مورد اشتراک گذاری با زمینه Reminder on Sharing with Context

• لوازم و زمینه با هم Props and Context Together

• آخرین بیت از Refactoring Last Bit of Refactoring

• طعم کوچک قلاب های قابل استفاده مجدد A Small Taste of Reusable Hooks

شیرجه رفتن عمیق تر به قلاب! Deeper Dive into Hooks!

• بازگشت به useEffect Return to useEffect

• یادداشت سریع Quick Note

• درک موضوع Understanding the Issue

• اعمال رفع مشکل Applying the Fix

• ESLint خوب است، اما مراقب باشید! ESLint is Good, but be Careful!

• ارجاعات پایدار با useCallback Stable References with useCallback

• رفع اشکالات با useCallback Fixing Bugs with useCallback

• رفع اشکالات UseEffect Fixing UseEffect Bugs

• استفاده از توابع پاکسازی اثر useEffect Cleanup Functions

• هدف از عملکردهای پاکسازی The Purpose of Cleanup Functions

سیستم های ناوبری و مسیریابی سفارشی Custom Navigation and Routing Systems

• اطلاعات مهم درباره بخش ها و سخنرانی های زیر Important Info About the Following Sections and Lectures

• بررسی اجمالی پروژه Project Overview

• راه اندازی پروژه Project Setup

• برخی نظریه دکمه ها Some Button Theory

• عناصر زیربنایی Underlying Elements

• حمایت از کودکان The Children Prop

• طراحی لوازم جانبی Props Design

• اعتبار سنجی Props با PropTypes Validating Props with PropTypes

• PropTypes در عمل PropTypes in Action

• معرفی TailwindCSS Introducing TailwindCSS

• نصب Tailwind Installing Tailwind

• نحوه استفاده از Tailwind How to use Tailwind

• نقد و بررسی در مورد استایلینگ Review on Styling

• کتابخانه ClassNames The ClassNames Library

• ساختن برخی از تغییرات Building Some Variations

• نهایی کردن تغییرات Finalizing the Variations

• استفاده از آیکون ها در پروژه های React Using Icons in React Projects

• مشکلات مربوط به مدیریت رویداد Issues with Event Handlers

• عبور لوازم از طریق Passing Props Through

• رسیدگی به پرونده Special ClassName Handling the Special ClassName Case

تسلط بر فرآیند طراحی دولتی Mastering the State Design Process

• سازمان پروژه Project Organization

• بازسازی با سازمان Refactoring with Organization

• بررسی اجمالی مؤلفه Component Overview

• راه اندازی کامپوننت Component Setup

• یادآوری لیست های ساختمان Reminder on Building Lists

• یادداشت سریع Quick Note

• بررسی اجمالی فرآیند طراحی حالت State Design Process Overview

• پیدا کردن آیتم گسترش یافته Finding the Expanded Item

• رندر مشروط Conditional Rendering

• گردانندگان رویداد درون خطی Inline Event Handlers

• تنوع در رویداد Handlers Variation on Event Handlers

• رندر آیکون شرطی Conditional Icon Rendering

• نمایش آیکون ها Displaying Icons

• اضافه کردن یک ظاهر طراحی شده Adding Styling

• تغییر حالت کوچک کردن پانل Toggling Panel Collapse

• یادداشت سریع Quick Note

• [اختیاری] به‌روزرسانی‌های وضعیت با تأخیر [Optional] Delayed State Updates

• [اختیاری] به روز رسانی های حالت عملکردی [Optional] Functional State Updates

• رندر مشروط Conditional Rendering

• کنترل کننده رویداد با لیست ها Event Handlers with Lists

• راه حل تمرین Exercise Solution

تمرین لوازم و طراحی حالت Practicing Props and State Design

• بررسی اجمالی مؤلفه Component Overview

• طراحی لوازم جانبی Designing the Props

• ایجاد کامپوننت Component Creation

• [اختیاری] طراحی حالت بیشتر [Optional] More State Design

• بالاخره ... اجرا! Finally... Implementation!

• یادآوری در مورد مدیریت رویداد در Maps Reminder on Event Handlers in Maps

• کشویی به عنوان یک جزء کنترل شده Dropdown as a Controlled Component

• پیاده سازی کامپوننت کنترل شده Controlled Component Implementation

• کمک کننده بررسی وجود Existence Check Helper

• کنوانسیون جامعه با نام های Props Community Convention with Props Names

• کنترل فرم - کنوانسیون نامگذاری پروپ Form Controls - Prop Naming Convention

• راه حل تمرین Exercise Solution

• اضافه کردن یک ظاهر طراحی شده Adding Styling

• جزء پنل The Panel Component

• ایجاد پنل قابل استفاده مجدد Creating the Reusable Panel

• یک ویژگی اضافی چالش برانگیز A Challenging Extra Feature

• کنترل کننده های کلیک گسترده در سند Document-Wide Click Handlers

• رویداد ضبط و حباب Event Capture and Bubbling

• همه اش را بگذار کنار هم Putting it All Together

• چرا Capture Phase Handler؟ Why a Capture Phase Handler?

• یادآوری در مورد تابع useEffect Reminder on the useEffect Function

• یادآوری در مورد پاکسازی useEffect Reminder on useEffect Cleanup

• مسائل مربوط به مراجع عنصر Issues with Element References

• useRef در عمل useRef in Action

• بررسی مکان کلیک کنید Checking Click Location

ساخت ناوبری قابل استفاده مجدد Making Navigation Reusable

• ناوبری مرورگر سنتی Traditional Browser Navigation

• نظریه ناوبری در React Theory of Navigation in React

• استخراج صفحه بازشو Extracting the DropdownPage

• پاسخ به سوالات انتقادی Answering Critical Questions

• تابع PushState The PushState Function

• مدیریت کلیک های لینک Handling Link Clicks

• دست زدن به عقب: دکمه های جلو Handling Back:Forward Buttons

• زمینه ناوبری Navigation Context

• گوش دادن به کلیک های جلو و عقب Listening to Forward and Back Clicks

• ناوبری برنامه ای Programmatic Navigation

• یک مؤلفه پیوند A Link Component

• یک جزء مسیر A Route Component

• کنترل کلیدهای فرمان و کنترل Handling Control and Command Keys

• سبک پیوند Link Styling

• قلاب ناوبری سفارشی Custom Navigation Hook

• افزودن کامپوننت نوار کناری Adding a Sidebar Component

• برجسته کردن لینک فعال Highlighting the Active Link

• جمع بندی ناوبری Navigation Wrapup

ایجاد پورتال با ReactDOM Creating Portals with ReactDOM

• بررسی اجمالی اجزای معین Modal Component Overview

• تغییر وضعیت دید Toggling Visibility

• در نگاه اول، آسان! At First Glance, Easy!

• ما خوش شانس هستیم که اصلا کار می کند! We're Lucky it Works At All!

• رفع مودال با پورتال Fixing the Modal with Portals

• بستن Modal Closing the Modal

• سفارشی کردن Modal Customizing the Modal

• یک ظاهر طراحی اضافی Additional Styling

• یک اشکال کوچک One Small Bug

• جمع بندی معین Modal Wrapup

یک جدول با ویژگی های کامل بسازید! Make a Feature-Full Data Table!

• ایجاد جدول قابل استفاده مجدد Creating a Reusable table

• انتقال داده ها به جدول Communicating Data to the Table

• یادآوری در ساختار HTML جدول Reminder on Table HTML Structure

• ساخت ردیف ها Building the Rows

• استایل بهتر Better Styling

• انجام شده! اما قابل استفاده مجدد نیست Done! But It's Not Reusable

• ایده اینجاست Here's the Idea

• هدرهای جدول پویا Dynamic Table Headers

• رندر کردن سلول های فردی Rendering Individual Cells

• مقادیر سلول ثابت Fixed Cell Values

• نقشه های تو در تو Nested Maps

• رفع رنگ Fixing the Color

• اضافه کردن یک تابع کلیدی Adding a Key Function

هوشمند شدن با مرتب سازی داده ها Getting Clever with Data Sorting

• اضافه کردن مرتب سازی به جدول Adding Sorting to the Table

• یادآوری مرتب سازی در جاوا اسکریپت Reminder on Sorting in JavaScript

• مرتب سازی رشته ها Sorting Strings

• مرتب سازی اشیاء Sorting Objects

• پیاده سازی مرتب سازی شی Object Sort Implementation

• ترتیب مرتب سازی معکوس Reversing Sort Order

• مرتب سازی اختیاری Optional Sorting

• یک ویژگی کوچک اضافی A Small Extra Feature

• سفارشی سازی سلول های سرصفحه Customizing Header Cells

• React Fragments React Fragments

• فاش شدن بزرگ The Big Reveal

• اضافه کردن SortableTable Adding SortableTable

• تماشای کلیک‌های سلول سرصفحه Watching for Header Cell Clicks

• طراحی حالت سریع Quick State Design

• اضافه کردن حالت مرتب سازی Adding Sort State

• Yessssss، این کار کرد! Yessssss, It Worked!

• تعیین مجموعه آیکون Determining Icon Set

• شکل دادن به سلول های سرصفحه Styling Header Cells

• بازنشانی ترتیب مرتب سازی Resetting Sort Order

• جمع بندی میز Table Wrapup

قلاب های سفارشی در عمق Custom Hooks In Depth

• کاوش استفاده مجدد از کد Exploring Code Reuse

• بازبینی قلاب های سفارشی Revisiting Custom Hooks

• ایجاد مؤلفه آزمایشی Creating the Demo Component

• ایجاد قلاب سفارشی Custom Hook Creation

• یادداشت سریع Quick Note

• فرآیند ایجاد قلاب در عمق Hook Creation Process in Depth

• ساخت قلاب مرتب سازی قابل استفاده مجدد Making a Reusable Sorting Hook

به دنیای کاهنده ها Into the World of Reducers

• نمای کلی برنامه App Overview

• افزودن فرم Adding the Form

• بیشتر در فرم More on the Form

• useReducer در عمل useReducer in Action

• قوانین توابع کاهنده Rules of Reducer Functions

• درک اکشن اشیاء Understanding Action Objects

• انواع کنش ثابت Constant Action Types

• Refactoring به یک سوئیچ Refactoring to a Switch

• افزودن به‌روزرسانی‌های ایالتی جدید Adding New State Updates

• چند ملاحظات طراحی در مورد کاهنده ها A Few Design Considerations Around Reducers

• چند سوال در مورد کاهنده ها A Few Questions on Reducers

• معرفی Immer Introducing Immer

• غوطه ور در عمل Immer in Action

به جعبه ابزار Redux شیرجه بزنید Dive Into Redux Toolkit

• به دنیای Redux Into the World of Redux

• Redux vs Redux Toolkit Redux vs Redux Toolkit

• نمای کلی برنامه App Overview

• مسیر رو به جلو The Path Forward

• زمان اجرا! Implementation Time!

• درک فروشگاه Understanding the Store

• وضعیت اولیه فروشگاه The Store's Initial State

• درک برش ها Understanding Slices

• درک اکشن سازندگان Understanding Action Creators

• اتصال React به Redux Connecting React to Redux

• به روز رسانی حالت از یک مؤلفه Updating State from a Component

• دسترسی به حالت در یک جزء Accessing State in a Component

• حذف محتوا Removing Content

• وضعیت به روز رسانی را تمرین کنید! Practice Updating State!

• ایالت دسترسی را تمرین کنید! Practice Accessing State!

• حتی بیشتر به روز رسانی دولت! Even More State Updating!

• حالت بازنشانی Resetting State

• به روز رسانی های چندگانه ایالتی Multiple State Updates

• درک جریان عمل Understanding Action Flow

• مراقب اقدامات دیگر Watching for Other Actions

• دریافت یک Action Creator's Type Getting an Action Creator's Type

• ایجاد اکشن دستی Manual Action Creation

• ساختار فایل و پوشه File and Folder Structure

• بازسازی ساختار پروژه Refactoring the Project Structure

• لینک پروژه تکمیل شده Link to Completed Project

مدیریت برش های متعدد با Redux Toolkit Managing Multiple Slices with Redux Toolkit

• بررسی اجمالی پروژه Project Overview

• اضافه کردن کامپوننت دیگ بخار Adding Component Boilerplate

• تفکر در مورد حالت مشتق شده Thinking About Derived State

• فکر کردن به طراحی Redux Thinking About Redux Design

• افزودن برش فرم Adding the Form Slice

• نگهداری یک مجموعه با یک برش Maintaining a Collection with a Slice

• ایجاد فروشگاه Creating the Store

• مقادیر فرم برای به روز رسانی وضعیت Form Values to Update State

• دریافت هزینه Receiving the Cost

• ارسال در طول ارسال فرم Dispatching During the Form Submission

• کلیدهای دوتایی ناجور Awkward Double Keys

• فهرست کردن رکوردها Listing the Records

• حذف رکوردها Deleting Records

• فایل CSS برای دانلود CSS File for Download

• اضافه کردن یک ظاهر طراحی شده Adding Styling

• بازنشانی فرم هنگام ارسال Form Reset on Submission

• یادآوری ExtraReducers Reminder on ExtraReducers

• افزودن ورودی جستجو Adding a Searching Input

• حالت مشتق شده در useSelector Derived State in useSelector

• کل هزینه خودرو Total Car Cost

• برجسته کردن خودروهای موجود Highlighting Existing Cars

ارتباط با API با استفاده از Async Thunks Interfacing with API's Using Async Thunks

• نمای کلی برنامه App Overview

• اضافه کردن چند وابستگی Adding a Few Dependencies

• برنامه اولیه Boilerplate Initial App Boilerplate

• راه اندازی سرور API API Server Setup

• فایل های کامپوننت Component Files

• اضافه کردن چند کامپوننت Adding a Few Components

• ایجاد فروشگاه Redux Creating the Redux Store

• تفکر در مورد ساختار داده Thinking About Data Structuring

• یادآوری کنوانسیون های درخواستی Reminder on Request Conventions

• تکنیک های واکشی داده ها Data Fetching Techniques

• بخش Thunks Async اختیاری Optional Async Thunks Section

• اضافه کردن حالت برای بارگذاری داده ها Adding State for Data Loading

• درک Async Thunks Understanding Async Thunks

• مراحل اضافه کردن Thunk Steps for Adding a Thunk

• بیشتر در مورد افزودن Thunks More on Adding Thunks

• جمع کردن Thunk Wrapping up the Thunk

• با استفاده از حالت بارگذاری Using Loading State

• اضافه کردن مکث برای تست Adding a Pause for Testing

• اضافه کردن اسکلت لودر Adding a Skeleton Loader

• انیمیشن با TailwindCSS Animations with TailwindCSS

• ارائه لیست کاربران Rendering the List of Users

• ایجاد کاربران جدید Creating New Users

• وضعیت بارگیری غیرمنتظره Unexpected Loading State

• استراتژی برای حالت بارگیری ریز دانه Strategies for Fine-Grained Loading State

• حالت بارگیری ریز دانه محلی Local Fine-Grained Loading State

• اطلاعات بیشتر در مورد وضعیت بارگیری More on Loading State

• مدیریت خطاها با ایجاد کاربر Handling Errors with User Creation

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

• ایجاد کامپوننت دکمه Fetch-Aware Creating a Fetch-Aware Button Component

• نمایش اسکلت بهتر Better Skeleton Display

• Thunk برای حذف یک کاربر A Thunk to Delete a User

• به روز رسانی Slice Updating the Slice

• بازسازی کامپوننت Refactoring the Component

• حذف کاربر Deleting the User

• رفع خطای حذف Fixing a Delete Error

• نمای کلی ویژگی های آلبوم Album Feature Overview

• اجزای اضافی Additional Components

• اضافه شدن ExpandablePanel Adding the ExpandablePanel

• بسته بندی ExpandablePanel Wrapping Up the ExpandablePanel

• افزودن لیست آلبوم ها Adding the Albums Listing

Async مدرن با Query Redux Toolkit Modern Async with Redux Toolkit Query

• به این بخش پرش می کنید؟ Skipping to this Section?

• [اختیاری] گرفتار شدن [Optional] Getting Caught Up

• معرفی Redux Toolkit Query Introducing Redux Toolkit Query

• ایجاد یک RTK Query API Creating a RTK Query API

• ایجاد نقطه پایانی Creating an Endpoint

• با استفاده از قلاب تولید شده Using the Generated Hook

• چند یادداشت فوری A Few Immediate Notes

• ارائه لیست Rendering the List

• تغییر داده ها با جهش Changing Data with Mutations

• تفاوت بین کوئری ها و جهش ها Differences Between Queries and Mutations

• گزینه هایی برای بازیابی داده ها Options for Refetching Data

• درخواست حذف مجدد Request De-Duplication

• برخی موارد داخلی Query Redux Toolkit Some Internals of Redux Toolkit Query

• واکشی مجدد با برچسب ها Refetching with Tags

• اعتبار سنجی برچسب ریز Fine-Grained Tag Validation

• رفع یک ظاهر طراحی شده Styling Fixups

• اضافه کردن مکث برای تست Adding a Pause for Testing

• پیاده سازی Delete Endpoints Implementing Delete Endpoints

• اصلاح مجدد فهرست Refactoring the List

• حذف پیاده سازی Remove Implementation

• باطل کردن آسان تگ Easy Tag Invalidation

• هوشمند شدن با برچسب های کش Getting Clever with Cache Tags

• پیاده سازی هوشمندانه تگ بیشتر More Clever Tag Implementation

• نمای کلی ویژگی عکس ها Photos Feature Overview

• راه اندازی تعداد زیادی عکس! Lots of Photos Setup!

• اضافه کردن نقاط پایانی Adding the Endpoints

• ایجاد عکس Creating the Photo

• نمایش لیست عکس ها Showing the List of Photos

• اضافه کردن موارد حذف شده با ماوس Adding Mouse-Over Deletes

• افزودن بازیابی خودکار داده ها Adding Automatic Data Refetching

جایزه! Bonus!

• جایزه! Bonus!