React – Native – Day 8 – Basic stuff with view, text and safe area

I am using mac for creating react native project. You will learn some basic stuff on react native like basic user interface buttons, text inputs and view.

Launch Terminal and type:

react-native init BasicStuffs

Paste below code in index.js:

Here is the output:

Issue found:

hello world is hiding behind safe area.

Fix:

Use SafeAreaView – We will wrap our Text in SafeAreaView.

change

to

and change JSX as below:

Complete code:

Output:

Style

Let’s say I want the text color to be red:

Let’s Create Style like this:

Let’s use it as below code snippet:

Output:

Let’s play with views, buttons and input texts:

Output:

I am learning flex and will share you guys soon in next tutorials:)

Thanks & Regards,

Alok Upadhyay.

Skype : alok.upadhyay32

https://www.linkedin.com/in/k-alok-44656a15/

https://medium.com/@maddy.lucky4u

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.