Would you like to inspect the original subtitles? These are the user uploaded subtitles that are being translated:
1
00:00:02,120 --> 00:00:05,250
Now to really conclude this module,
2
00:00:05,250 --> 00:00:07,980
I just wanna show you an alternative syntax
3
00:00:07,980 --> 00:00:10,130
for writing these functions,
4
00:00:10,130 --> 00:00:12,653
any kinds of functions in JavaScript.
5
00:00:13,800 --> 00:00:17,320
A syntax which is not exclusive to React by the way,
6
00:00:17,320 --> 00:00:21,630
but which can be used in any modern JavaScript application.
7
00:00:21,630 --> 00:00:23,550
Instead of writing a function like this
8
00:00:23,550 --> 00:00:25,430
with the function keyword,
9
00:00:25,430 --> 00:00:29,420
you can also write a so-called arrow function,
10
00:00:29,420 --> 00:00:32,250
and attached you find a link with more details
11
00:00:32,250 --> 00:00:34,060
on these arrow functions.
12
00:00:34,060 --> 00:00:36,373
Again, it's not a React specific thing.
13
00:00:37,520 --> 00:00:40,000
To use that arrow function syntax.
14
00:00:40,000 --> 00:00:44,050
You replace function with const to create a new constant
15
00:00:44,050 --> 00:00:47,000
with a given name app in this case.
16
00:00:47,000 --> 00:00:50,190
And then the value which you assigned to this constant
17
00:00:50,190 --> 00:00:53,143
is an arrow function written like this.
18
00:00:54,600 --> 00:00:57,300
A list of parameters then an equal sign
19
00:00:57,300 --> 00:01:00,030
and a greater sign forming such an arrow
20
00:01:00,030 --> 00:01:03,510
and then the function body between curly braces.
21
00:01:03,510 --> 00:01:06,823
And again, that's really just standard JavaScript code.
22
00:01:07,900 --> 00:01:11,670
You can absolutely stick to the function keyword.
23
00:01:11,670 --> 00:01:14,710
This is just a syntax, which I personally prefer
24
00:01:14,710 --> 00:01:17,870
because it's a bit shorter or yeah, I just prefer it.
25
00:01:17,870 --> 00:01:21,380
And therefore I will migrate all my functions to
26
00:01:21,380 --> 00:01:25,480
this syntax like this here in the case of card
27
00:01:25,480 --> 00:01:26,880
but you don't have to do that
28
00:01:26,880 --> 00:01:31,880
if you prefer the other syntax, it's really 100% optional.
29
00:01:32,320 --> 00:01:33,920
And in this case here
30
00:01:33,920 --> 00:01:37,110
it doesn't offer any benefits or anything like that.
31
00:01:37,110 --> 00:01:39,040
It's really just personal preference.
32
00:01:39,040 --> 00:01:41,330
And I want to show this syntax here
33
00:01:41,330 --> 00:01:44,330
since you will also see that in a lot of React projects
34
00:01:44,330 --> 00:01:46,540
and you therefore should be aware of it
35
00:01:46,540 --> 00:01:48,880
that you can write your functions like this,
36
00:01:48,880 --> 00:01:52,173
any functions by the way, not just component functions.
37
00:01:54,430 --> 00:01:58,060
And with that, we're really done for this module.
38
00:01:58,060 --> 00:01:59,400
It was a huge module.
39
00:01:59,400 --> 00:02:02,520
And yet we're still only scratching the surface.
40
00:02:02,520 --> 00:02:05,290
There's way more to explore about React.
41
00:02:05,290 --> 00:02:07,940
And the next thing we are going to explore is how
42
00:02:07,940 --> 00:02:10,710
we can make this a bit more interactive
43
00:02:10,710 --> 00:02:14,380
and reactive because currently it's all static.
44
00:02:14,380 --> 00:02:16,120
This data never changes.
45
00:02:16,120 --> 00:02:18,890
As a user we can't do anything about it.
46
00:02:18,890 --> 00:02:21,420
And we are building modern user interfaces
47
00:02:21,420 --> 00:02:23,480
with React because we typically want to
48
00:02:23,480 --> 00:02:26,714
build user interfaces where things can change.
49
00:02:26,714 --> 00:02:30,370
Therefore, in the next course section, we are going to dive
50
00:02:30,370 --> 00:02:32,890
into another important React concept,
51
00:02:32,890 --> 00:02:35,260
state because that will help us
52
00:02:35,260 --> 00:02:37,823
make our applications interactive.
4208
Can't find what you're looking for?
Get subtitles in any language from opensubtitles.com, and translate them here.