1
00:00:01,020 --> 00:00:06,140
In this section we're going to talk about the next tiny little difference between GSX and HMO this difference

2
00:00:06,140 --> 00:00:09,800
is very small so it should get through this video pretty darn quickly.

3
00:00:09,800 --> 00:00:16,190
The rule is anywhere in each female where we assign a class whenever we move over to GSX we're going

4
00:00:16,190 --> 00:00:19,000
to use a slightly slightly different syntax.

5
00:00:19,010 --> 00:00:20,920
So let me show you an example.

6
00:00:20,960 --> 00:00:26,200
Back over inside of our index such as file our label has a class of label right here.

7
00:00:26,240 --> 00:00:30,180
Technically we're not supposed to use the key word class inside of a GSX element.

8
00:00:30,290 --> 00:00:33,450
Instead we use class name like so.

9
00:00:33,740 --> 00:00:34,250
And that's it.

10
00:00:34,250 --> 00:00:36,440
That's the only change you have to make.

11
00:00:36,500 --> 00:00:38,330
Now you might be curious why do we do that.

12
00:00:38,330 --> 00:00:41,320
What is the difference between just saying class and class name.

13
00:00:41,640 --> 00:00:47,260
I want you to recall back when we were working on code pen a little bit ago we had created and yes 20:15

14
00:00:47,270 --> 00:00:47,800
class.

15
00:00:47,810 --> 00:00:49,970
I'm going to show you a quick example of that right here.

16
00:00:50,000 --> 00:00:54,170
We had written something like class app extends re-act dot component.

17
00:00:54,650 --> 00:00:59,570
So the keyword in there was class that was a javascript keyword.

18
00:00:59,600 --> 00:01:05,420
The reason that we have to use class name instead of class in GSX is essentially just to avoid collisions

19
00:01:05,480 --> 00:01:08,390
with this keyword of class that's it.

20
00:01:08,390 --> 00:01:13,430
We just don't want javascript to get confused and think that we are trying to define a new javascript

21
00:01:13,430 --> 00:01:14,960
class right here.

22
00:01:14,960 --> 00:01:18,580
Now as you just saw our code is able to run in the browser without air.

23
00:01:18,590 --> 00:01:19,560
When we do this.

24
00:01:19,670 --> 00:01:25,460
So this is kind of a throwback to the very old days of re-act where this used to be an issue but these

25
00:01:25,460 --> 00:01:29,990
days javascript and the tools around it are intelligent enough to understand the difference between

26
00:01:30,200 --> 00:01:36,500
a class declaration right here and us using the class attribute inside of some GSX.

27
00:01:36,500 --> 00:01:41,450
So with that in mind it's important to understand that there is some discussion in the reac community

28
00:01:41,450 --> 00:01:45,700
right now around removing this requirement of saying class name.

29
00:01:45,740 --> 00:01:49,910
So at some point in time the future you might see in the documentation something that says oh yeah you

30
00:01:49,910 --> 00:01:52,830
can now get away with entering class instead of class name.

31
00:01:52,890 --> 00:01:57,380
However that's something probably in the future might not even by be alive by the time you watch this

32
00:01:57,380 --> 00:01:57,800
video.

33
00:01:57,800 --> 00:02:01,050
Just be aware that this requirement might be a little bit relaxed.

34
00:02:01,390 --> 00:02:01,590
OK.

35
00:02:01,610 --> 00:02:05,130
So replace that with class name or then save the file.

36
00:02:05,260 --> 00:02:07,040
I'm going to flip back over to my browser.

37
00:02:07,850 --> 00:02:09,990
And it looks like everything still continues to work.

38
00:02:11,050 --> 00:02:11,280
OK.

39
00:02:11,300 --> 00:02:12,290
So not bad.

40
00:02:12,640 --> 00:02:17,870
So let's move on to the next section and talk about the last little difference between GSX and HD email.