Would you like to inspect the original subtitles? These are the user uploaded subtitles that are being translated:
1
00:00:02,233 --> 00:00:03,866
Instructor: Now with the changes we made
2
00:00:03,866 --> 00:00:05,766
over the last lectures,
3
00:00:05,766 --> 00:00:09,300
we are able to gather our expense data,
4
00:00:09,300 --> 00:00:12,600
our user input and combine it into this object
5
00:00:12,600 --> 00:00:15,233
and clear the form thereafter.
6
00:00:15,233 --> 00:00:18,933
The only problem is that having this data is nice
7
00:00:18,933 --> 00:00:20,866
but we technically don't need it
8
00:00:20,866 --> 00:00:24,733
in the expense form component, do we?
9
00:00:24,733 --> 00:00:24,966
in the expense form component, do we?
10
00:00:24,966 --> 00:00:27,500
Instead we needed in the new expense
11
00:00:27,500 --> 00:00:30,833
or to be precise in the app JS component even
12
00:00:30,833 --> 00:00:31,033
or to be precise in the app JS component even
13
00:00:31,033 --> 00:00:33,633
because there we have our expenses array
14
00:00:33,633 --> 00:00:37,900
and ultimately our goal will be to add this new expense
15
00:00:37,900 --> 00:00:42,500
which the user entered to this list of existing expenses
16
00:00:42,500 --> 00:00:42,733
which the user entered to this list of existing expenses
17
00:00:42,733 --> 00:00:47,600
and we probably also wanna enrich it by adding an ID.
18
00:00:47,600 --> 00:00:51,300
So, we need to pass the data which we're collecting
19
00:00:51,300 --> 00:00:56,400
and generating in expense form to the app component.
20
00:00:56,400 --> 00:00:58,366
Now I put as point, we only learned
21
00:00:58,366 --> 00:01:00,500
how we can pass data down.
22
00:01:00,500 --> 00:01:05,566
So how we can, for example, in the expenses folder
23
00:01:05,566 --> 00:01:09,666
pass title, amount and date from the expenses component
24
00:01:09,666 --> 00:01:11,700
pass title, amount and date from the expenses component
25
00:01:11,700 --> 00:01:13,566
to the expense items component.
26
00:01:13,566 --> 00:01:17,033
So from parent to child, that's something we learned.
27
00:01:17,033 --> 00:01:19,566
We can do that with props,
28
00:01:19,566 --> 00:01:22,333
but how can we do it in the other direction
29
00:01:22,333 --> 00:01:22,433
but how can we do it in the other direction
30
00:01:22,433 --> 00:01:25,633
if data is generated in the expense form
31
00:01:25,633 --> 00:01:29,900
and we then wanna pass it up to the app component?
32
00:01:29,900 --> 00:01:33,566
Well, actually we already saw how it works
33
00:01:33,566 --> 00:01:35,066
but it's easy to miss it.
34
00:01:35,066 --> 00:01:37,200
So let me show it to you again.
35
00:01:37,200 --> 00:01:37,766
So let me show it to you again.
36
00:01:37,766 --> 00:01:41,766
In expense form, we are listening to user input
37
00:01:41,766 --> 00:01:45,966
to change this to the title input, for example
38
00:01:45,966 --> 00:01:48,533
and whenever the user types here,
39
00:01:48,533 --> 00:01:53,233
this function title change handler executes
40
00:01:53,233 --> 00:01:53,500
this function title change handler executes
41
00:01:53,500 --> 00:01:57,500
and there we get this default event object,
42
00:01:57,500 --> 00:01:59,766
that's something the browser gives us.
43
00:01:59,766 --> 00:02:00,400
that's something the browser gives us.
44
00:02:00,400 --> 00:02:05,266
Now, actually we can think about this input element here
45
00:02:05,266 --> 00:02:07,400
as a component as well.
46
00:02:07,400 --> 00:02:09,900
It's not one of our components
47
00:02:09,900 --> 00:02:12,566
but it is simply a pre-built component,
48
00:02:12,566 --> 00:02:15,800
we could say, provided to us by react
49
00:02:15,800 --> 00:02:19,600
and of course translate it to the input Dom element
50
00:02:19,600 --> 00:02:22,600
but it has this component character in the end
51
00:02:22,600 --> 00:02:22,766
but it has this component character in the end
52
00:02:22,766 --> 00:02:25,733
and we do also set some props on that component
53
00:02:25,733 --> 00:02:29,600
including this special onchange prop.
54
00:02:29,600 --> 00:02:32,866
Now, actually this onchange prop isn't that special,
55
00:02:32,866 --> 00:02:35,266
it's just a prop named onchange
56
00:02:35,266 --> 00:02:39,300
which wants a function as a value
57
00:02:39,300 --> 00:02:39,600
which wants a function as a value
58
00:02:39,600 --> 00:02:42,633
and then internally the input element
59
00:02:42,633 --> 00:02:44,000
adds this event listener.
60
00:02:44,000 --> 00:02:47,000
So react basically sees that we set a value
61
00:02:47,000 --> 00:02:50,000
on this onchange prop and adds that listener
62
00:02:50,000 --> 00:02:52,900
on the rendered input element.
63
00:02:52,900 --> 00:02:55,766
But that is a pattern we can replicate
64
00:02:55,766 --> 00:02:58,833
for our own components as well.
65
00:02:58,833 --> 00:02:59,100
for our own components as well.
66
00:02:59,100 --> 00:03:01,833
We can create our own event props,
67
00:03:01,833 --> 00:03:05,233
if we wanna call it like, and we can expect functions
68
00:03:05,233 --> 00:03:08,166
as values and that would allow us
69
00:03:08,166 --> 00:03:10,966
to pass a function from a parent component
70
00:03:10,966 --> 00:03:12,533
to a child component and then call that function
71
00:03:12,533 --> 00:03:14,200
to a child component and then call that function
72
00:03:14,200 --> 00:03:16,466
inside of the child component.
73
00:03:16,466 --> 00:03:18,900
And when we then call a function,
74
00:03:18,900 --> 00:03:23,100
we can of course pass data to that function as a parameter
75
00:03:23,100 --> 00:03:28,300
and that's how we can communicate up from child to parent.
76
00:03:28,300 --> 00:03:28,833
and that's how we can communicate up from child to parent.
77
00:03:28,833 --> 00:03:30,600
Now, in case this was too quick,
78
00:03:30,600 --> 00:03:33,000
let me simply show it to you.
79
00:03:33,000 --> 00:03:35,966
Let's say we wanna pass the expense data
80
00:03:35,966 --> 00:03:39,066
which we gather in the expense form component
81
00:03:39,066 --> 00:03:39,266
which we gather in the expense form component
82
00:03:39,266 --> 00:03:42,400
to the new expense component as a first step
83
00:03:42,400 --> 00:03:45,666
because if we ultimately wanna reach the app component,
84
00:03:45,666 --> 00:03:45,800
because if we ultimately wanna reach the app component,
85
00:03:45,800 --> 00:03:49,066
we first of all have to reach the new expense component
86
00:03:49,066 --> 00:03:51,233
because it's the new expense component
87
00:03:51,233 --> 00:03:53,833
which uses the expense form
88
00:03:53,833 --> 00:03:54,000
which uses the expense form
89
00:03:54,000 --> 00:03:57,266
and then in a second step later, it's the app component
90
00:03:57,266 --> 00:04:00,300
which use the new expense component
91
00:04:00,300 --> 00:04:00,633
which use the new expense component
92
00:04:00,633 --> 00:04:03,600
but we can't skip components in between,
93
00:04:03,600 --> 00:04:05,100
that's also something you learned
94
00:04:05,100 --> 00:04:07,266
in the previous course section.
95
00:04:07,266 --> 00:04:10,633
Props can only be passed from parent to child,
96
00:04:10,633 --> 00:04:14,566
we can't skip intermediate components.
97
00:04:14,566 --> 00:04:17,033
So therefore as a first step,
98
00:04:17,033 --> 00:04:21,233
let's make sure we can pass the expense data to new expense
99
00:04:21,233 --> 00:04:21,565
let's make sure we can pass the expense data to new expense
100
00:04:21,565 --> 00:04:25,600
and we can do it as by adding a new prop to expense form.
101
00:04:25,600 --> 00:04:28,366
It's our components, so we can name it however we want,
102
00:04:28,366 --> 00:04:34,600
but I will name it on save expense data,
103
00:04:34,600 --> 00:04:37,133
but the name is totally up to you,
104
00:04:37,133 --> 00:04:40,000
I'm just naming it on something
105
00:04:40,000 --> 00:04:41,833
because I wanna make it clear
106
00:04:41,833 --> 00:04:45,633
that the value for this prop should be a function,
107
00:04:45,633 --> 00:04:45,700
that the value for this prop should be a function,
108
00:04:45,700 --> 00:04:48,533
a function which will eventually be triggered
109
00:04:48,533 --> 00:04:52,466
when something happens inside of this component.
110
00:04:52,466 --> 00:04:56,700
In this case, when the user saves the entered expense data,
111
00:04:56,700 --> 00:05:00,066
so when the form is submitted in the end.
112
00:05:00,066 --> 00:05:02,433
so that's again a convention I'm following,
113
00:05:02,433 --> 00:05:03,900
you don't have to name it like this,
114
00:05:03,900 --> 00:05:05,966
you can name it however you want,
115
00:05:05,966 --> 00:05:07,166
It's totally up to you.
116
00:05:07,166 --> 00:05:09,933
It doesn't have to start with on.
117
00:05:09,933 --> 00:05:10,333
It doesn't have to start with on.
118
00:05:10,333 --> 00:05:13,400
I just do start with on to follow this convention
119
00:05:13,400 --> 00:05:16,766
and to make it clear that the value for this prop
120
00:05:16,766 --> 00:05:19,666
should be a function which can then be called
121
00:05:19,666 --> 00:05:23,333
inside of the expense form component.
122
00:05:23,333 --> 00:05:27,866
Hence, it's a function we should define here in new expense
123
00:05:27,866 --> 00:05:28,100
Hence, it's a function we should define here in new expense
124
00:05:28,100 --> 00:05:30,533
just as we did it for the input elements
125
00:05:30,533 --> 00:05:33,700
with the functions we bound to the onchange prop,
126
00:05:33,700 --> 00:05:36,233
we define those in the expense form
127
00:05:36,233 --> 00:05:39,700
before we returned the JS Xcode as well.
128
00:05:39,700 --> 00:05:39,766
before we returned the JS Xcode as well.
129
00:05:39,766 --> 00:05:43,366
Now we're doing the same here one level above that
130
00:05:43,366 --> 00:05:45,033
in the new expense component
131
00:05:45,033 --> 00:05:48,900
for our own custom expense form component.
132
00:05:48,900 --> 00:05:54,233
So here I'll add a const save expense data handler
133
00:05:54,233 --> 00:05:57,900
and important as a parameter here,
134
00:05:57,900 --> 00:06:04,266
I will expect the entered expense data.
135
00:06:04,266 --> 00:06:08,166
The name of the parameter is up to you, it's your function
136
00:06:08,166 --> 00:06:11,766
but now I make it clear that this function expects
137
00:06:11,766 --> 00:06:15,166
to get this parameter.
138
00:06:15,166 --> 00:06:19,633
And then here we can add our expense data
139
00:06:19,633 --> 00:06:24,933
another object, copy in the entered expense data
140
00:06:24,933 --> 00:06:25,033
another object, copy in the entered expense data
141
00:06:25,033 --> 00:06:27,700
which I expect to be that object
142
00:06:27,700 --> 00:06:30,166
which we generate here into submit handler,
143
00:06:30,166 --> 00:06:35,533
so this object, I pull out all the key value pairs
144
00:06:35,533 --> 00:06:37,933
and add them to this new object
145
00:06:37,933 --> 00:06:42,066
and then I add in a new key, the ID key
146
00:06:42,066 --> 00:06:45,033
and simply set that to math random.
147
00:06:45,033 --> 00:06:48,466
Math random to string to convert it to a string.
148
00:06:48,466 --> 00:06:48,966
Math random to string to convert it to a string.
149
00:06:48,966 --> 00:06:51,000
It's not a perfect unique ID,
150
00:06:51,000 --> 00:06:54,766
theoretically we could generate the same value twice
151
00:06:54,766 --> 00:06:57,733
but it's good enough for this demo.
152
00:06:57,733 --> 00:07:00,500
And then we can see what we do with that thereafter,
153
00:07:00,500 --> 00:07:06,000
for the moment I'll just log does enriched expense data.
154
00:07:06,000 --> 00:07:08,166
Now it's a pointer at this function,
155
00:07:08,166 --> 00:07:13,233
which I wanna pass as a value to all onSave expense data,
156
00:07:13,233 --> 00:07:16,133
so that this onSave expense data prop
157
00:07:16,133 --> 00:07:20,533
in my custom component receives this function as a value.
158
00:07:20,533 --> 00:07:20,766
in my custom component receives this function as a value.
159
00:07:20,766 --> 00:07:23,233
Again, I don't execute it here,
160
00:07:23,233 --> 00:07:24,900
we don't add parenthesis,
161
00:07:24,900 --> 00:07:26,966
I just point at the function,
162
00:07:26,966 --> 00:07:30,100
so that the function itself a pointer edit
163
00:07:30,100 --> 00:07:33,533
is passed to expense form.
164
00:07:33,533 --> 00:07:35,466
Now that's the first step.
165
00:07:35,466 --> 00:07:38,566
The second step now is to use this function
166
00:07:38,566 --> 00:07:41,433
inside of our custom component.
167
00:07:41,433 --> 00:07:44,233
That's a step we didn't have to do for the inputs
168
00:07:44,233 --> 00:07:47,533
because these are built in components basically,
169
00:07:47,533 --> 00:07:48,033
because these are built in components basically,
170
00:07:48,033 --> 00:07:51,533
but they're also we pass a function to onchange
171
00:07:51,533 --> 00:07:54,700
and internally react and we'll add a listener
172
00:07:54,700 --> 00:07:57,300
and call this function which we pass in
173
00:07:57,300 --> 00:08:01,233
whenever that event occurs, that change event.
174
00:08:01,233 --> 00:08:03,866
Now, since we're doing this on our own custom component,
175
00:08:03,866 --> 00:08:07,200
we also have to call the passed in function manually
176
00:08:07,200 --> 00:08:09,500
and that's what I'll do next.
177
00:08:09,500 --> 00:08:09,966
and that's what I'll do next.
178
00:08:09,966 --> 00:08:13,966
So inside of expense form, we now can expect this
179
00:08:13,966 --> 00:08:17,566
onSave expense data prop because I am setting it
180
00:08:17,566 --> 00:08:20,066
when I used the expense form component,
181
00:08:20,066 --> 00:08:20,166
when I used the expense form component,
182
00:08:20,166 --> 00:08:21,900
hence instead of expense form,
183
00:08:21,900 --> 00:08:23,766
we can extract the value passed
184
00:08:23,766 --> 00:08:27,733
for this prop ie, this function.
185
00:08:27,733 --> 00:08:30,166
So, inside of expense form,
186
00:08:30,166 --> 00:08:33,500
I of course now expect to get some props
187
00:08:33,500 --> 00:08:35,732
because we're setting a prop now
188
00:08:35,732 --> 00:08:36,232
because we're setting a prop now
189
00:08:36,232 --> 00:08:39,666
and now, inside of the submit handler,
190
00:08:39,666 --> 00:08:42,832
instead of I logging my expense data,
191
00:08:42,832 --> 00:08:48,933
I will access props onSave expense data and execute it here.
192
00:08:48,933 --> 00:08:50,066
And that's now important,
193
00:08:50,066 --> 00:08:52,233
now I execute it.
194
00:08:52,233 --> 00:08:56,300
I can execute it because the value which we get on this
195
00:08:56,300 --> 00:08:59,800
onSave expense data key will be a function.
196
00:08:59,800 --> 00:09:03,666
We are passing in a function here after all.
197
00:09:03,666 --> 00:09:09,000
So it's this function defined in the new expense component
198
00:09:09,000 --> 00:09:12,633
which we will now execute in a different component,
199
00:09:12,633 --> 00:09:15,200
inside of expense form to be precise.
200
00:09:15,200 --> 00:09:15,700
inside of expense form to be precise.
201
00:09:15,700 --> 00:09:18,300
And we can execute the function
202
00:09:18,300 --> 00:09:21,366
even though it's not defined inside of expense form
203
00:09:21,366 --> 00:09:24,166
because we are passing a pointer at it
204
00:09:24,166 --> 00:09:27,766
through the onSave expense data prop.
205
00:09:27,766 --> 00:09:28,300
through the onSave expense data prop.
206
00:09:28,300 --> 00:09:31,266
And this is a super important pattern
207
00:09:31,266 --> 00:09:34,300
which you will use a lot in react.
208
00:09:34,300 --> 00:09:37,100
This is how you can communicate between components
209
00:09:37,100 --> 00:09:39,500
and how you can communicate up,
210
00:09:39,500 --> 00:09:39,933
and how you can communicate up,
211
00:09:39,933 --> 00:09:43,300
how you can make sure that a child component,
212
00:09:43,300 --> 00:09:45,933
the expense form component here for example,
213
00:09:45,933 --> 00:09:48,866
can communicate up to the parent component,
214
00:09:48,866 --> 00:09:51,533
the new expense component in this case.
215
00:09:51,533 --> 00:09:51,966
the new expense component in this case.
216
00:09:51,966 --> 00:09:54,933
We can call a function in the new expense component
217
00:09:54,933 --> 00:09:58,233
and we can pass data as a parameter.
218
00:09:58,233 --> 00:09:58,633
and we can pass data as a parameter.
219
00:09:58,633 --> 00:10:01,866
So here, when we call onSave expense data
220
00:10:01,866 --> 00:10:04,933
in the expense form, I can pass the expense data
221
00:10:04,933 --> 00:10:08,766
which are generated here as our argument
222
00:10:08,766 --> 00:10:10,733
and that's the value which we'll receive
223
00:10:10,733 --> 00:10:14,466
as a parameter here in new expense.
224
00:10:14,466 --> 00:10:15,466
as a parameter here in new expense.
225
00:10:15,466 --> 00:10:17,800
I hope this flow is clear.
226
00:10:17,800 --> 00:10:20,300
The trick really is that we pass around
227
00:10:20,300 --> 00:10:23,166
a pointer at a function.
228
00:10:23,166 --> 00:10:25,966
Now, if we go back and I reload,
229
00:10:25,966 --> 00:10:29,833
if I again, enter something here
230
00:10:29,833 --> 00:10:32,666
and pick a date if I click add expense,
231
00:10:32,666 --> 00:10:32,966
and pick a date if I click add expense,
232
00:10:32,966 --> 00:10:35,433
you see this is being locked to the console
233
00:10:35,433 --> 00:10:39,433
and it's being locked from the new expense file line 12,
234
00:10:39,433 --> 00:10:41,933
so it's does log here.
235
00:10:41,933 --> 00:10:42,866
so it's does log here.
236
00:10:42,866 --> 00:10:44,333
And we can tell that it's from there
237
00:10:44,333 --> 00:10:46,733
because we also have an ID field there
238
00:10:46,733 --> 00:10:48,600
which has this random number
239
00:10:48,600 --> 00:10:51,900
which has generated and converted to a string.
240
00:10:51,900 --> 00:10:52,366
which has generated and converted to a string.
241
00:10:52,366 --> 00:10:54,700
And that's how we can communicate up
242
00:10:54,700 --> 00:10:58,266
and this is a super important pattern.
243
00:10:58,266 --> 00:11:01,633
Now, of course, we can continue in this chain now
244
00:11:01,633 --> 00:11:06,533
and we can communicate up from inside new expense to app
245
00:11:06,533 --> 00:11:06,766
and we can communicate up from inside new expense to app
246
00:11:06,766 --> 00:11:08,866
because it's this app component which needs
247
00:11:08,866 --> 00:11:13,333
the new expense in the end to add it to this expenses array.
248
00:11:13,333 --> 00:11:17,400
So therefore again, in app JS,
249
00:11:17,400 --> 00:11:19,833
we can add a function which we defined
250
00:11:19,833 --> 00:11:22,266
before we return JSX code
251
00:11:22,266 --> 00:11:22,500
before we return JSX code
252
00:11:22,500 --> 00:11:27,833
and we can simply name this at expense handler
253
00:11:27,833 --> 00:11:32,400
and be expect to get our expense here as a parameter
254
00:11:32,400 --> 00:11:32,500
and be expect to get our expense here as a parameter
255
00:11:32,500 --> 00:11:34,400
and then we do something with it.
256
00:11:34,400 --> 00:11:34,466
and then we do something with it.
257
00:11:34,466 --> 00:11:38,933
And for the moment I'll just console log in app JS
258
00:11:38,933 --> 00:11:41,066
and console log the expense
259
00:11:41,066 --> 00:11:43,300
because we haven't quite yet learned
260
00:11:43,300 --> 00:11:47,333
how we can render lists of data dynamically
261
00:11:47,333 --> 00:11:48,800
and therefore for the moment,
262
00:11:48,800 --> 00:11:51,500
I will not update the expenses array,
263
00:11:51,500 --> 00:11:53,400
that is something we'll do
264
00:11:53,400 --> 00:11:56,333
and learn about in the next course section though.
265
00:11:56,333 --> 00:12:00,833
For the moment, I just wanna confirm that the data arrived.
266
00:12:00,833 --> 00:12:01,200
For the moment, I just wanna confirm that the data arrived.
267
00:12:01,200 --> 00:12:03,866
So here's the function now again,
268
00:12:03,866 --> 00:12:06,166
using the same pattern as before,
269
00:12:06,166 --> 00:12:10,066
we can pass a pointer at this function to a new expense
270
00:12:10,066 --> 00:12:10,200
we can pass a pointer at this function to a new expense
271
00:12:10,200 --> 00:12:11,800
so that inside of new expense,
272
00:12:11,800 --> 00:12:15,100
we can call this function and pass that expense data
273
00:12:15,100 --> 00:12:17,766
up to the app component.
274
00:12:17,766 --> 00:12:21,166
So we could name this prop here on add expense,
275
00:12:21,166 --> 00:12:23,966
again, the name is up to you, it's your component
276
00:12:23,966 --> 00:12:26,400
but again, I will follow this convention
277
00:12:26,400 --> 00:12:28,466
starting with on to make it clear
278
00:12:28,466 --> 00:12:30,133
that it's a function pointer
279
00:12:30,133 --> 00:12:32,600
which has passed as our argument
280
00:12:32,600 --> 00:12:36,033
and then I pass a pointer at add expense handler
281
00:12:36,033 --> 00:12:41,366
to the on expense prop on new expense,
282
00:12:41,366 --> 00:12:45,266
and therefore inside of new expense, we can now call it.
283
00:12:45,266 --> 00:12:48,300
We can accept the props argument here as well,
284
00:12:48,300 --> 00:12:50,333
this parameter and in safe expense data handler
285
00:12:50,333 --> 00:12:53,500
this parameter and in safe expense data handler
286
00:12:53,500 --> 00:12:56,133
which itself is called when something happens
287
00:12:56,133 --> 00:12:57,766
in the expense form, we can of course
288
00:12:57,766 --> 00:12:58,900
in the expense form, we can of course
289
00:12:58,900 --> 00:13:04,966
now also called props on add expense
290
00:13:04,966 --> 00:13:07,300
and of course here, we wanna use the name
291
00:13:07,300 --> 00:13:09,800
which we chose here in the app component.
292
00:13:09,800 --> 00:13:12,733
We're calling the function past as a value
293
00:13:12,733 --> 00:13:15,700
for that on add expense prop.
294
00:13:15,700 --> 00:13:18,700
I'm calling us here, and it will forward
295
00:13:18,700 --> 00:13:22,833
my enriched expense data here.
296
00:13:22,833 --> 00:13:24,833
And if we now save everything,
297
00:13:24,833 --> 00:13:32,100
again if I reload, and I add a book here for 1299,
298
00:13:32,100 --> 00:13:34,533
if I click add expense, this is being logged
299
00:13:34,533 --> 00:13:37,766
from inside the app component as we can clearly tell
300
00:13:37,766 --> 00:13:41,600
and I'm actually logging the expenses as I see,
301
00:13:41,600 --> 00:13:44,133
I wanted to log the expense instead,
302
00:13:44,133 --> 00:13:47,100
so let me fix this.
303
00:13:47,100 --> 00:13:51,133
Let me give this another try, a book 1299,
304
00:13:51,133 --> 00:13:56,466
pick a date, yeah, so now we're logging the single expense.
305
00:13:56,466 --> 00:13:58,433
Again, we'll use that expense
306
00:13:58,433 --> 00:14:01,866
and change the array and output DRA dynamically too,
307
00:14:01,866 --> 00:14:04,333
we'll do that in the next course section
308
00:14:04,333 --> 00:14:06,766
but for the moment I wanted to focus
309
00:14:06,766 --> 00:14:09,600
on that state and event handling thing
310
00:14:09,600 --> 00:14:14,400
and being able to pass data up is a crucial part of it
311
00:14:14,400 --> 00:14:15,933
and here's how it works.
25024
Can't find what you're looking for?
Get subtitles in any language from opensubtitles.com, and translate them here.