قبل از شروع یادگیری React.js

قبل از شروع یادگیری React.js، بهتر است که چندین مفهوم و تکنولوژی را به خوبی درک کرده باشید تا بتوانید راحت‌تر و کارآمدتر با React کار کنید. در اینجا مهم‌ترین مواردی که باید قبل از شروع یاد بگیرید آورده شده است:

1. HTML و CSS (مبانی توسعه وب)

HTML: ساختار اصلی صفحات وب را تشکیل می‌دهد، بنابراین باید با تگ‌های HTML، فرم‌ها، لیست‌ها، جدول‌ها و ویژگی‌های دسترس‌پذیری (ARIA) آشنا باشید.

CSS: برای استایل‌دهی به صفحات باید با فریمورک‌های CSS (مانند Bootstrap یا Tailwind CSS)، CSS Grid، Flexbox، و متحرک‌سازی (Animations & Transitions) آشنا باشید.

2. JavaScript (پایه و پیشرفته)

موارد کلیدی در جاوااسکریپت که باید یاد بگیرید:

مبانی جاوااسکریپت: متغیرها (let, const, var)، انواع داده‌ای (string, number, object, array)

توابع و Scope: توابع عادی و Arrow Functions

Callback ها، Promises و Async/Await (مدیریت درخواست‌های غیرهمزمان)

Destructuring و Spread Operator (...)

Map, Filter, Reduce (کار با آرایه‌ها)

Template Literals ( )

Optional Chaining (?.) و Nullish Coalescing (??)

Modules & Import/Export در ES6

Closures و Hoisting

Event Loop و Execution Context

3. DOM و Virtual DOM

نحوه‌ی کار با DOM: document.querySelector(), addEventListener(), createElement()

Manipulation DOM: کار با innerHTML و appendChild

تفاوت بین classList و className

Virtual DOM در React و تفاوت آن با DOM واقعی

4. مدیریت رویدادها (Event Handling)

Event Listeners در جاوااسکریپت

Propagation (Bubbling & Capturing)

Preventing Default Behavior (event.preventDefault())

Stop Propagation (event.stopPropagation())

Synthetic Events در React

5. کار با API ها (RESTful APIs & Fetching Data)

HTTP Methods (GET, POST, PUT, DELETE)

ارسال درخواست با fetch و axios

Promise ها و مدیریت خطا (try/catch)

استفاده از async/await برای درخواست‌های همگام‌سازی‌شده

6. مبانی TypeScript (در صورت کار با TypeScript)

اگر قصد دارید React را با TypeScript یاد بگیرید، نیاز به درک اولیه از موارد زیر دارید:

Types (string, number, boolean, array, object)

Interfaces & Types

Generics

Union & Intersection Types

Utility Types (Partial, Readonly, Pick, Omit)

7. مبانی Node.js و npm

نصب و استفاده از npm یا yarn

درک package.json و node_modules

نصب و اجرای اسکریپت‌های npm مانند npm start, npm run build

8. کار با Git و Version Control

• ایجاد Repository در GitHub/GitLab
• فرمان‌های مهم Git:
  • git init
  • git clone
  • git add .
  • git commit -m "message"
  • git push
  • git pull
  • git branch و git checkout

9. مبانی مفهومی React

قبل از ورود به React، بهتر است مفاهیمی را درک کنید که در React پرکاربرد هستند:

کامپوننت‌ها (Components) و مفهوم Reusability

State و تغییر وضعیت

Props و ارسال داده بین کامپوننت‌ها

مفهوم Declarative Programming در مقابل Imperative Programming

مفهوم One-Way Data Binding

10. ساختار و معماری پروژه‌های فرانت‌اند

نحوه‌ی سازمان‌دهی فایل‌ها در پروژه

درک معماری کامپوننت‌ها

درک Patternهای مدیریت State مانند Context API، Redux، Zustand

آشنایی با Code Splitting و Lazy Loading

جمع‌بندی

اگر این موارد را قبل از یادگیری React.js به خوبی یاد بگیرید، فرآیند یادگیری React بسیار راحت‌تر و سریع‌تر خواهد بود. توصیه می‌شود ابتدا پروژه‌های کوچک با Vanilla JavaScript بسازید و سپس وارد دنیای React.js شوید.