Would you like to inspect the original subtitles? These are the user uploaded subtitles that are being translated:
1
00:00:02,040 --> 00:00:05,170
So now we learned about getStaticPaths.
2
00:00:05,170 --> 00:00:06,003
At the moment
3
00:00:06,003 --> 00:00:09,210
the way we use it is still a bit unrealistic though
4
00:00:09,210 --> 00:00:13,060
because I have hard coded my PID values here
5
00:00:13,060 --> 00:00:14,270
into this function.
6
00:00:14,270 --> 00:00:16,740
And in reality, we would be fetching
7
00:00:16,740 --> 00:00:17,990
this kind of information
8
00:00:17,990 --> 00:00:20,913
from a database or a file as well.
9
00:00:21,780 --> 00:00:24,330
So therefore in reality, we would basically
10
00:00:24,330 --> 00:00:26,800
just repeat this code here
11
00:00:26,800 --> 00:00:29,090
and would wrap that code
12
00:00:29,090 --> 00:00:32,273
and just outsource it into a separate function.
13
00:00:33,830 --> 00:00:38,110
Async function called get data
14
00:00:39,730 --> 00:00:41,950
where I then returned data.
15
00:00:41,950 --> 00:00:44,690
And since it's async, we can use a weight in there
16
00:00:44,690 --> 00:00:48,660
and then we can just get our data here
17
00:00:48,660 --> 00:00:51,390
by calling get data
18
00:00:51,390 --> 00:00:56,210
and waiting this here in getStatic prompts.
19
00:00:56,210 --> 00:00:58,923
And we can do the same in getStaticPaths.
20
00:01:00,140 --> 00:01:01,600
So a little bit of refactoring
21
00:01:01,600 --> 00:01:04,209
to have no code duplication.
22
00:01:04,209 --> 00:01:05,850
With that we get the data.
23
00:01:05,850 --> 00:01:07,440
And now here in getStaticPaths.
24
00:01:07,440 --> 00:01:10,780
We want to use the data to read all the IDs
25
00:01:10,780 --> 00:01:11,833
we want to support.
26
00:01:13,470 --> 00:01:16,430
So for this, we could get our IDs array here
27
00:01:16,430 --> 00:01:19,920
by going through all the data pieces.
28
00:01:19,920 --> 00:01:21,340
Now the data we get back here
29
00:01:21,340 --> 00:01:24,250
by the way will already be parsed json
30
00:01:24,250 --> 00:01:25,870
since we do that and get data.
31
00:01:25,870 --> 00:01:28,420
So it will be a JavaScript object.
32
00:01:28,420 --> 00:01:30,990
So here IDs then should be an array.
33
00:01:30,990 --> 00:01:33,890
And in dummy backend, we have this products array.
34
00:01:33,890 --> 00:01:34,723
So in the end
35
00:01:34,723 --> 00:01:38,580
what we want to do is you want to access data.products
36
00:01:38,580 --> 00:01:42,370
and then just map this array of complete product objects
37
00:01:42,370 --> 00:01:45,550
into an array of just product IDs.
38
00:01:45,550 --> 00:01:47,710
Just like this, for example.
39
00:01:47,710 --> 00:01:49,020
Just extracting the ID
40
00:01:49,020 --> 00:01:53,440
for every product and then having such an IDs array here.
41
00:01:53,440 --> 00:01:56,810
And then we need to translate this IDs array
42
00:01:56,810 --> 00:02:00,150
into an array of such objects.
43
00:02:00,150 --> 00:02:04,260
So here we could then create another object params
44
00:02:04,260 --> 00:02:05,900
which has a number array.
45
00:02:05,900 --> 00:02:07,050
But we create this array
46
00:02:07,050 --> 00:02:10,229
by going through the ideas and mapping these IDs
47
00:02:10,229 --> 00:02:15,230
such that every ID is mapped into an object.
48
00:02:15,760 --> 00:02:17,230
And we need to wrap this
49
00:02:17,230 --> 00:02:20,770
in extra brackets here, extra parentheses,
50
00:02:20,770 --> 00:02:25,120
so that this is not considered as the function body
51
00:02:25,120 --> 00:02:29,020
but that we instead inline return a new object
52
00:02:29,020 --> 00:02:33,170
for every ID and object with a parent's key
53
00:02:33,170 --> 00:02:37,170
which then holds another object with a PID key
54
00:02:37,170 --> 00:02:41,280
which has this ID as a value.
55
00:02:41,280 --> 00:02:43,320
And that's then repeated for every ID.
56
00:02:43,320 --> 00:02:46,730
So we end up with an array full off such objects
57
00:02:46,730 --> 00:02:49,700
which have exactly that structure we need down there
58
00:02:49,700 --> 00:02:53,840
so that we can set paths equal to params here
59
00:02:54,780 --> 00:02:59,780
where we name this paths with params,
60
00:02:59,880 --> 00:03:00,713
maybe whoops
61
00:03:00,713 --> 00:03:03,433
paths with params just like this.
62
00:03:05,250 --> 00:03:08,610
And of course we could perform these two operations
63
00:03:08,610 --> 00:03:10,740
in one single step as well.
64
00:03:10,740 --> 00:03:13,390
I'm just using two steps here to hopefully
65
00:03:13,390 --> 00:03:16,340
make this a bit easier to understand.
66
00:03:16,340 --> 00:03:18,870
And then with that, if I now saved this
67
00:03:18,870 --> 00:03:20,940
it still works as before.
68
00:03:20,940 --> 00:03:23,520
Everything still works as before
69
00:03:23,520 --> 00:03:27,640
now also all the pages are pre-generated again, by the way
70
00:03:27,640 --> 00:03:30,960
because I am going through all the products here.
71
00:03:30,960 --> 00:03:34,890
So now we can also set fallback to false again
72
00:03:34,890 --> 00:03:38,710
because we are loading all possible IDs anyways
73
00:03:39,970 --> 00:03:42,850
and that's of course, a bit more realistic here
74
00:03:42,850 --> 00:03:46,890
because typically you would not pre hard code
75
00:03:46,890 --> 00:03:49,030
all supported values here.
76
00:03:49,030 --> 00:03:51,950
Typically you don't know all dynamic values
77
00:03:51,950 --> 00:03:53,890
in advance as a developer
78
00:03:53,890 --> 00:03:57,060
but instead you would fetch them from the same data source
79
00:03:57,060 --> 00:04:00,343
as the actual data is then fetched from later.
6013
Can't find what you're looking for?
Get subtitles in any language from opensubtitles.com, and translate them here.