Redux இன் மূலக் கருத்துக்கள் என்ன?

Question

Accepted Answer

**Redux** என்பது மூன்று மূலக் கொள்கைகளின் மீது கட்டப்பட்ட ஒரு கணிக்கக் கூடிய நிலை கொள்ளளி ஆகும்: **ஒரு கடை**, **படிக்கக் கூடிய நிலை** **செயல்கள்** மூலம் மட்டுமே மாற்றப்படுகிறது, மற்றும் **சுத்தமான குறைப்புகள்** அடுத்த நிலையைக் கணக்கிடுகிறது. தரவு ஒரு திசையில் பாய்கிறது, இதால் மாற்றங்கள் ট்র్যాக் செய்யக்கூடியவை. ## மூன்று கொள்கைகள் ```text 1. Single source of truth — the whole app's state lives in ONE store object 2. State is read-only — you never mutate it; you DISPATCH actions to change it 3. Changes via pure reducers — (state, action) => newState, no side effects ``` ## பாகங்கள் மற்றும் ஓட்டம் ```js // STORE — holds the single state tree const store = configureStore({ reducer: rootReducer }); // ACTION — a plain object describing what happened const action = { type: "counter/incremented", payload: 1 }; // REDUCER — pure function: given state + action, returns NEW state function counterReducer(state = { value: 0 }, action) { switch (action.type) { case "counter/incremented": return { ...state, value: state.value + action.payload }; // new object default: return state; } } // DISPATCH — the only way to trigger a change store.dispatch(action); // SELECT — read state store.getState().counter.value; ``` ## சுழற்சி ```text UI dispatches an ACTION → REDUCER computes new STATE → STORE updates → subscribed components re-render → user interacts → dispatches the next action ``` இந்த கடுமையான ஒரு வழி ஓட்டம் என்பது ஒவ்வொரு நிலை மாற்றமும் ஒரு அனுப்பப்பட்ட செயல்பாட்டின் விளைவாகும் என்பது சுத்தமான செயல்பாட்டால் செயல்படுத்தப்படுகிறது — முழுவதுமாக ட්র்যாக் செய்யக்கூடியது. ## React இல் பயன்படுத்துதல் ```jsx import { useSelector, useDispatch } from "react-redux"; function Counter() { const count = useSelector(state => state.counter.value); // read const dispatch = useDispatch(); return ; // write } ``` ## ஏன் கட்டுப்பாடுகள்? ```text Predictability — every change is an explicit, logged action Debuggability — time-travel debugging, action replay (Redux DevTools) Testability — pure reducers are trivial to unit test ``` (குறிப்பு: நவீன Redux **Redux Toolkit** ஐ பயன்படுத்துகிறது, இது இந்த கருத்துக்களைத் தக்கவைத்துக்கொண்டு எப்பொறுந்தையை வியத்தகமாக குறைக்கிறது.) ## இது ஏன் முக்கியமானது Redux இன் மூலக் கருத்துக்கள் — ஒரு கடை, செயல்கள், சுத்தமான குறைப்புகள், ஒரு வழி ஓட்டம் — பயன்பாட்டு நிலையை **கணிக்கக்கூடிய மற்றும் ட்র்যாக் செய்யக்கூடிய** வாக்கினை செய்கிறது, இது பெரிய பயன்பாடுகளுக்கான அதன் முக்கிய மூல்य ஆகும்। store/action/reducer/dispatch/select ஐ புரிந்துகொள்வது Redux ஐ பயன்படுத்தும் பல கோடுபேஸுக்குத் தேவையாக உள்ளது, மற்றும் கொள்கைகள் (மாறாத புதுப்பிப்புகள், சுத்தமான குறைப்புகள், ஒரு திசை ஓட்டம்) கிட்டத்தட்ட ஒவ்வொரு நிலை நூலகத்திலும் மீண்டும் நிகழ்கிறது। ட्రேड-ஆஃப் என்பது எப்பொறுந்தை ஆகும், இதை Redux Toolkit இந்த அடிப்படைகளைத் தக்கவைத்துக்கொண்டு தீர்ப்பதாக உள்ளது.