Now let’s try to create a simple registration form
App.js already has a screen title.
Just below the text heading, add two text input components.
Both input fields must be 60% high and 80% wide.
The top margin of each input field should be 20, and the padding on all sides should be 10.
The background color should be white (#ffffff), the font size should be 20.
Border radius must be 10.

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';
import { StyleSheet, Text, View } from 'react-native';

export default function App() {
  return (
    <View style={styles.container}>
      <Text style={styles.header}>Sign In</Text>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#FF6F59',
    alignItems: 'center',
    justifyContent: 'center',
  },
  header: {
    color: '#254441',
    fontWeight: 'bold',
    fontSize: 26
  },
});

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"
    }
  }
}