ScrollView

You have to wrap every screen in a ScrollView to make it scrollable.

import {ScrollView, Text} from 'react-native';

export default function App() {
  return (
    <ScrollView>
      <Text>Content goes here</Text>
    </ScrollView>
  );
}

KeyboardAvoidingView

To fill up the screen empty spaces properly and avoid sensors per device (e.g. iPhone dynamic island), wrap each view with <KeyboardAvoidingView>:

import {ScrollView, Text} from 'react-native';

export default function App() {
  return (
    <ScrollView>
      <KeyboardAvoidingView>
      <Text>Content goes here</Text>
      </KeyboardAvoidingView>
    </ScrollView>
  );
}

Basic Building Blocks

Do not use standard HTML tags like <div>, <span>, etc. Use React Native components instead.

import {StyleSheet, Button, View, Text, Alert} from 'react-native';

Basic components available:

View,
Text,
StyleSheet,
ScrollView,
TouchableOpacity,

/* <div> replacement */
<View><Text>Test<Text/></View>

/* <button> replacement */
<Button
  onPress={onPressLearnMore}
  title="Learn More"
  color="#841584"
  accessibilityLabel="Learn more about this purple button"
/>