The App component must return a navigation container with a stacked navigator.
There should be two screens in the stack - the first named Components, and the second named APIs.
The first screen should display the screens/RNComponents component, the second one - screens/RNAPIs
In this case, the APIs screen should be displayed first.
Do not change screens/RNComponents and screens/RNAPIs components.

This task is part of the Full-Stack JavaScript Course
If you have any issues with it, you can ask for community help below the post
Feel free to help others if you’ve already solved the task

App.js

import React from 'react';

export default function App() {
  return null;
}

app.json

{
  "expo": {
    "name": "1",
    "slug": "1",
    "version": "1.0.0",
    "orientation": "portrait",
    "icon": "./assets/icon.png",
    "splash": {
      "image": "./assets/splash.png",
      "resizeMode": "contain",
      "backgroundColor": "#ffffff"
    },
    "updates": {
      "fallbackToCacheTimeout": 0
    },
    "assetBundlePatterns": [
      "**/*"
    ],
    "ios": {
      "supportsTablet": true
    },
    "android": {
      "adaptiveIcon": {
        "foregroundImage": "./assets/adaptive-icon.png",
        "backgroundColor": "#FFFFFF"
      }
    },
    "web": {
      "favicon": "./assets/favicon.png"
    }
  }
}

screens/RNAPIs/index.js

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

export default function RNAPIs() {
  return (
    <View style={styles.container}>
      <Text style={styles.header}>React Native APIs</Text>
      <View style={styles.list}>
        <Text>1. Dimensions</Text>
        <Text>2. StyleSheet</Text>
        <Text>3. PixelRatio</Text>
        <Text>4. Platform</Text>
      </View>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    paddingHorizontal: 20,
  },
  header: {
    marginVertical: 10,
    fontWeight: 'bold',
  },
  list: {
    marginBottom: 10,
  },
});

screens/RNComponents/index.js

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

export default function RNComponents() {
  return (
    <View style={styles.container}>
      <Text style={styles.header}>React Native Components</Text>
      <View style={styles.list}>
        <Text>1. View</Text>
        <Text>2. Button</Text>
        <Text>3. FlatList</Text>
        <Text>4. Pressable</Text>
        <Text>5. SectionList</Text>
      </View>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    paddingHorizontal: 20,
  },
  header: {
    marginVertical: 10,
    fontWeight: 'bold',
  },
  list: {
    marginBottom: 10,
  },
});