آموزش راهنمای کامل React Ultimate | تجارت الکترونیک | قلاب | Redux

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

مقدمه و مبانی Introduction & Basics

• React چیست What is React

• کامپوننت ها را درک کنید Understand Components

اولین برنامه React شما Your First React App

• برنامه جدید React ایجاد کنید Create New React App

• برنامه React را از ابتدا ایجاد کنید Create React App From Scratch

• بارگذاری بوت استرپ Load Bootstrap

• کامپوننت ها را ایجاد کنید Create Components

• اضافه کردن سبک های CSS Add CSS Styles

• Bootstrap NavBar را اضافه کنید Add Bootstrap NavBar

• رفع خطا - کلاس ویژگی DOM Fix Error - DOM property class

• اجزای تو در تو Nested Components

• خودت را بیازمای Test Yourself

داده های خود را ارائه دهید Render Your Data

• رندر عبارات Render Expressions

• رسیدگی به رویدادها Handle Events

• وضعیت مؤلفه را به روز کنید Update Component State

• فهرست رندر Render List

• رندر مشروط Render Conditionally

• روش های رندر Render Methods

• رندر تصاویر Render Images

• رندر سبک های CSS Render CSS Styles

• رندر کلاس های CSS Render CSS Classes

• آرگومان های رویداد را پاس کنید Pass Event Arguments

• خودت را بیازمای Test Yourself

• محاسبات شبکه Grid Calculations

ارتباط مؤلفه والد و فرزند Parent-Child Component Communication

• رندر اجزای کودک Render Child Components

• لوازم جانبی Props

• Props در مقابل دولت Props vs State

• لوازم.کودکان Props.Children

• رویدادهای کودک را مدیریت کنید Handle Child Events

• اجزای کودک را حذف کنید Delete Child Components

• خودت را بیازمای Test Yourself

روش های چرخه زندگی Life Cycle Methods

• مراحل چرخه زندگی Life Cycle Phases

• فاز نصب Mounting Phase

• فاز به روز رسانی Updating Phase

• فاز جدا کردن Unmounting Phase

• چرخه زندگی اجزای کودک Life Cycle of Child Components

• فاز رسیدگی به خطا Error Handling Phase

تشکیل می دهد Forms

• فرم پایه Basic Form

• صحافی دو طرفه Two-Way Binding

• دکمه ارسال فرم Form Submit Button

REST-Api Calls REST-Api Calls

• درخواست های HTTP HTTP Requests

• Async و Await Async and Await

• فرم ورود با درخواست HTTP Login Form with HTTP Request

مسیریابی Routing

• مسیریابی پایه Basic Routing

• 404 صفحه 404 Page

• تعویض Switch

• ارتباط دادن Link

• مسیر فعال Active Route

• پیوندها را مشروط رندر کنید Render Links Conditionally

• به روز رسانی وضعیت ورود Update Login State

• به صورت برنامه ای پیمایش کنید Navigate Programmatically

• خروج Logout

• نوار کناری Sidebar

• پارامترهای مسیر Route Parameters

• نوار عنوان را به روز کنید Update Title bar

• هش روتر Hash Router

چیز چندش و کثیف CRUD

• گرفتن Get

• پست Post

• خطاهای گرفتن Catch Errors

• قرار دادن Put

• حذف Delete

• صفحه بندی Paging

تایید اعتبار Validate

• فرم ثبت نام Registration Form

• تایید اعتبار Validate

• اعتبارسنجی تاریخ ها Validate Dates

• معتبر است IsValid

• کثیف Dirty

• دکمه رادیویی Radio Button

• فهرست کشویی DropDownList

• کادر را علامت بزنید Check Box

• پیغام خطا Error Messages

• ارسال فرم ثبت نام Submit Registration Form

اجزای عملکردی و قلاب ها [پروژه دوره] Functional Components & Hooks [Course Project]

• نمای کلی پروژه دوره Overview of Course Project

• راه اندازی JSON-Server Setup JSON-Server

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

• اجزای کلاس در مقابل اجزای عملکردی Class Components vs Functional Components

• مقدمه ای بر هوکس Intro to Hooks

• استفاده از حالت هوک useState Hook

• مسیریابی Routing

• نوار نوار NavBar

• useEffect - روی هر رندر اجرا شود useEffect - Run on each Render

• useEffect - اجرا در به روز رسانی useEffect - Run on Update

• useEffect - اجرا بر روی کوه useEffect - Run on Mount

• useEffect - اجرا در Unmount useEffect - Run on Unmount

• useState با اشیاء useState with Objects

• اعتبارسنجی با هوک - ثبت نام Validations with Hooks - Register

• اعتبارسنجی با قلاب - ورود Validations with Hooks - Login

• useContext - احراز هویت کاربر useContext - User Authentication

• useState با آرایه ها useState with Arrays

• خدمات قابل استفاده مجدد Re-Usable Services

• React.memo React.memo

• useCallback - قسمت 1 useCallback - Part 1

• useCallback - قسمت 2 useCallback - Part 2

• Handle Multiple Tables - Part 1 Handle Multiple Tables - Part 1

• Handle Multiple Tables - Part 2 Handle Multiple Tables - Part 2

• Handle Multiple Tables - Part 3 Handle Multiple Tables - Part 3

• ورود مدیر Admin Login

• شبکه محصولات Products Grid

• شبکه - فیلتر Grid - Filter

• شبکه - مرتب سازی Grid - Sort

• useMemo useMemo

• استفاده از کاهش دهنده با زمینه useReducer with Context

• useRef useRef

Redux Redux

• مقدمه ای بر Redux Introduction to Redux

• جریان داده Redux Redux Data Flow

