Hooks (useState, useEffect, useContext, ਅਤੇ ਹੋਰ) React ਦੀਆਂ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਹਨ ਜੋ ਫੰਕਸ਼ਨਲ ਕੰਪੋਨੈਂਟਸ ਵਿੱਚ state ਅਤੇ side effects ਨੂੰ manage ਕਰਦੀਆਂ ਹਨ — ਅਤੇ ਉਹ React Native ਵਿੱਚ ਬਿਲਕੁਲ ਉਸੇ ਤਰ੍ਹਾਂ ਕੰਮ ਕਰਦੀਆਂ ਹਨ। ਮੁੱਖ hooks ਨੂੰ ਸਮਝਣਾ React Native ਕੰਪੋਨੈਂਟਸ ਬਣਾਉਣ ਲਈ ਜ਼ਰੂਰੀ ਹੈ।
const [count, setCount] = useState(0); // state + setter; setting it re-renders
const [user, setUser] = ();
// useEffect runs side effects (data fetching, subscriptions) after render
useEffect(() => {
fetchData(); // runs after render
// optional CLEANUP (returned function) — runs on unmount / before re-running
const sub = subscribe();
return () => sub.unsubscribe(); // CLEAN UP (prevent leaks)
}, [dependency]); // dependency array → when to re-run
// → [] = run once on mount; [dep] = run when dep changes; none = every render
useEffect side effects ਨੂੰ handle ਕਰਦਾ ਹੈ (data fetching, subscriptions, timers) ਇੱਕ dependency array ਦੇ ਨਾਲ ਜੋ ਇਹ control ਕਰਦਾ ਹੈ ਕਿ ਇਹ ਕਦੋਂ ਚਲਦਾ ਹੈ، ਅਤੇ ਇੱਕ optional cleanup function (memory leaks ਨੂੰ ਰੋਕਣ ਲਈ ਮਹੱਤਵਪੂਰਨ)।
useContext → consume context (shared data without prop drilling)
useRef → a mutable reference that persists across renders (e.g. reference a component,
store a value without re-rendering)
useMemo → memoize an expensive computed value (performance)
useCallback → memoize a function (avoid unnecessary re-creation/re-renders)
useReducer → manage complex state with a reducer
CUSTOM HOOKS → extract reusable stateful logic (e.g. useFetch, useAuth)
⚠️ Only call hooks at the TOP LEVEL of a component (not in conditions/loops/nested functions)
⚠️ Only call hooks from React components or custom hooks
→ These rules ensure hooks work correctly (React relies on call order).
React hooks ਨੂੰ ਸਮਝਣਾ React Native ਲਈ ਜ਼ਰੂਰੀ ਹੈ ਕਿਉਂਕਿ hooks ਫੰਕਸ਼ਨਲ ਕੰਪੋਨੈਂਟਸ ਵਿੱਚ state ਅਤੇ side effects ਨੂੰ manage ਕਰਨ ਦਾ standard ਤਰੀਕਾ ਹਨ, ਜੋ ਕਿ modern React Native ਐਪਸ ਕਿਵੇਂ ਬਣੀਆਂ ਜਾਂਦੀਆਂ ਹਨ، ਇਸ ਲਈ ਇਹ ਲਾਜ਼ਮੀ ਹੈ।
Hooks React Native ਵਿੱਚ web ਲਈ React ਵਾਂਗ ਹੀ ਕੰਮ ਕਰਦੇ ਹਨ، ਇਹ ਗਿਆਨ ਸਿੱਧੇ ਤਬਦੀਲ ਕਨਯੋਗ ਬਣਾਉਂਦਾ ਹੈ। useState (state ਨੂੰ manage ਕਰਨਾ، re-renders trigger ਕਰਨਾ) ਕਿਸੇ ਵੀ ਕੰਪੋਨੈਂਟ ਦੇ ਲਈ ਬੁਨਿਆਦੀ ਹੈ ਜਿਸ ਕੋਲ changing data ਹੈ। useEffect ਖਾਸ ਤੌਰ 'ਤੇ ਮਹੱਤਵਪੂਰਨ ਹੈ: ਇਹ side effects ਨੂੰ handle ਕਰਦਾ ਹੈ (data fetching, subscriptions, timers) ਇੱਕ dependency array ਦੇ ਨਾਲ ਜੋ ਇਹ control ਕਰਦਾ ਹੈ ਕਦੋਂ ਇਹ ਚਲਦਾ ਹੈ ਅਤੇ ਇੱਕ optional cleanup function (leaks ਨੂੰ ਰੋਕਣ ਲਈ unsubscribing/cleaning up ਕਰ ਕੇ crucial) — useEffect، its dependency array، ਅਤੇ cleanup ਨੂੰ ਸਮਝਣਾ ਜ਼ਰੂਰੀ ਹੈ ਕਿਉਂਕਿ side effects (ਜਿਵੇਂ screen load ਹੋਣ 'ਤੇ data fetching) ਆਮ ਹਨ ਅਤੇ useEffect ਨੂੰ ਗਲਤ ਕਰਨਾ bugs ਦਾ ਕਾਰਨ ਬਣਦਾ ਹੈ (wrong dependencies ਤੋਂ infinite loops, missing cleanup ਤੋਂ leaks)।
Other key hooks ਨੂੰ ਸਮਝਣਾ — useContext (shared data ਨੂੰ consume ਕਰਨਾ prop drilling ਤੋਂ ਬਿਨਾ), useRef (persistent mutable references), useMemo/useCallback (performance ਲਈ memoization), useReducer (complex state), ਅਤੇ custom hooks (reusable stateful logic ਨੂੰ extract ਕਰਨਾ ਜਿਵੇਂ useFetch ਜਾਂ useAuth — code reuse ਲਈ powerful pattern) — real components ਬਣਾਉਣ ਲਈ toolkit ਨੂੰ cover ਕਰਦਾ ਹੈ।
Rules of hooks ਨੂੰ ਸਮਝਣਾ (ਉਨ੍ਹਾਂ ਨੂੰ ਸਿਰਫ top level 'ਤੇ ਅਤੇ ਸਿਰਫ components/custom hooks ਤੋਂ ਹੀ call ਕਰਨਾ, ਕਿਉਂਕਿ React call order 'ਤੇ ਨਿਰਭਰ ਕਰਦਾ ਹੈ) subtle bugs ਨੂੰ ਰੋਕਣ ਲਈ ਜ਼ਰੂਰੀ ਹੈ।
Kyunki hooks functional React Native components ਵਿੱਚ state ਅਤੇ side effects ਲਈ standard mechanism ਹਨ (ਅਤੇ ਗਿਆਨ React ਤੋਂ ਸਿੱਧਾ transfer ਕਨਯੋਗ ਹੈ), ਅਤੇ ਕਿਉਂਕਿ key hooks ਨੂੰ ਸਮਝਣਾ (ਖਾਸ ਤੌਰ 'ਤੇ useState ਅਤੇ useEffect ਇਸ ਦੇ cleanup ਦੇ ਨਾਲ) ਅਤੇ rules ਨੂੰ ਸਮਝਣਾ correct components ਬਣਾਉਣ ਲਈ ਜ਼ਰੂਰੀ ਹੈ, React hooks ਨੂੰ ਸਮਝਣਾ ਜ਼ਰੂਰੀ, frequently-applied React Native ਗਿਆਨ ਹੈ — modern React Native components ਬਣਾਉਣ ਲਈ fundamental, state ਅਤੇ side effects ਨੂੰ manage ਕਰਨ ਲਈ central, ਅਤੇ web React ਤੋਂ ਸਿੱਧੀ ਤਬਦੀਲ ਕਨਯੋਗ, React Native development ਲਈ core skill ਹੈ।