React Native (feat. Redux) Foundational Components of React Native

[00:00:00]
>> [MUSIC]

[00:00:04]
>> Scott Moss: Now we're gonna convert. The reason we did that, cuz I wanted to refresh you on React. And I wanted to show you how simple it is and how to compare it to a web app or a native app. So now we're gonna talk about the foundational components in React Native.

[00:00:18] So there's tons of them that React Native provides and then there's tons that other people made or you probably made yourself. Some are JavaScript implementations, some are actual native UI things, but some of the foundational ones that you'll see in React Native and that you'll probably use a lot is View, with a capital V here.

[00:00:38] And almost all the components are capitalized like that, so you see View which is equivalent to a div in HTML. It's not the same thing, you pretty much have to use the View for almost everything, whereas a div you don't have to use a div for everything. But it's pretty much the equivalent.

[00:00:53] It's like a container element that we're gonna use for the rest of our page. It's just a view, that's why they call it View. So that's the equivalent of that. Text is the equivalent of all the text elements you would use, so like H1s, all the header elements, ps, aside.

[00:01:08] All the text elements you would use, that's when you would actually use the Text component in React Native. And then you have TextInput, which is equivalent to input.
>> Scott Moss: And then TouchableHighlight and all the other touchable components that are in React Native. This is gonna be equivalent to things that you click on or tap on, so like a button, anchor tag or something like that.

[00:01:32] Something that you click on and and have some interaction, that's gonna be a TouchableHighlight or a touchable. And there's so many other ones, but that's the main one. So all this doesn't really make sense right now, but you're gonna see this stuff in a minute.