React Native përdor modelin e komponenteve të React dhe JSX — ndërtimin e interfaceve përdoruese nga komponentë të ripërdorshmë që kthejnë JSX. Nëse i njihni React për web, kjo transferohet drejtpërdrejt; diferenca kryesore është përdorimi i komponenteve native në vend të elementeve HTML.
() {
(
);
}
() {
(
);
}
Komponentët janë pjesë të ripërdorshmë të interfacit përdoruese (funksione që kthejnë JSX); ata marrin props (hyrje) dhe përbëhen në pemë — saktësisht si React për web, por me komponentë native.
import { useState } from 'react';
function Counter() {
const [count, setCount] = useState(0); // STATE (useState hook)
return (
<TouchableOpacity onPress={() => setCount(count + 1)}>
<Text>Count: {count}</Text> {/* re-renders when state changes */}
</TouchableOpacity>
);
}
Props kalojnë të dhënat në komponentë; state (përmes useState) mban të dhënat që ndryshojnë dhe shkaktojnë ri-shkririm — i njëjti model React si në web.
✓ Components, JSX, props, state, HOOKS (useState, useEffect, etc.), composition, keys —
all the same as React for web
✓ The main difference: native components (View/Text) instead of HTML; styling differs
→ React developers can apply most of their knowledge directly to React Native.
Kuptimi se si funksionojnë komponentët dhe JSX në React Native është themelor sepse React Native është ndërtuar në modelin e komponenteve të React, kështu që e kuptuar atë është thelbësor, dhe një avantazh i madh është se njohuritë e React transferohen drejtpërdrejt.
Komponentët (pjesë të ripërdorshmë të interfacit përdoruese që kthejnë JSX, marrin props si hyrje dhe përbëhen në pemë) dhe JSX (sintaksa që përshkruan interfacin përdoruese me shprehje të brendshme) janë themeli i zhvillimit të React Native — i njëjti si React për web.
Kuptimi i props (kalimi i të dhënave në komponentë) dhe state (përmes hook-ut useState, i cili mban të dhënat që ndryshojnë dhe shkaktojnë ri-shkrim) është thelbësor sepse këto koncepte të React janë se si komponentët e React Native marrin të dhëna dhe menaxhojnë ndryshimin — identike me React web.
Intuita kryesore është se njohuritë e React transferohen: komponentët, JSX, props, state, hooks (useState, useEffect, etj.), përbërja dhe çelësat (keys) funksionojnë në të njëjtën mënyrë si në React për web, me diferencat kryesore që janë përdorimi i komponenteve native (View, Text) në vend të HTML dhe stilimi i ndryshëm.
Ky transferim është një arsye e madhe pse React Native është tërheqës — grumbullimi i madh i zhvilluesve React/web mund të zbatojnë shumicën e njohurive të tyre ekzistuese drejtpërdrejt në ndërtimin e aplikacioneve native për celular, me një kurbë mësimi relativisht të vogël të fokusuar në komponentët native dhe specifikat e platformës.
Meqenëse React Native është në thelb React (komponentë, JSX, props, state, hooks) i aplikuar në interfacin përdoruese native, dhe kuptimi i këtij modeli është thelbësor për ndërtimin e aplikacioneve React Native ndërsa njohim se njohuritë e React transferohen drejtpërdrejt (një avantazh kyç), kuptimi i komponentëve dhe JSX në React Native është njohuri thelbësore, themelore — modeli i programimit bërthamë i React Native, i nevojshëm për ndërtimin e aplikacioneve, dhe veçanërisht i vlefshëm në vënien në pah se si drejtpërdrejt zbatohen aftësitë e React/web në zhvillimin mobile të React Native.