React Native Beginner Cheat Sheet: Setup, First Screen, Props & State

A beginner React Native cheat sheet is a first app: install Expo, render a View and Text, pass props, and update useState on press. You already need JavaScript and basic React. Unlearn div and CSS files; learn Flexbox column and the simulator.

This React Native cheat sheet is written for people searching for a fast, accurate reference: students, junior developers, and teams shipping production software. Pin it, copy the snippets, and come back when syntax slips.

Quick reference

• Setup: Node LTS, then npx create-expo-app. Run npx expo start and scan the QR code.
• Entry: App.js / App.tsx exports a component. That is your root screen until you add navigation.
• JSX: Looks like HTML, is not HTML. Components start with a capital letter.
• Props: Parent passes data: <Title text="Hi" />.
• State: useState for values that change when the user taps.
• Style: Objects, camelCase, Flexbox column by default.
• Reload: Fast Refresh. Shake the device for the developer menu.
• Next: Add a second screen with a stack navigator only after one screen feels solid.

Copy-paste examples

First stateful screen

Save the file, watch Fast Refresh. If Text is missing, Android will complain immediately.

import { useState } from 'react';
import { Pressable, StyleSheet, Text, View } from 'react-native';

export default function App() {
  const [n, setN] = useState(0);
  return (
    <View style={styles.wrap}>
      <Text style={styles.h1}>Taps: {n}</Text>
      <Pressable onPress={() => setN((x) => x + 1)} style={styles.btn}>
        <Text style={styles.btnText}>Add one</Text>
      </Pressable>
    </View>
  );
}
const styles = StyleSheet.create({
  wrap: { flex: 1, justifyContent: 'center', alignItems: 'center' },
  h1: { fontSize: 24, marginBottom: 16 },
  btn: { backgroundColor: '#2563eb', padding: 12, borderRadius: 8 },
  btnText: { color: 'white', fontWeight: '700' },
});

Common mistakes

• Starting from a bare native project on day one instead of Expo.
• Copy-pasting web CSS or className.
• Skipping JavaScript basics and drowning in Redux on screen one.
• Never testing on an Android device if you only own an iPhone (or the reverse).

FAQ

1. Do I need Android Studio and Xcode? For simulators and store builds, eventually. Expo Go lets you learn on a physical phone first.

1. Is this the same as React for websites? Same ideas (components, props, state). Different building blocks (View vs div).

1. TypeScript on day one? Optional. If the tutorial is .tsx, follow it. Types help once the first screen works.

Related React Native cheat sheets

• React Native Cheat Sheet 2026
• React Native Components Cheat Sheet
• React Native Navigation Cheat Sheet

Build with this stack

When a cheat sheet is not enough — you need a production app, a student FYP, or a custom dashboard — ArpaNeuro builds mobile app development and also sells ready-made source code. Request a quote and tell us the stack.

Browse software development services or the source code marketplace if you want a working codebase instead of starting from a blank file.