1

00:00:00,810  -->  00:00:04,480
Then the last section we started to try to render a component into the dub.

2

00:00:04,770  -->  00:00:07,860
We got an error however that said that re-act wasn't defined.

3

00:00:08,130  -->  00:00:12,220
So we imported react as a javascript module into this file.

4

00:00:12,720  -->  00:00:17,040
So now we can reasonably believe that we can call re-act surrender and we won't get an error.

5

00:00:17,340  -->  00:00:23,330
So I'm going to save this file flip open to the browser and refresh Let's see what happens.

6

00:00:23,530  -->  00:00:30,870
OK so re-act out render is deprecated please use re-act Dom instead and also invalid component element

7

00:00:30,930  -->  00:00:32,490
instead of passing component class.

8

00:00:32,490  -->  00:00:37,040
Make sure you instantiated by Palestinian to react create element.

9

00:00:37,160  -->  00:00:42,640
OK so let's flip back over to our code here in our file.

10

00:00:42,660  -->  00:00:46,820
We've imported library called re-act right.

11

00:00:46,830  -->  00:00:51,300
Re-act however is starting to diverged into two separate libraries.

12

00:00:51,420  -->  00:00:57,630
The core re-act library which we've already imported here knows how to work with re-act components so

13

00:00:57,630  -->  00:01:03,600
knows how to render them how to nest them together and so on the functionality to actually render them

14

00:01:03,600  -->  00:01:04,970
to the dorm however.

15

00:01:04,980  -->  00:01:13,210
So to take a component and insert it into the DOM is now a separate library called re-act Dom.

16

00:01:13,260  -->  00:01:18,930
So right now if you go to say you know re-act dog have done io the wrecked home page and you try to

17

00:01:18,930  -->  00:01:20,100
download react.

18

00:01:20,100  -->  00:01:22,800
You're going to see both react and react domm.

19

00:01:23,100  -->  00:01:27,920
So to actually render a component to the DOM we don't use the re-act library.

20

00:01:28,050  -->  00:01:30,740
We use the react Dolemite start.

21

00:01:30,750  -->  00:01:31,870
I say react on.

22

00:01:32,040  -->  00:01:32,820
We don't use react.

23

00:01:32,820  -->  00:01:33,830
We use react.

24

00:01:33,870  -->  00:01:34,740
That's why I meant to say.

25

00:01:34,800  -->  00:01:35,380
OK.

26

00:01:35,670  -->  00:01:41,140
So fortunately our project has already installed react on them in here as well.

27

00:01:41,160  -->  00:01:48,380
So let's give this a shot we'll say import re-act Dom from re-act Dom.

28

00:01:48,570  -->  00:01:53,040
So we now have access to the variable reactor we have access to that library.

29

00:01:53,070  -->  00:01:57,660
So let's go ahead and update our render statement react dobbed render app.

30

00:01:57,660  -->  00:02:03,720
So again we use react on here because we're trying to render something to the dom or trying to you know

31

00:02:03,750  -->  00:02:05,330
touch the dog directly.

32

00:02:05,550  -->  00:02:10,160
Whenever we do that we use to react on library not react.

33

00:02:10,170  -->  00:02:10,850
OK.

34

00:02:11,080  -->  00:02:13,950
So let's go ahead and try this on the browser.

35

00:02:14,730  -->  00:02:19,890
And it looks like it fixed the first stair but we still have the second one still has something here

36

00:02:19,890  -->  00:02:24,380
about make sure to instantiate it by passing it to react create element.

37

00:02:24,390  -->  00:02:26,320
Let's address this air in the next section