آموزش React JS Web Development - The Essentials Bootcamp

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

معرفی Introduction

• آنچه از شرکت در این دوره به دست خواهید آورد What You’ll Get From Taking this Course

• بررسی 7 متری توسعه وب و React A 7m Overview of Web Development and React

• Repo دوره و نصب نرم افزار Course Repo and Software Installations

• اختیاری برای ویندوز: زیرسیستم ویندوز را برای لینوکس و کد VS نصب کنید Optional For Windows: Install the Windows Subsystem for Linux and VS Code

محتوای مرجع اختیاری Optional Reference Content

• قسمت 1 مروری بر مگا جاوا اسکریپت اختیاری Optional Mega JavaScript Overview Part 1

• قسمت 2 مروری بر مگا جاوا اسکریپت اختیاری Optional Mega JavaScript Overview Part 2

به React خوش آمدید | اولین برنامه React Welcome to React | First React Application

• نمای کلی بخش | اولین برنامه React Section Overview | First React Application

• برنامه نمونه کارها را تنظیم کنید - بازبینی شده Set up the Portfolio App - Revised

• React App و React Project Structure - Revised را اجرا کنید Run the React App and the React Project Structure - Revised

• ReactDOM، Elements و JSX - تجدید نظر شده است ReactDOM, Elements, and JSX - Revised

• A React Component - تجدید نظر شده A React Component - Revised

• کلاس ها - بررسی اجمالی Classes - Overview

• کلاس‌ها، وراثت، و نگاهی دقیق‌تر به مؤلفه‌ها Classes, Inheritance, and a Closer Component Look

• حالت State

• SetState SetState

• یک قانون React: هرگز مستقیماً حالت را تغییر ندهید A React Rule: Never Directly Modify State

• ویژگی های کلاس و آغازگرها Class Properties and Initializers

• جزء 2: پروژه ها Component 2: Projects

• لوازم و مولفه پروژه Props and Project Component

• چالش: مولفه پروفایل های اجتماعی Challenge: Social Profiles Component

• کد: جزء پروفایل های اجتماعی Code: Social Profiles Component

• با میوه های حالت دار کم آویزان بپوشانید Wrap up with Low-Hanging Styling Fruit

• خلاصه بخش Section Summary

شکستن React | React و توسعه وب Breaking down React | React and Web Development

• نمای کلی بخش Section Overview

• واکنش از ابتدا - تجدید نظر شده است React from Scratch - Revised

• کامپایل، بسته بندی، و نگاهی دقیق تر به JSX - بازبینی شده Compiling, Bundling, and a Closer Look at JSX - Revised

• نمونه کارها را برای استفاده از بسته اصلاح کنید - اصلاح شده Refactor the Portfolio to use Parcel - Revised

• بررسی ضرورت باندلرها و ترانسپایلرها The Necessity of Bundlers and Transpilers Review

• DOM و DOM مجازی React The DOM and React’s Virtual DOM

• خلاصه بخش Section Summary

ادامه مفاهیم اصلی React Continued Main React Concepts

• پیش نمایش بخش Section Preview

• روش‌های چرخه حیات و componentDidMount Lifecycle Methods and componentDidMount

• ComponentWillUnmount ComponentWillUnmount

• [اختیاری] محو شدن عنوان [Optional] Title Fade

• اجزای عملکردی بدون تابعیت Stateless Functional Components

• [اختیاری] نمای کلی HTTP [Optional] HTTP Overview

• کامپوننت واکشی و جوک Fetch and a Jokes Component

• چالش و کد: ده جوک دیگر Challenge and Code: Ten More Jokes

• Fetch Under the Hood: Promises Fetch Under the Hood: Promises

• React Router - تجدید نظر شده است React Router - Revised

• کامپوننت هدر Header Component

• مولفه های مرتبه بالاتر - تجدید نظر شده Higher Order Components - Revised

• خلاصه بخش Section Summary

بررسی مفاهیم Core React Core React Concepts Review

• بررسی Core React Core React Review

• Core React - واژه نامه اصطلاحات کلیدی Core React - Glossary of Key Terms

پروژه Core React: MusicMaster 2.0 Core React Project: MusicMaster 2.0

• پیش نمایش بخش و پروژه Section and Project Preview

• Music Master و الگوی برنامه React خودتان را تنظیم کنید - بازبینی شده Set up Music Master and Your Own React App Template - Revised

• ردیابی ورودی کاربر در ایالت Track User Input in the State

• چالش و کد: آهنگ های برتر یک هنرمند را جستجو کنید Challenge and Code: Search an Artist’s Top Tracks

• چالش و کد: جزء هنرمند Challenge and Code: Artist Component

• کامپوننت آهنگ Tracks Component

• جستجوی مؤلفه و وضعیت بالا بردن در پشتیبان تماس Search Component and Lifting State Up in Callback Props

