React Native-এ মূল উপাদানগুলি কী কী?

Question

Accepted Answer

React Native **View**, **Text**, **Image**, **ScrollView**, **TextInput** এর মতো **মূল উপাদান** নামক একটি সেট সরবরাহ করে যা নেটিভ UI উপাদানগুলিতে ম্যাপ করে। এগুলি React Native UI-এর মৌলিক বিল্ডিং ব্লক, যা ওয়েব HTML উপাদানগুলির পরিবর্তে ব্যবহৃত হয়। ## মূল উপাদান (ওয়েব HTML এর বিপরীতে) ```text React Native uses its OWN components (mapping to native views), NOT HTML: VIEW → a container (like a

) — the basic layout building block TEXT → display text (ALL text must be inside a , unlike web) IMAGE → display images (local or remote) TEXTINPUT → text input field (like an ) SCROLLVIEW → a scrollable container FLATLIST → an efficient scrollable LIST (for long lists — renders lazily) TOUCHABLEOPACITY / PRESSABLE → handle taps (touchable areas) BUTTON → a basic button ``` ## উদাহরণ ```jsx import { View, Text, Image, TextInput, TouchableOpacity } from 'react-native'; function Profile() { return ( {/* container (like a div) */} Ann {/* text MUST be in */} {}}> Submit ); } ``` ## ওয়েব থেকে মূল পার্থক্য ```text ✓ Use not

, not

/; ALL text must be in ✓ No CSS classes/files — STYLING via a style prop (JS objects, StyleSheet) — see styling ✓ Touchables/Pressable for interactions (not onClick on divs) ✓ FlatList for long lists (efficient) — not mapping over everything ``` ## এটি কেন গুরুত্বপূর্ণ মূল উপাদান বোঝা React Native উন্নয়নের জন্য মৌলিক কারণ **এগুলি প্রতিটি React Native UI-এর বিল্ডিং ব্লক** — আপনি ইন্টারফেস তৈরি করতে সেগুলি সংযুক্ত করেন, তাই এটি অবশ্য-জানা ভিত্তিগত জ্ঞান। React Native তার **নিজস্ব উপাদান** সরবরাহ করে যা নেটিভ ভিউতে ম্যাপ করে (ওয়েব HTML উপাদানের পরিবর্তে), এবং অপরিহার্য উপাদানগুলি বোঝা — **View** (কন্টেইনার, div এর মতো), **Text** (সমস্ত পাঠ্যের জন্য, গুরুত্বপূর্ণ নিয়মটির সাথে যে সমস্ত পাঠ্য একটি Text উপাদানের মধ্যে থাকতে হবে, ওয়েবের বিপরীতে), **Image**, **TextInput**, **ScrollView**, **FlatList** (দক্ষ দীর্ঘ তালিকার জন্য), এবং touchables/**Pressable** (ট্যাপ পরিচালনার জন্য) — যেকোনো React Native UI তৈরি করার জন্য প্রয়োজনীয়। ওয়েব থেকে **মূল পার্থক্য** বোঝা বিশেষভাবে গুরুত্বপূর্ণ যারা ওয়েব/React উন্নয়নকারী থেকে React Native-এ স্থানান্তরিত হচ্ছেন: div এর পরিবর্তে View ব্যবহার এবং p/span এর পরিবর্তে Text (সমস্ত-পাঠ্য-Text-এ নিয়মের সাথে), CSS ক্লাস/ফাইলের পরিবর্তে style prop এর মাধ্যমে স্টাইলিং, onClick এর পরিবর্তে touchables/Pressable ব্যবহার করে ইন্টারঅ্যাকশনের জন্য, এবং **দীর্ঘ তালিকার জন্য FlatList ব্যবহার** (যা দক্ষভাবে/অলসভাবে রেন্ডার করে) সবকিছুতে ম্যাপিংয়ের পরিবর্তে — এই পার্থক্যগুলি সাধারণ বাধা যা মূল উপাদান বোঝা স্পষ্ট করে। উপাদানগুলি UI তৈরি করতে সংযুক্ত হয় (React এর মতো), View-কে মৌলিক কন্টেইনার হিসাবে রেখে। যেহেতু মূল উপাদানগুলি প্রতিটি React Native UI-এর বিল্ডিং ব্লক (আপনি ইন্টারফেস তৈরি করতে ক্রমাগত সেগুলি ব্যবহার করেন) এবং সেগুলি এবং কীভাবে তারা ওয়েব HTML থেকে আলাদা তা বোঝা React Native অ্যাপ্লিকেশন তৈরির জন্য মৌলিক (বিশেষভাবে ওয়েব উন্নয়নকারীদের জন্য), মূল উপাদান বোঝা অপরিহার্য, ভিত্তিগত React Native জ্ঞান — React Native UI-এর মৌলিক শব্দভাণ্ডার, যেকোনো ইন্টারফেস তৈরির জন্য প্রয়োজনীয় এবং ওয়েব React জ্ঞানকে নেটিভ উপাদান মডেলে অভিযোজিত করার জন্য, React Native উন্নয়নের জন্য একটি মূল দক্ষতা।