آموزش ضروری واکنش نشان می دهد

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

مقدمه Introduction

• رابط کاربری قوی با React.js ایجاد کنید Create robust user interfaces with React.js

• نحوه استفاده از برنامه های کد و آنچه باید بدانید How to use Codespaces and what you should know

• ایجاد رابط های کاربر مدرن با React Building modern user interfaces with React

• آنچه باید بدانید What you should know

• کار با پرونده های تمرینی Working with the exercise files

1. واکنش چیست؟ 1. What Is React?

• React چیست؟ What is React?

• ابزارهای Chrome را برای React تنظیم کنید Set up Chrome tools for React

• سایتهای React را بازرسی کنید Inspect React sites

1. اصول واکنش نشان می دهد 1. React Fundamentals

• تنظیم ابزارهای Chrome برای React Setting up Chrome tools for React

• React چیست؟ What is React?

• کار با کد VS Working with VS Code

• واکنش چگونه کار می کند How React works

• درک کامپایلر React Understanding the React compiler

2. معرفی عناصر واکنش پذیر 2. Introduction to React Elements

• برنامه ایجاد-واکنش-را نصب کنید Install create-react-app

• ایجاد یک پروژه Generate a project

• عناصر React ایجاد کنید Create React elements

• عناصر رفکتور با استفاده از JavaScript به عنوان XML (JSX) Refactor elements using JavaScript as XML (JSX)

2. ایجاد عناصر React 2. Creating React Elements

• ایجاد یک مؤلفه React Creating a React component

• کار با نحو JSX Working with JSX syntax

• افزودن خصوصیات مؤلفه Adding component properties

• اولیه سازی یک پروژه با Vite Initializing a project with Vite

• خواص جزء تخریب Destructuring component properties

• ایجاد عناصر React Creating React elements

3. واکنش اجزاء 3. React Components

• یک جزء React ایجاد کنید Create a React component

• خصوصیات مؤلفه را اضافه کنید Add component properties

• مؤلفه SkiDayCounter را ایجاد کنید Create the SkiDayCounter component

• روشهای سفارشی را اضافه کنید Add custom methods

• اجزای عملکرد ایجاد کنید Create function components

3. نوشتن مؤلفه های React 3. Writing React Components

• با استفاده از قطعات Using Fragments

• نمایش تصاویر با React Displaying images with React

• کار با لیست ها Working with lists

• اضافه کردن کلیدها برای لیست موارد Adding keys to list items

4- Props و State 4. Props and State

• مؤلفه ها را تشکیل دهید Compose components

• نمایش اجزای کودک Display child components

• معرفی دولت Introducing state

• با استفاده از setState Using setState

• تصویب حالت به عنوان غرفه Pass state as props

• ارائه شرط Conditional rendering

4. اداره وضعیت در یک پروژه React 4. Handling State in a React Project

• درک قلاب ماست Understanding the useState hook

• کار با قلاب استفاده Working with the useEffect hook

• اداره دولت با اجزای تو در تو Handling state with nested components

• حالت جابجایی با یک دکمه Toggling state with a button

• مدیریت حالت با کاربر کاربر Managing state with useReducer

• آرایه های ویران کردن Destructuring arrays

5. ویژگی های کتابخانه اضافی 5. Additional Library Features

• چرخه عمر مؤلفه Component life cycle

• واکشی داده ها Fetching data

• دسترسی Accessibility

• تشکیل می دهد Forms

• غرفه های پیش فرض Default props

• PropTypes PropTypes

• کد مدولار Modularizing code

• برنامه را بسازید Build the app

5. مؤلفه های سرور React 5. React Server Components

• راه حل: ایجاد یک مسیر Solution: Creating a route

• چالش: ایجاد یک مسیر Challenge: Creating a route

• با استفاده از روتر برنامه Using the App Router

• ایجاد یک پروژه با Next.js Creating a project with Next.js

• ساختن یک مؤلفه سرور Building a server component

نتیجه Conclusion

• طراحی برنامه های اجرا با اجزای سرور React Designing performant apps with React Server Components

• مراحل بعدی Next steps

6. واکنش ناهمزمان در Next.js 6. Asynchronous React in Next.js

• ایجاد یک مؤلفه مشتری Creating a client component

• انتقال داده ها به عنوان غرفه ها Passing data as props

• ایجاد یک عمل سرور Creating a server action

• واکشی داده ها در برنامه های React Fetching data in React applications

• ساختن یک فرم Building a form