O que é React Native e como funciona?

Question

Accepted Answer

**React Native** é um framework da Meta (Facebook) para construir **aplicativos móveis nativos** (iOS e Android) usando **React e JavaScript**. Sua abordagem distintiva é renderizar **componentes reais de UI nativa** (não uma webview), permitindo que desenvolvedores web/React construam aplicativos nativos a partir de código amplamente compartilhado. ## O que é React Native ```text React Native = build NATIVE mobile apps with React + JavaScript/TypeScript: → ONE codebase (mostly) for iOS AND Android → uses REACT (components, JSX, hooks, state) — familiar to web React developers → renders REAL NATIVE UI components (not a webview / not HTML) → native look & feel → by Meta; widely used (Instagram, Discord, Shopify, etc.) ``` ## Como funciona: JavaScript dirigindo UI nativa ```text → You write React components in JavaScript → React Native maps them to REAL NATIVE views (a → a native UIView/ViewGroup; → native text) — NOT web/HTML elements → JS runs and communicates with the native side (historically via a "bridge"; the new architecture uses JSI for direct, faster communication) → The result is a genuinely native app, written in React/JS ``` ## Características principais ```text ✓ NATIVE components → native performance and look/feel (vs webview-based frameworks) ✓ REACT model → components, JSX, hooks, state, props (web React skills transfer) ✓ Cross-platform → share most code across iOS/Android (some platform-specific code) ✓ FAST REFRESH → see changes instantly (like hot reload); large npm ecosystem ✓ Access native features via native modules / Expo ``` ## Por que isso importa Entender o que é React Native e como funciona é fundamental para desenvolvimento com React Native e valioso para entender o cenário multiplataforma. React Native é um framework importante para construir **aplicativos móveis nativos com React e JavaScript** a partir de uma base de código amplamente compartilhada — resolvendo a necessidade significativa de evitar construir aplicativos iOS e Android separados, enquanto permite que o grande pool de **desenvolvedores web/React** apliquem suas habilidades existentes (componentes, JSX, hooks, state) para mobile, uma vantagem chave. A característica definidora — que React Native renderiza **componentes reais de UI nativa** (mapeando componentes React para visualizações nativas reais, não uma webview ou HTML) — é importante entender porque dá aos apps **performance e aparência/comportamento nativos**, distinguindo React Native de abordagens baseadas em webview e tornando-o uma solução de aplicativo nativo genuína. Entender **como funciona** (JavaScript executando e dirigindo UI nativa, comunicando-se com o lado nativo via bridge historicamente ou o JSI mais rápido na nova arquitetura) esclarece sua natureza híbrida. Entender **características principais** — componentes nativos (aparência/performance nativa), o modelo React familiar (habilidades web transferíveis), compartilhamento de código multiplataforma, Fast Refresh (atualizações instantâneas), o grande ecossistema npm e acesso a recursos nativos — transmite por que React Native é amplamente adotado (usado por Instagram, Discord, Shopify e muitos outros). Como React Native é um framework multiplataforma importante (especialmente atraente para desenvolvedores React/web) e entender sua natureza (React + JS, componentes nativos, multiplataforma) e como funciona (dirigindo UI nativa real) é fundamental para trabalho com React Native e para entender opções multiplataforma, entender o que é React Native e como funciona é conhecimento essencial e fundamental — o ponto de partida para desenvolvimento com React Native e contexto importante para entender como se encaixa entre tecnologias multiplataforma, uma abordagem amplamente utilizada especialmente valiosa para aproveitar habilidades em React para construir aplicativos móveis nativos.