React Native koristi React-ov komponentni model i JSX — izgradnja korisničkog sučelja iz ponovno iskoristivih komponenti koje vraćaju JSX. Ako poznajete React za web, to se direktno prenosi; glavna razlika je korištenje nativnih komponenti umjesto HTML elemenata.
() {
(
);
}
() {
(
);
}
Komponente su ponovno iskoristivi dijelovi sučelja (funkcije koje vraćaju JSX); primaju props (ulaze) i sastavljaju se u stabla — upravo kao React za web, ali s nativnim komponentama.
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 proslijeđuju podatke u komponente; state (preko useState) čuva mijenjajuće podatke koji pokidavaju ponovno renderiranje — isti React model kao na webu.
✓ 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.
Razumijevanje kako komponente i JSX funkcioniraju u React Nativeu je fundamentalno jer je React Native izgrađen na React-ovom komponentnom modelu, pa je razumijevanje toga bitno, a velika prednost je što se React znanje direktno prenosi.
Komponente (ponovno iskoristivi dijelovi sučelja koji vraćaju JSX, primaju props kao ulaze i sastavljaju se u stabla) i JSX (sintaksa koja opisuje sučelje s umetnutim izrazima) su temelj razvoja React Nativea — kao i React za web.
Razumijevanje props (proslijeđivanja podataka u komponente) i state (preko useState hook-a, čuvanja mijenjajućih podataka koji pokidavaju ponovno renderiranje) je bitno jer su to React koncepti kako React Native komponente primaju podatke i upravljaju promjenama — identično web Reactu.
Ključni uvid je što se React znanje prenosi: komponente, JSX, props, state, hook-ovi (useState, useEffect, itd.), skladanje (composition) i keys svi funkcioniraju na isti način kao u React-u za web, s glavnom razlikom korištenja nativnih komponenti (View, Text) umjesto HTML-a i različitih stiliziranja.
Ova prenosivost je glavni razlog zašto je React Native privlačan — veliki broj React/web razvojnih inženjera može primijeniti većinu svog postojećeg znanja direktno na izgradnju nativnih mobilnih aplikacija, s relativno malom krivuljom učenja usredotočenom na nativne komponente i specifikacije platforme.
Pošto je React Native temeljno React (komponente, JSX, props, state, hook-ovi) primjenjen na nativno sučelje, i razumijevanje ovog modela je bitno za izgradnju React Native aplikacija dok se priznaje da se React znanje direktno prenosi (ključna prednost), razumijevanje komponenti i JSX-a u React Nativeu je bitno, fundamentalno znanje — jezgreni model programiranja React Nativea, nužno za izgradnju aplikacija, i posebno vrijedno u istaknuću kako se direktno React/web vještine primjenjuju na React Native razvoj mobilnih aplikacija.