Exploring Three Major core components of React Native

Exploring Three Major core components of React Native

There are three important core component which will be used several times inside the JSX component. which are given below,

1. <View />
2. <Text />
3. <TextInput />

View

View in react native is so called as a container which holds other core components of react native. It is like wrapper which holds other components.

If you guys come from web development then this View is like <div />, <section />, and <article /> tags from html.

In React Native we only have <View /> component to make a container.

Text

Text in react native is a core component which helps to write text in it. without <Text /> you cannot write text in React Native.

In Web Development, if you want to write a text can you just simply write texts inside a <div />, <section /> or inside <article />, but inside React Native if you write text inside <View /> component you get an error kind of like this,

Here you can see it is giving us an error about the “Text strings must be rendered with a <Text> component.”**

The Syntax to write a string is given below,

<View>
    <Text>
        Something that we have to render in this text tag, In React Native.
    </Text>
<View>

Real time example to write text,

Now the Last which is TextInput

<TextInput /> is a component which helps to write texts inside a box, for web devs it’s like a <input /> tag.

to learn more about these core component checkout these links,

1. <View>
2. <Text>
3. <TextInput>

Thanks for reading. And, if you're interested in building native apps on React Native, then stay updated on https://dev.to/sadiqhasanrupani

If you want to see what I'm up to, follow me on LinkedIn or X.