#دوره_جدید #react_framework

دوره جدید Nextjs برای دوستانی که react رو یادگرفته‌اند عمیقا پیشنهاد میشه
خیلی ساده میتونید ssr رو با next پیاده کنید و سئو وبسایتتون رو واقعا بهتر کنید.

https://roocket.ir/series/learn-nextjs

ری‌اکت در مقابل جاوا اسکریپت خام! کدام بهتر است؟

چرا باید یک فریمورک اضافی یاد بگیرم در حالی که می‌توانم همه کارها را با جاوا اسکریپت وانیلا (همان جاوا اسکریپت خام) انجام دهم؟ چرا اینقدر بر یادگیری فریمورک‌هایی مانند React، Angular و Vue یا هر چیز دیگری تاکید زیادی می‌شود؟
در این مقاله قصد داریم یک مقایسه درست از این دو را بررسی کنیم.

https://roocket.ir/articles/react-vs-simple-javascript
@roocketir

#react #js

#نکته_آموزشی:‌ Redux چیست؟⁧

ریداکس (redux) یک کتابخانه برای مدیریت استیت در برنامه‌های جاوااسکریپت است که به خصوص در برنامه‌های React محبوب است. با Redux می‌توانید استیت برنامه خود را به صورت مرکزی مدیریت کنید.

مثال:

import { createStore } from 'redux';

const initialState = { count: 0 };

function counterReducer(state = initialState, action) {
  switch (action.type) {
    case 'INCREMENT':
      return { count: state.count + 1 };
    case 'DECREMENT':
      return { count: state.count - 1 };
    default:
      return state;
  }
}

const store = createStore(counterReducer);

store.subscribe(() => console.log(store.getState()));

store.dispatch({ type: 'INCREMENT' });
store.dispatch({ type: 'DECREMENT' });

#React #Redux #برنامه‌نویسی

#نکته_آموزشی: بهینه‌سازی عملکرد React با استفاده از React.memo

⚛️ بهینه‌سازی عملکرد React با React.memo
‏React.memo یک تکنیک پیشرفته برای بهینه‌سازی عملکرد کامپوننت‌های تابعی است. با استفاده از React.memo، شما می‌توانید از رندر مجدد کامپوننت‌ها در مواقع غیرضروری جلوگیری کنید.

مثال:

const MyComponent = React.memo(({ value }) => {
  console.log('Rendering MyComponent');
  return <div>{value}</div>;
});

// فقط در صورتی که props تغییر کند، MyComponent دوباره رندر خواهد شد.

این تکنیک به خصوص در برنامه‌های بزرگ و پیچیده بسیار مفید است.
‏#React #Performance #Optimization

اگر تا حالا از این ویژگی استفاده کردید 👍 بدید