1
00:00:00,650 --> 00:00:02,640
We've now got a little bit of knowledge around ASX.

2
00:00:02,660 --> 00:00:06,020
And so now it's time for us to practice what we've learnt so to do so.

3
00:00:06,050 --> 00:00:11,150
I would like for you to work on a tiny little exercise in this exercise you're going to make some changes

4
00:00:11,360 --> 00:00:12,850
to the component screen component.

5
00:00:12,860 --> 00:00:15,050
We just put together so inside there.

6
00:00:15,050 --> 00:00:17,710
I would love for you to show two separate text elements.

7
00:00:17,810 --> 00:00:22,670
The first element should say getting started with React Native and it should have a font size of 45

8
00:00:22,820 --> 00:00:24,350
as you see right here.

9
00:00:24,440 --> 00:00:29,140
Then the second element should say my name is blank and have a font size of 20.

10
00:00:29,450 --> 00:00:34,100
And then as a special requirement for that second text element try to assign your name to a javascript

11
00:00:34,100 --> 00:00:38,000
variable ahead of time and then printed up inside of that J.S. sex element.

12
00:00:39,170 --> 00:00:43,160
As a quick side note here you'll notice that each of these different text elements should have a different

13
00:00:43,160 --> 00:00:45,850
font size just as a quick aside.

14
00:00:45,890 --> 00:00:50,960
Done here inside the styles object right here we can add in as many different separate groups of styling

15
00:00:50,990 --> 00:00:52,130
as we want.

16
00:00:52,250 --> 00:00:56,820
So let's say that we want our first piece of text to have this font size of 30.

17
00:00:56,820 --> 00:01:02,210
If we then wanted to have a second piece of text and style it we can add in a coma and then maybe we

18
00:01:02,210 --> 00:01:08,060
would create another style object inside of here called like sub header style because in this case this

19
00:01:08,060 --> 00:01:13,430
kind of is a sub header right here and we could apply an object to it and put in our own set of styling

20
00:01:13,430 --> 00:01:19,980
rules inside of here with maybe like a font size of 20 or whatever else then to apply or reference that

21
00:01:19,980 --> 00:01:20,930
second style right there.

22
00:01:20,940 --> 00:01:28,700
We would write out inside the styled prop of some text element styles dot sub header style like so OK

23
00:01:28,810 --> 00:01:31,010
I'm going to undo that change really quickly.

24
00:01:31,160 --> 00:01:31,350
OK.

25
00:01:31,390 --> 00:01:34,840
So go ahead and give this exercise a shot if you get stuck at any point time.

26
00:01:34,840 --> 00:01:35,710
Don't sweat it.

27
00:01:35,710 --> 00:01:38,750
We're going to go over a solution together in the next video.

28
00:01:38,800 --> 00:01:41,720
In addition if you just don't feel like doing this exercise at all.

29
00:01:41,770 --> 00:01:42,490
No problem.

30
00:01:42,490 --> 00:01:46,030
Just skip to the next video so quick pause and I'll see you in just a minute.