Product Features
Log in

Project 3: Portfolio: How to add error handling to a Flask app (+30, -1)

Start End

__init__.py (+5, -0)

From: curriculum/section12/lectures/10_add_error_handling_to_flask_app/start/portfolio/__init__.py

To: curriculum/section12/lectures/10_add_error_handling_to_flask_app/end/portfolio/__init__.py 

            
            index 936e351..bc9a8f7 100644
--- a/curriculum/section12/lectures/10_add_error_handling_to_flask_app/start/portfolio/__init__.py
+++ b/curriculum/section12/lectures/10_add_error_handling_to_flask_app/end/portfolio/__init__.py
@@ -55,3 +55,8 @@ def project(slug):
     if slug not in slug_to_project:
         abort(404)
     return render_template(f"project_{slug}.html", project=slug_to_project[slug])
+
+
+@app.errorhandler(404)
+def page_not_found(error):
+    return render_template("404.html"), 404

styles.css (+2, -1)

From: curriculum/section12/lectures/10_add_error_handling_to_flask_app/start/portfolio/static/css/styles.css

To: curriculum/section12/lectures/10_add_error_handling_to_flask_app/end/portfolio/static/css/styles.css 

            
            index 5d1ab8f..4312d5e 100644
--- a/curriculum/section12/lectures/10_add_error_handling_to_flask_app/start/portfolio/static/css/styles.css
+++ b/curriculum/section12/lectures/10_add_error_handling_to_flask_app/end/portfolio/static/css/styles.css
@@ -41,7 +41,8 @@ body {
   margin: 0 auto;
 }
 
-.main--about {
+.main--about,
+.main--error {
   flex-direction: column;
   max-width: 500px;
   padding: 0 1rem;

404.html (+23, -0)

From: curriculum/section12/lectures/10_add_error_handling_to_flask_app/end/portfolio/templates/404.html

To: curriculum/section12/lectures/10_add_error_handling_to_flask_app/end/portfolio/templates/404.html 

            
            new file mode 100644
index 0000000..f9d958a
--- /dev/null
+++ b/curriculum/section12/lectures/10_add_error_handling_to_flask_app/end/portfolio/templates/404.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <title>Bob Smith | Portfolio</title>
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap" rel="stylesheet">
+    <link rel="stylesheet" href="{{ url_for('static', filename='css/styles.css') }}" />
+</head>
+
+<body>
+    <main class="main main--error">
+        <h1>404 - Page Not Found</h1>
+        <p>
+            Sorry, we couldn't find the page you're looking for.
+            It may have been mis-spelled, or it doesn't exist anymore.
+        </p>
+        <a href="{{ url_for('home') }}">Go to home</a>
+    </main>
+</body>
+
+</html>