Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Well done!
You have completed Flask with SQLAlchemy Basics!
You have completed Flask with SQLAlchemy Basics!
Preview
Create a route to handle errors in your website.
Code snippet from the video
<section id="not-found">
<img src="https://media.giphy.com/media/DvyLQztQwmyAM/giphy.gif" alt="Surprised Dog Gif">
<h2>Hmm...it seems this page can't be fetched.<i class="fas fa-baseball-ball"></i></h2>
<p>{{ msg }}</p>
<a href="{{ url_for('index') }}">
<button><i class="fas fa-home"></i><i class="fas fa-bone"></i>Go Home</button>
</a>
</section>
Learn more about Flask Error pages
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
When a user navigates to a page
that doesn't exist on your website,
0:00
they're typically shown an error page,
404 not found.
0:04
Here's a few great 404 pages.
0:09
This is also a popular area for
0:12
a website to show off their
personality and have some fun.
0:14
On our website when you navigate
to a page that doesn't exist,
0:19
you get this plain black and
white Not Found page.
0:24
It lets the user know what happened, but
it's not the most friendly of pages, and
0:29
it doesn't match our color scheme.
0:33
Instead, let's create our own
404 page to show the user.
0:36
In app.py, scroll down here to the bottom,
0:41
and let's add an @app.errorhandler,
0:46
and inside we're gonna parse 404.
0:51
And let's create a function and
let's call it not_found.
0:55
We're going to get an error
message when this happens.
1:01
And inside,
we're going to return a render_template.
1:06
And we're gonna create this
template here in a second 404.html.
1:10
And let's pass in the error as a message.
1:15
And then here at the end,
outside of this render template,
1:18
we're also going to send comma 404
to make sure the browser knows
1:23
this is a 404 error that we're sending in.
1:28
Now we need to create the 404 template.
1:31
New File 404.html.
1:36
It should essentially have the same
pieces as the beginning of our pet.html.
1:40
So I'm going to copy these out, paste and
let me save app.py before I forget.
1:44
And then we'll need end.
1:52
Endblock, awesome.
1:57
And then in the teacher's notes flow is
actually the code that goes inside of this
2:00
block content.
2:05
Go ahead and copy and paste it now.
2:06
I'm also going to tab it over and
hit Save.
2:11
Okay, open up our website and
let's give it a hard refresh.
2:18
And there's our 404 error page.
2:24
I want you to use this page as your guinea
pig, if you're up for the challenge.
2:28
Remove my ID tag, open up the CSS file and
2:34
scroll all the way to the bottom and
start adding your own styles.
2:37
Practice adding IDs and classes, and
2:42
then access them in the CSS
file to style the page.
2:45
You can also change out
the HTML of the page as well.
2:49
This is a great way to
practice your skills.
2:52
Now that we have a 404 page,
let's put it to use.
2:55
If a user tries to access
a pet that doesn't exist,
2:59
we need to use our new 404 error page.
3:03
Let's take a look at the docs.
3:07
You can see we can use instead of get,
we can use get_or_404.
3:10
So anytime we use get if
it doesn't find a pet,
3:16
it will automatically send a 404 error.
3:19
So let's try that out.
3:23
Let's switch out our delete to get_or_404.
3:24
And let's scroll up, get_or_404.
3:30
And then that is a different one,
it's Pet.query.all,
3:42
so we'll leave that one for right now.
3:46
Okay, now let's test
this out in our browser.
3:52
So if we go to Blanca,
Blanca is pet two, and we find it.
3:57
If I try to do pet 20,
I get the error page, perfect.
4:04
Now, let's also try it with the edit page.
4:10
Edit, let's do edit 20, 404 and
4:16
let's try delete, 404 awesome.
4:20
You've learned a lot in this course.
4:27
So now it's time to practice on your own.
4:29
Check the teacher's notes for some
ideas for taking this website further.
4:31
And some ideas for other websites
you could create on your own.
4:36
Way to tackle flask was SQLAlchemy
basics Pythonistas.
4:40
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up