React Native ofron një seri komponentësh bazë — si View, Text, Image, ScrollView, TextInput — që pasqyrojnë elementet native të UI-t. Ato janë blloqet themelore të ndërtimit të UI-ve në React Native, të përdorur në vend të elementeve HTML të uebit.
React Native uses its OWN components (mapping to native views), NOT HTML:
VIEW → a container (like a <div>) — the basic layout building block
TEXT → display text (ALL text must be inside a <Text>, unlike web)
IMAGE → display images (local or remote)
TEXTINPUT → text input field (like an <input>)
SCROLLVIEW → a scrollable container
FLATLIST → an efficient scrollable LIST (for long lists — renders lazily)
TOUCHABLEOPACITY / PRESSABLE → handle taps (touchable areas)
BUTTON → a basic button
import { View, Text, Image, TextInput, TouchableOpacity } from 'react-native';
function Profile() {
return (
<View style={styles.container}> {/* container (like a div) */}
<Image source={{ uri: 'https://...' }} style={styles.avatar} />
<Text style={styles.name}>Ann</Text> {/* text MUST be in <Text> */}
<TextInput placeholder="Email" />
<TouchableOpacity onPress={() => {}}>
<Text>Submit</Text>
</TouchableOpacity>
</View>
);
}
✓ Use <View> not <div>, <Text> not <p>/<span>; ALL text must be in <Text>
✓ 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
Për të kuptuar komponentët bazë është themelor për zhvillimin e React Native sepse ato janë blloqet ndërtues të çdo UI në React Native — i kombinoni ato për të ndërtuar ndërfaqet, kështu që është njohuri themelore që duhet të dini.
React Native ofron komponentët e tij që pasqyrojnë pamjet native (në vend të elementeve HTML të uebit), dhe të kuptoni ato thelbësore — View (kontejneri, si një div), Text (për të gjithë tekstin, me rregullin e rëndësishëm që i gjithë teksti duhet të jetë brenda një komponenti Text, ndryshe nga uebina), Image, TextInput, ScrollView, FlatList (për lista të gjata efikase), dhe touchables/Pressable (për trajtimin e prekshnive) — është e nevojshme për të ndërtuar çdo UI në React Native.
Për të kuptuar dallimet kryesore nga uebina është veçanërisht e rëndësishme për zhvilluesit e uebit/React që kalojnë në React Native: të përdorin View në vend të div dhe Text në vend të p/span (me rregullin që i gjithë teksti duhet të jetë në Text), stilizimi përmes prop-it të stilit në vend të klasave/skedareve CSS, përdorimi i touchables/Pressable për ndërveprime në vend të onClick, dhe përdorimi i FlatList për lista të gjata (e cila zbatuese/dembel) në vend të hartëzimit të gjithçkaje — këto dallime janë pengesa të zakonshme që të kuptoni komponentët bazë të klarifikojnë.
Komponentët kombinohen (si React) për të ndërtuar UI-t, me View si kontejner themelor.
Meqenëse komponentët bazë janë blloqet ndërtues të çdo UI në React Native (i përdorni ato në mënyrë konstante për të ndërtuar ndërfaqet) dhe të kuptoni ato dhe si ndryshojnë nga HTML i uebit është themelor për ndërtimin e aplikacioneve React Native (veçanërisht për zhvilluesit e uebit), të kuptimi i komponentëve bazë është njohuri thelbësore dhe themelore e React Native — fjala themelore e UI në React Native, e nevojshme për ndërtimin e çdo ndërfaqe dhe për përshtatjen e njohurive të React të uebit në modelin native të komponentëve, një kompetencë bazë për zhvillimin e React Native.