The Course App — Part 2

Updating our templates to extend the base template

Want more?

This lesson for enrolled students only. Join the course to unlock it!

You can see the code changes implemented in this lecture below.

If you have purchased the course in a different platform, you still have access to the code changes per lecture here on Teclado. The lecture video and lecture notes remain locked.

Join course for $15

Modified files

templates/app/home.html

--- 
+++ 
@@ -1,16 +1,10 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Djangocourse</title>
-</head>
-<body>
+{% extends "app/base.html" %}
+
+{% block content %}
   <h1>Articles</h1>
   <ul>
     {% for article in articles %}
       <li>{{ article.title }} with {{ article.word_count }} words.</li>
     {% endfor %}
   </ul>
-</body>
-</html>+{% endblock content %}

templates/app/article_update.html

--- 
+++ 
@@ -1,16 +1,10 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Create article</title>
-</head>
-<body>
+{% extends "app/base.html" %}
+
+{% block content %}
   <h1>Edit Article</h1>
   <form method="POST">
     {% csrf_token %}
     {{ form.as_p }}
     <button type="submit">Save</button>
   </form>
-</body>
-</html>+{% endblock content %}

templates/app/article_create.html

--- 
+++ 
@@ -1,16 +1,10 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Create article</title>
-</head>
-<body>
+{% extends "app/base.html" %}
+
+{% block content %}
   <h1>Create Article</h1>
   <form method="POST">
     {% csrf_token %}
     {{ form.as_p }}
     <button type="submit">Save</button>
   </form>
-</body>
-</html>+{% endblock content %}

templates/app/article_delete.html

--- 
+++ 
@@ -1,16 +1,10 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Create article</title>
-</head>
-<body>
+{% extends "app/base.html" %}
+
+{% block content %}
   <h1>Delete Article</h1>
   <p>Are you sure you want to delete "{{ article.title }}"?</p>
   <form method="POST">
     {% csrf_token %}
     <button type="submit">Delete</button>
   </form>
-</body>
-</html>+{% endblock content %}