• یک ظاهر طراحی شده لمس پایان Styling Finishing Touches

• شامل Music Master در نمونه کارها - اصلاح شده Include Music Master in Portfolio - Revised

• خلاصه بخش Section Summary

Redux and More Advanced React - Sequel Preview Redux and More Advanced React - Sequel Preview

• پیش نمایش بخش و پروژه Section and Project Preview

• بررسی اجمالی Redux Redux Overview

• زوج یا شانس و فروشگاه Redux | تجدید نظر شده است Set Up Evens or Odds and the Redux Store | Revised

• کاهنده | تجدید نظر شده است Reducers | Revised

• اقدامات | تجدید نظر شده است Actions | Revised

• Action Creators | تجدید نظر شده است Action Creators | Revised

• Root Reducer Update و Spread Operator | تجدید نظر شده است Root Reducer Update and the Spread Operator | Revised

• تقسیم لایه های Redux | تجدید نظر شده است Split the Redux Layers | Revised

• React Components را به Redux متصل کنید | تجدید نظر شده است Connect React Components to Redux | Revised

• UI مبتنی بر Redux Redux-based UI

• ارسال نقشه به Props Map Dispatch to Props

• چالش و کد: دستورالعمل های تعاملی Challenge and Code: Interactive Instructions

• واکشی دسته کارت Fetch Deck of Cards

• توجه: Deckofcardsapi خط مشی CORS خود را به روز کرد Note: The deckofcardsapi updated their CORS policy

• CORS و سیاست مبدا یکسان CORS and Same Origin Policy

• اقدامات همگام Async Actions

• Redux Middleware | تجدید نظر شده است Redux Middleware | Revised

• دسته Fetch Cases Handle Fetch Cases

• تقسیم و ترکیب کاهنده ها | تجدید نظر شده است Split up and Combine Reducers | Revised

• جزء DrawCard DrawCard Component

• چالش و کد: رسم کارت Redux Flow Challenge and Code: Draw Card Redux Flow

• چالش و کد: جزء کارت Challenge and Code: Card Component

• چالش و کد: منطق و مؤلفه Redux را حدس بزنید | تجدید نظر شده است Challenge and Code: Guess Redux Logic and Component | Revised

• حدس های صحیح را پیگیری کنید Track Correct Guesses

• رکورد حدس صحیح و ذخیره محلی Correct Guess Record and Local Storage

• شامل زوج یا شانس در نمونه کارها | تجدید نظر شده است Include Evens or Odds in Portfolio | Revised

React Hooks بخش 1 - شیرجه رفتن به توسعه قلاب React Hooks Section 1 - Dive into Hooks Development

• پیش نمایش پروژه یک Project One Preview

• راه اندازی پروژه یک | تجدید نظر شده است Set Up Project One | Revised

• هوک اول: useState | تجدید نظر شده است First Hook: useState | Revised

• useEffect useEffect

• چالش و کد: کامپوننت داستان ها با UseEffect | تجدید نظر شده است Challenge and Code: Stories Component with UseEffect | Revised

• ساخت یک قلاب سفارشی: useFetch Build a Custom Hook: useFetch

• [اختیاری] کلمه کلیدی تابع در مقابل توابع پیکان [Optional] Function Keyword vs Arrow Functions

React Hooks بخش 2 - Hooks Under the Hood React Hooks Section 2 - Hooks Under the Hood

• پیش نمایش بخش - قلاب های زیر سرپوش Section Preview - Hooks Under the Hood

• React Runtime و How React Applies Hooks The React Runtime and How React Applies Hooks

• UseState Under the Hood UseState Under the Hood

• مولفه وظایف بخش 1: قلاب های حالت چند منظوره Tasks Component Part 1: Multiple useState hooks

• بخش وظایف بخش 2 Tasks Component Part 2

• ترتیب استفاده از وضعیت The Order of UseState

• فضای ذخیره‌سازی محلی برای وظایف Local Storage for Tasks

• قلاب با فاصله Hooks with an Interval

• جلوه ها با پاکسازی Effects with Cleanup

• تاخیر و افزایش دینامیک Dynamic Delay and Increment

• چالش و کد: جزء ماتریس Challenge and Code: Matrix Component

• ساخت یک قلاب سفارشی: useDynamicTransition Build a Custom Hook: useDynamicTransition

React Hooks بخش 3 - تاملی در مورد چرایی Hooks و پروژه دو React Hooks Section 3 - Reflection on the Why of Hooks & Project Two

• چرا قلاب The Why of Hooks

• پیش نمایش پروژه دو Project Two Preview

• نمای کلی الگوی کاهش دهنده The Reducer Pattern Overview

• برنامه Reaction را راه اندازی کنید Set Up Reaction App

• حالت کاهش دهنده واکنش ها Reactions Reducer State

