Preview
Video Player
00:00
00:00
Reduce Error Handling Code When Using Async/Await
3:35Using try/catch to handle errors when using async/await syntax can get repetitive and verbose. In this video we'll look at an example of how we can use a function to abstract away try/catch.
If this were an application that had
many routes, using a try-catch block
0:00
each time would make our code pretty
long and unwieldy after a while.
0:04
To get around this,
we can use a piece of middleware to wrap
0:09
each of our routes automatically
in a try-catch block.
0:12
That way we won't have to explicitly
write it over and over again.
0:15
Let's write that middleware
at the top of our file.
0:19
We'll name it asyncHandler and
it will take a callback.
0:22
Inside the asyncHandler function we'll
return an asynchronous function that will
0:32
serve as our route handler's callback.
0:36
So it'll take the req,
res and next parameters.
0:38
Inside this function,
we'll put a try-catch block.
0:49
In the try block, we'll await whatever
function we've passed to the asyncHandler
0:57
with the normal route handling parameters.
1:02
So basically, all we're doing here is
creating a function that wraps around our
1:08
normal route handling function.
1:12
To this function we can pass all
the code we would normally pass
1:15
in our express route handler callback.
1:18
If this is confusing, try to stick with me
until we implement this in the code and
1:20
hopefully, it will make more sense.
1:24
In the catch block, we'll catch any
errors and render out our error page.
1:26
The nice thing about this is that we will
no longer need to include this error code
1:41
in every single route.
1:45
So I'll go down and delete the error
handling code from the route.
1:47
We can also get rid of the try block.
1:54
Now let's use the asyncHandler
function in our code.
1:58
asyncHandler will become
the callback in our get route.
2:01
So I'll cut out the current callback
function and move it down below, for now.
2:05
So this is where we will
call asyncHandler, and
2:13
the code we had before becomes
a callback for asyncHandler.
2:16
So let's copy and
paste it into our asyncHandler middleware.
2:21
Let's make sure the server is running and
go to the browser and
2:33
make sure this is working.
2:36
Looks like our page is
rendering as we expected.
2:39
Let's also make sure the error
page is rendering as expected.
2:42
And the error handling
is working as expected.
2:54
There you have it.
2:57
You're express route is handling
asynchronous code in a maintainable,
2:58
easy to read way.
3:01
Let's finish up by adding a comment
indicating that this is an example of
3:03
using async/await I
3:06
encourage you to give all this
information a bit of time to sink in.
3:12
Especially if you're newer to the subject.
3:16
Asynchronous programming
is a very difficult topic.
3:19
Don't be afraid to use these
approaches without completely
3:22
understanding how they work.
3:24
That's perfectly normal, and you'll
learn more and more as you work with and
3:26
struggle with them.
3:29
Thing will begin to click.
3:31
Stick with it.
3:32
And until next time, happy coding.
3:33