TL;DR

React Native lets you build native mobile apps using JavaScript or TypeScript and the React component model. It ships with Core Components, a modern JavaScript engine (Hermes by default), and a new architecture that improves performance and native interoperability.

What is React Native?

React Native is a framework for building native iOS and Android apps with React. You write UI as React components, and React Native renders those components using native platform views rather than web views. The result is a single codebase with a native look and feel.

How React Native works (the modern picture)

  • JavaScript runs on a JS engine: React Native ships with Hermes enabled by default, which improves startup time, memory usage, and app size for many apps.
  • Native UI rendering: React Native renders to native views. Core Components like View, Text, and Image map to platform views.
  • New Architecture (now default): The New Architecture is enabled by default in recent React Native releases and introduces new native module and component systems for more direct JS-to-native interop without the old bridge.

Core Components you should know

These are the most commonly used building blocks from React Native’s Core Components list:

  • View, Text, Image
  • TextInput, Pressable, Button
  • ScrollView, FlatList, SectionList
  • StyleSheet, Animated, Modal

See the full list in the official docs.

Getting started (two modern paths)

Option A: Expo (fastest start)

Expo is a React Native framework and the quickest way to get a project running. With a framework, you can start without setting up Xcode or Android Studio, and add native code later using development builds or prebuild.

npx create-expo-app my-app
cd my-app
npm run start

Option B: React Native CLI (full native control)

Use the CLI if you need direct native code, custom native modules, or want to integrate into an existing native app. You will need to install native build tools for iOS and Android (Xcode and Android Studio).

npx react-native@latest init MyApp
cd MyApp
npm run start

Example: a simple component

import React from "react";
import { SafeAreaView, Text, StyleSheet } from "react-native";

export default function App() {
  return (
    <SafeAreaView style={styles.container}>
      <Text style={styles.title}>Hello React Native</Text>
    </SafeAreaView>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: "center",
    justifyContent: "center"
  },
  title: {
    fontSize: 22,
    fontWeight: "600"
  }
});

When React Native is a good fit

  • You want a single codebase for iOS and Android.
  • Your app is UI-heavy and benefits from fast iteration.
  • You need native performance but don’t want two separate teams.

References