• UseReducer for Tasks | قسمت 1 UseReducer for Tasks | Part 1

• UseReducer for Tasks | قسمت 2 UseReducer for Tasks | Part 2

• کامپوننت PublishMessage PublishMessage Component

• چالش و کد: کامپوننت MessageBoard Challenge and Code: MessageBoard Component

• UseContext و یک قلاب زمینه سفارشی UseContext and a Custom Context Hook

• معماری PubSub و Reducer The PubSub and Reducer Architecture

• PubNub را کاوش کنید Explore PubNub

• عملکرد PubSub و اتصال Reducer PubSub Function and Reducer Connection

• نام کاربری را تنظیم کنید Set Username

• کامپوننت CreateReaction CreateReaction Component

• جریان کاهش دهنده واکنش ها Reactions Reducer flow

• واکنش ها را منتشر کنید Publish Reactions

• کامپوننت MessageReactions MessageReactions Component

محتوای عمقی جاوا اسکریپت اختیاری Optional In-Depth JavaScript Content

• کنسول، اپراتورها و متغیرها The Console, Operators, and Variables

• Booleans و Conditionals Booleans and Conditionals

• نحو - نقطه ویرگول و نظرات Syntax - Semicolons and Comments

• تعریف نشده و ابتدایی Undefined and Primitives

• آرایه ها Arrays

• اشیاء Objects

• حلقه ها و تکرار Loops and Iteration

• توابع - اعلان ها در مقابل عبارات Functions - Declarations vs. Expressions

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

• روش ها و کلمه کلیدی «این». Methods and the `this` Keyword

• بیشتر در مورد "این" و عبارات تابع در مقابل توابع پیکان More on `this` and Function Expressions vs. Arrow functions

• سوال مصاحبه | کلمه کلیدی "این". Interview Question | The `this` Keyword

• تماس های تلفنی Callbacks

• سوال مصاحبه | تماس های تلفنی Interview Question | Callbacks

• زبان پویا و انواع A Dynamic Language and Types

• تقریباً همه چیز یک شی است Almost Everything is an Object

• مساوات و نوع اجبار Equality and Type Coercion

• راست و دروغ Truthy and Falsy

• تهی در مقابل تعریف نشده Null vs. Undefined

• تبدیل نوع صریح Explicit Type Conversion

• سوال مصاحبه | انواع جاوا اسکریپت Interview Question | JavaScript Types

• Let، Const و Mutability Let, Const, and Mutability

• Let، Const، Var و Scope Let, Const, Var, and Scope

• Var and Function Hoisting Var and Function Hoisting

• سوال مصاحبه | دامنه و بالا بردن Interview Question | Scope and Hoisting

• Template Literals و Tenary Operators Template Literals and Ternary Operators

• مختصر نویسی و واگذاری ساختاری The Property Shorthand and Destructuring Assignment

• روش های شی Object methods

• نحو را گسترش دهید Spread Syntax

• Object.is، References و Shallow Clone Object.is, References, and Shallow Clone

• JSON.parse، JSON.stringify، و تلاش برای شبیه‌سازی عمیق JSON.parse, JSON.stringify, and an Attempt at Deep Cloning

• سفارشی و Lodash CloneDeep Custom and Lodash CloneDeep

• سوال مصاحبه | شبیه سازی یک شی Interview Question | Cloning an Object

• بسته شدن Closures

• کارخانجات عملکردی Function Factories

• توابع مرتبه بالاتر Higher Order Functions

• سوال مصاحبه | بسته شدن، توابع درجه بالاتر، و پاسخ به تماس Interview Question | Closures, Higher-Order Functions, and Callbacks

• برنامه نویسی شی گرا Object-Oriented Programming

• توابع سازنده Constructor functions

• کلاس ها Classes

• نمونه های اولیه و وراثت مبتنی بر نمونه اولیه Prototypes and the Prototype-Based Inheritance

• Object Prototype، .__proto__، و زنجیره نمونه اولیه Object Prototype, .__proto__, and the prototype chain

• سوال مصاحبه | وراثت مبتنی بر نمونه اولیه Interview Question | Prototype-Based Inheritance

• کد ناهمزمان با SetTimeout Asynchronous Code with SetTimeout

• واکشی و قول بده Fetch and Promise

• قول از اول Promise from Scratch

• موتور جاوا اسکریپت و زمان اجرا JavaScript Engine and Runtime

• انتظار و Async Await and Async

• سوال مصاحبه | جاوا اسکریپت ناهمزمان Interview Question | Asynchronous JavaScript

نتیجه گیری و عاقبت دوره Conclusion and Course Sequel

• تبریک و عاقبت دوره Congratulations and Course Sequel

• بررسی اجمالی Redux [پیش‌نمایش Bootcamp Redux] Redux Overview [Redux Bootcamp Preview]

• محتوای پاداش! Bonus Content!