React Native অ্যাপ্লিকেশনগুলি প্রায়শই API কল করে — বিল্ট-ইন fetch (বা axios), async/await, এবং প্রতিক্রিয়া, ত্রুটি এবং লোডিং অবস্থা পরিচালনা করে। নেটওয়ার্কিং ওয়েব জাভাস্ক্রিপ্টের মতোই কাজ করে, প্রায়শই ক্যাশিং-এর জন্য React Query-এর সাথে সংযুক্ত থাকে।
fetch দিয়ে অনুরোধ করা
// fetch is built-in (like the web); use async/await
async function getUsers() {
try {
const response = await fetch('https://api.example.com/users');
if (!response.ok) throw new Error('Request failed'); // check status
const data = await response.json(); // parse JSON
return data;
} catch (error) {
console.error(error); // handle errors
throw error;
}
}
fetch (বিল্ট-ইন) HTTP অনুরোধ করে; await response.json() JSON পার্স করে; response.ok চেক করা এবং try/catch ত্রুটি পরিচালনা করে। axios একটি জনপ্রিয় বিকল্প (ইন্টারসেপ্টর, আরও সুন্দর API)।
লোডিং/ত্রুটি/ডেটা অবস্থা পরিচালনা করা
function Users() {
const [data, setData] = useState(null);
const [loading, setLoading] = useState(true);
const [error, setError] = useState(null);
useEffect(() => {
getUsers().then(setData).catch(setError).finally(() => setLoading(false));
}, []);
if (loading) return <ActivityIndicator />; // loading spinner
if (error) return <Text>Error</Text>; // error UI
return <FlatList data={data} ... />; // show data
}
ভাল UX-এর জন্য অ্যাপ্লিকেশনগুলি অবশ্যই লোডিং, ত্রুটি এবং ডেটা অবস্থা পরিচালনা করতে হবে (লোডিং করার সময় স্পিনার, ব্যর্থতায় ত্রুটি বার্তা, সাফল্যে ডেটা)।
React Query (সার্ভার ডেটার জন্য সুপারিশকৃত)
→ React Query / TanStack Query handles fetching + CACHING + loading/error states +
refetching + sync automatically → much less boilerplate than manual useState/useEffect
→ Recommended for managing server data (vs hand-rolling every fetch)
কেন এটি গুরুত্বপূর্ণ
React Native-এ নেটওয়ার্কিং এবং API বোঝা অপরিহার্য কারণ বেশিরভাগ অ্যাপ্লিকেশন ব্যাকএন্ডের সাথে যোগাযোগ করে — ডেটা ফেচ করা এবং পাঠানো প্রায় সর্বজনীন প্রয়োজন, তাই এটি অপরিহার্য ব্যবহারিক জ্ঞান।
অ্যাপ্লিকেশনগুলি ক্রমাগত API কল করে (ডেটা লোড করা, ফর্ম জমা দেওয়া, প্রমাণীকরণ), এবং React Native নেটওয়ার্কিং ওয়েব জাভাস্ক্রিপ্টের মতোই কাজ করে (ওয়েব ডেভেলপারদের জন্য একটি সুবিধা)।
অনুরোধ করা (বিল্ট-ইন fetch বা axios, async/await সহ, JSON পার্স করা এবং স্ট্যাটাস কোড চেক করা) এবং ত্রুটি পরিচালনা (try/catch, response.ok চেক করা) বোঝা মূল দক্ষতা, কারণ নেটওয়ার্ক কল মৌলিক এবং প্রায়শই ব্যর্থ হয়।
uck্তিক্রমে, লোডিং, ত্রুটি এবং ডেটা অবস্থা পরিচালনা করতে পারা ভাল UX-এর জন্য অপরিহার্য: ফেচ করার সময় লোডিং স্পিনার (ActivityIndicator) প্রদর্শন করা, ব্যর্থতায় ত্রুটি বার্তা এবং সাফল্যে ডেটা — এই অবস্থাগুলি সঠিকভাবে পরিচালনা করা অ্যাপ্লিকেশনগুলিকে পলিশড বোধ করায় বরং ভাঙা নয় (লোডিং করার সময় খালি স্ক্রিন, বা ত্রুটিতে ক্রাশ, খারাপ UX)।
React Query/TanStack Query বোঝা ক্রমবর্ধমান মূল্যবান: এটি ফেচিং, ক্যাশিং, লোডিং/ত্রুটি অবস্থা, রিফেচিং এবং সিঙ্ক্রোনাইজেশন স্বয়ংক্রিয়ভাবে পরিচালনা করে, useState/useEffect সহ প্রতিটি ফেচ ম্যানুয়ালি পরিচালনা করার বয়লারপ্লেট নাটকীয়ভাবে হ্রাস করে — এবং আধুনিক React Native-এ সার্ভার ডেটার জন্য সুপারিশকৃত পদ্ধতি, সার্ভার ডেটার জন্য ডেডিকেটেড হ্যান্ডলিং (ক্যাশিং, সিঙ্ক) এর স্বীকৃতি প্রতিফলিত করে।
বেশিরভাগ React Native অ্যাপ্লিকেশন API-গুলির সাথে যোগাযোগ করে (প্রায় সর্বজনীন প্রয়োজন) এবং এটি ভালভাবে করা (fetch/axios, ত্রুটি পরিচালনা, এবং বিশেষত লোডিং/ত্রুটি/ডেটা অবস্থা পরিচালনা ভাল UX-এর জন্য, আদর্শভাবে ক্যাশিং-এর জন্য React Query সহ) কার্যকরী, পলিশড অ্যাপ্লিকেশনের জন্য অপরিহার্য, React Native-এ নেটওয়ার্কিং এবং API বোঝা অপরিহার্য, ঘন ঘন প্রয়োগ করা ব্যবহারিক জ্ঞান — ডেটা ফেচ করে এমন প্রায় প্রতিটি প্রকৃত অ্যাপে প্রয়োজনীয় একটি মৌলিক দক্ষতা, ব্যাকএন্ড ডেটা নির্ভরযোগ্যভাবে এবং মসৃণভাবে প্রদর্শন করে এমন অ্যাপ্লিকেশন তৈরি করার জন্য কেন্দ্রীয়, React Query সার্ভার ডেটা পরিচালনার জন্য সুপারিশকৃত আধুনিক পদ্ধতি হওয়ায়।