• شروع کار با Redux Getting Started with Redux

• کاهنده ها Reducers

• فروشگاه Store

• اعزام و اقدام Dispatch and Action

• Redux DevTools Redux DevTools

• مشترک شدن در فروشگاه Subscribe to Store

• ظرفیت ترابری Payload

• انواع اقدام Action Types

• اکشن خالق Action Creator

React-Redux و Redux-Thunk React-Redux and Redux-Thunk

• ساختار پروژه برنامه React-Redux World Real Real World React-Redux App Project Structure

• React UI ایجاد کنید Create React UI

• حالت اولیه Initial State

• انواع اقدام Action Types

• اقدامات Actions

• کاهنده ها Reducers

• فروشگاه Store

• استفاده از انتخابگر useSelector

• استفاده از Dispatch useDispatch

• جستجو کردن Search

• React-Thunk - درخواست Http React-Thunk - Http Request

• Axios Axios

• الگوی درخواست-موفقیت-شکست Request-Success-Failure Pattern

• ایجاد و حذف با استفاده از الگوی درخواست - موفقیت - شکست Create and Delete using Request-Success-Failure Pattern

• اتصال () connect()

• mapStateToProps و mapDispatchToProps mapStateToProps and mapDispatchToProps

• mapDispatchToProps به عنوان شی mapDispatchToProps as Object

• Redux-Logger Redux-Logger

• پیکربندی Redux-Logger Redux-Logger Configuration

• Redux Custom Middleware Redux Custom Middleware

Redux-Promise Redux-Promise

• Redux-Promise Redux-Promise

• با Redux-Promise ایجاد و حذف کنید Create and Delete with Redux-Promise

Redux-Saga Redux-Saga

• توابع ژنراتور Generator Functions

• مقدمه ای بر Redux-Saga Introduction to Redux-Saga

• شروع کار با Redux-Saga Getting Started with Redux-Saga

• حماسه ریشه Root Saga

• حماسه کارگری Worker Saga

• عملیات Async یا درخواست های HTTP Async Operations or HTTP requests

• با Redux-Saga ایجاد و حذف کنید Create and Delete with Redux-Saga

• takeEvery در مقابل takeLatest takeEvery vs takeLatest

• انحراف debounce

• دریچه گاز throttle

• زنگ زدن call

• چنگال fork

• همه all

• گرفتن take

• دوباره امتحان کنید retry

• لغو cancel

• نژاد race

• انتخاب کنید select

Redux-Toolkit Redux-Toolkit

• معرفی Redux-Toolkit Intro to Redux-Toolkit

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

• حالت اولیه Initial State

• ایجاد رابط کاربری Create UI

• کاهنده ها Reducers

• createSlice createSlice

• configureStore configureStore

• استفاده از انتخابگر useSelector

• ارسال dispatch

• با Redux Toolkit به روز رسانی کنید Update with Redux Toolkit

• برش های متعدد Multiple Slices

• کاهنده های اضافی extraReducers

• createAsyncThunk createAsyncThunk

• createAsyncThunk - ایجاد و حذف کنید createAsyncThunk - Create and Delete

امتیاز: توابع جاوا اسکریپت Bonus: JavaScript Functions

• ایجاد توابع Creating Functions

• توابع بدون آرگومان و بازگشت Functions with no Arguments and Return

• تابع تابع دیگری را فرا می خواند Function Calls Another Function

• کلمه کلیدی آرگومان ها Arguments keyword

• بازگشت Recursion

• آرگومان های پیش فرض Default Arguments

• محدوده متغیرها Scope of Variables

• توابع خالص Pure Functions

• توابع پاسخ به تماس Callback Functions

• setTimeout setTimeout

• setInterval setInterval

• کاری کردن Currying

امتیاز: اشیاء جاوا اسکریپت Bonus: JavaScript Objects

• لفظ شیء Object Literals

• این کلمه کلیدی this keyword

• سناریوهای دنیای واقعی و اشکال زدایی JS Real World Scenarios and JS Debugging

• افزودن اعضا از خارج از شی Adding Members From Outside of Object

• دسترسی به Properties Accessing Properties

• تابع - تماس Function - call

• تابع - اعمال شود Function - apply

• تابع - اتصال Function - bind

• توابع پیکان Arrow Functions

• حلقه for-in For-in loop

• تخریب اشیاء Destructuring Objects

• پارامترهای تابع تخریب ساختار Destructuring Function Parameters

پاداش: ES2015 یا ES6 - کلاس ها Bonus: ES2015 or ES6 - Classes

• کلاس ها Classes

• سازنده Constructor

• خصوصیات خصوصی و روشهای خصوصی Private Properties and Private Methods

• روش‌ها را تنظیم و دریافت کنید Set and Get Methods

• ویژگی های Accessor - تنظیم و دریافت Accessor Properties - Set and Get

• وراثت طبقاتی Class Inheritance

امتیاز: آرایه ها - جاوا اسکریپت Bonus: Arrays - JavaScript

• ایجاد آرایه ها Creating Arrays

• فشار و پاپ Push and Pop

• اسپلایس Splice

• Concat Concat

• هر Every

• مقداری Some

• فیلتر کنید Filter

• پیدا کردن Find

• FindIndex FindIndex

• برای هر ForEach

• شامل می شود Includes

• IndexOf IndexOf

• نقشه Map

• FlatMap FlatMap

• تخت Flat

• معکوس Reverse

• تکه Slice

• مرتب سازی Sort

پایان The End

• بعد چه می شود؟ What's Next?

• پاداش: 6 دلار - کوپن های تخفیف برای دوره های Udemy دیگر Bonus: $6 - Discount Coupons for my other Udemy Courses