1
00:00:02,330 --> 00:00:06,270
Now, that's it for EJS and templates,

2
00:00:06,270 --> 00:00:08,550
a major step forward.

3
00:00:08,550 --> 00:00:10,990
One problem we have here at the moment,

4
00:00:10,990 --> 00:00:13,350
or one area of improvement,

5
00:00:13,350 --> 00:00:17,690
is that the EJS syntax isn't really understood by visuals

6
00:00:17,690 --> 00:00:19,080
to do code.

7
00:00:19,080 --> 00:00:20,620
To avoid that

8
00:00:20,620 --> 00:00:23,610
and make our life as a developer a bit easier,

9
00:00:23,610 --> 00:00:25,660
we can look for a separate extension

10
00:00:25,660 --> 00:00:27,620
that might help us with that,

11
00:00:27,620 --> 00:00:30,120
by going to Extensions here.

12
00:00:30,120 --> 00:00:32,259
Here if you search for EJS,

13
00:00:32,259 --> 00:00:36,500
you find extensions that help you with the EJS language.

14
00:00:36,500 --> 00:00:38,320
And here we got this

15
00:00:38,320 --> 00:00:41,093
EJS language extension by Digital brainstem.

16
00:00:42,220 --> 00:00:44,960
If we install this extension here,

17
00:00:44,960 --> 00:00:48,373
we should get better EJS support in our code.

18
00:00:49,210 --> 00:00:52,070
Back in the restaurants EJS file.

19
00:00:52,070 --> 00:00:56,260
I now do, for example, see this syntax highlighting,

20
00:00:56,260 --> 00:00:59,730
or at least it's not red anymore, and include, for example,

21
00:00:59,730 --> 00:01:04,140
is highlighted, and our keywords are highlighted as well.

22
00:01:04,140 --> 00:01:05,670
If I start typing here,

23
00:01:05,670 --> 00:01:07,950
I also get some auto completion now,

24
00:01:07,950 --> 00:01:10,773
and I see the different EJS tags I can use.

25
00:01:12,100 --> 00:01:13,760
For example, the equal sign tag,

26
00:01:13,760 --> 00:01:17,160
and it adds a closing tag automatically for me then.

27
00:01:17,160 --> 00:01:19,080
I also get other completion, for example,

28
00:01:19,080 --> 00:01:21,300
for the for keyword and so on.

29
00:01:21,300 --> 00:01:25,200
So that's now a nicer experience than it was before.

30
00:01:25,200 --> 00:01:27,620
Now one thing that won't work too well

31
00:01:27,620 --> 00:01:29,290
is this auto formatting.

32
00:01:29,290 --> 00:01:32,600
Unfortunately, if I press that shortcut,

33
00:01:32,600 --> 00:01:36,500
things don't get formatted ideally, as you can tell,

34
00:01:36,500 --> 00:01:40,060
because Prettier, the extension we use for auto formatting,

35
00:01:40,060 --> 00:01:44,840
unfortunately, doesn't talk EJS at this point.

36
00:01:44,840 --> 00:01:47,460
So, I'll refrain from using

37
00:01:47,460 --> 00:01:49,730
the auto formatting shortcut like this here,

38
00:01:49,730 --> 00:01:52,970
and instead I'll try to format the code manually.

39
00:01:52,970 --> 00:01:55,220
It's just something worth noting.

40
00:01:55,220 --> 00:01:57,260
It's a downside you have here,

41
00:01:57,260 --> 00:02:00,130
but of course, the huge advantage of using EJS,

42
00:02:00,130 --> 00:02:02,960
is that we can now generates dynamic content

43
00:02:02,960 --> 00:02:06,330
and that we can now also split our HTML files

44
00:02:06,330 --> 00:02:07,890
into multiple files.

45
00:02:07,890 --> 00:02:10,449
And still, that's super important.

46
00:02:10,449 --> 00:02:15,333
Serve one finished HTML document to the browser in the end.