Create a Dynamic Blog with Django 5 and Supabase: Part 2
Written on
Chapter 1: Setting Up Views
In the previous section, we established a connection to our database. Now, we will create views to display our blog posts.
Section 1.1: List View
To present the posts, they must be marked as published, and their publication date should be in the past.
from django.http import Http404
from django.shortcuts import render, get_object_or_404
from django.utils import timezone
from .models import Post
def posts_view(request):
posts = Post.objects.filter(publish__lte=timezone.now(), status=Post.Status.PUBLISHED)
return render(request, 'blog/post/list.html', {'posts': posts})
Section 1.2: Detail View
It’s essential to manage scenarios where a post might not be found by its ID. We will focus on retrieving only those posts that are published.
def posts_detail(request, id):
try:
post = get_object_or_404(Post, id=id, status=Post.Status.PUBLISHED)except Post.DoesNotExist:
raise Http404(f'Post [{id}] not found')
return render(request, 'blog/post/detail.html', {'post': post})
Section 1.3: Registering Views
Next, we will register our URLs. Instead of doing this in the main application, we will handle it within the blog app. This practice promotes better organization and clarity, especially as more applications are integrated in the future. Utilizing app_name helps in grouping URLs logically.
from django.urls import path
from . import views
app_name = 'blog'
urlpatterns = [
path('', views.posts_view, name='posts_view'),
path('<int:id>/', views.posts_detail, name='post_detail'),
]
Section 1.4: Integrating Views into the App
We won’t register each URL individually. Instead, we will include all blog URLs at once.
from django.contrib import admin
from django.urls import path, include
urlpatterns = [
path('admin/', admin.site.urls),
path('blog/', include('blog.urls', namespace='blog'))
]
Chapter 2: Designing Templates
We need to create a templates directory within the blog folder, structured as follows: blog/templates/blog/post/. The base layout will be in the blog folder, while detail.html and list.html will be inside the post folder.
Section 2.1: Base Layout
Creating a base layout is a good practice, allowing us to include CSS and JavaScript that all pages will utilize. Frameworks like Bootstrap can be included here to avoid redundancy in the HTML files.
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
{% block title %}{% endblock %}
<link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}">
</head>
<body>
<header>
<h1>Welcome to My Blog</h1></header>
<div class="container">
{% block content %}
{% endblock %}
</div>
</body>
</html>
Section 2.2: List View Template
The first line indicates that we are extending base.html. This file will include two blocks: title and content, allowing for easy content management.
{% extends "blog/base.html" %}
{% block title %}Epic Blog{% endblock %}
{% block content %}
<h2>Posts</h2>
<ul>
{% for post in posts %}
<li>
<a href="{% url 'blog:post_detail' post.id %}">{{ post.title }}</a>
<p>Published {{ post.publish }} by {{ post.author }}</p>
<p>{{ post.body|truncatewords:30|linebreaks }}</p>
</li>
{% endfor %}
</ul>
{% endblock %}
Section 2.3: Detail View Template
This template also extends base.html and incorporates Bootstrap button classes. The inclusion of Bootstrap is facilitated by extending the base layout.
{% extends "blog/base.html" %}
{% block title %}{{ post.title }}{% endblock %}
{% block content %}
<a href="{% url 'blog:posts_view' %}" class="btn btn-primary">Back</a>
<h2>{{ post.title }}</h2>
<p>Published {{ post.publish }} by {{ post.author }}</p>
<p>{{ post.body | linebreaks }}</p>
{% endblock %}
Section 2.4: Testing the Application
To verify that everything is functioning correctly, navigate to http://localhost:8000/blog/ to view the list of posts. Ensure that the back button operates effectively. If no posts are available, you can add them through the admin interface.
This video walks you through building a stunning blog application using Django 5.x.
In this tutorial, you will learn the essentials of creating a blog with Django and Supabase.
Thank you for reading my article! If you enjoyed it and wish to join our expanding community, please follow me. Your comments and feedback are always appreciated!