본문 바로가기

Pyhon/Django

[Pyhon/Django] 장고 기초#010. 장고 쿼리셋과 템플릿을 이용한 동적 HTML 문서 작성

동적 데이터를 컨텍스트에 전달

views.py에서 post_list에 대한 뷰를 다시 정의합니다. 이전 문서에서 인터렉티브 콘솔에서 다뤘던 쿼리셋을 파이썬 장고 소스 코드에서도 사용 할 수 있습니다.

from django.shortcuts import render
from django.utils import timezone

from .models import Post

def post_list(request):
    posts = Post.objects.filter(published_date__lte=timezone.now()).order_by('published_date')
    return render(request, 'blog/post_list.html', { 'posts': posts })

objects.filter() 쿼리셋을 이용하여 Post 모델에 대한 데이터 리스트를 컨텍스트에 전달하고 있습니다. 필터링되는 데이터는 published_date 필드가 현재 시간보다 이전 값(__lte=timezone.now())인 경우입니다. 즉, 요청 시간 이전에 작성된 모든 Post를 필터합니다. published_date__lte 구문은 ORM 사용에 대한 규칙이며, 접두사로 필드(published_date)와 접미사 __lte(보다 작다)의 결합으로 사용합니다.

구분 접두사 접미사
필드 ORM
예시 published_date __lte

다른 ORM 접미사를 사용하면 필드에 필터링 조건을 더 다양화 할 수 있습니다. 그리고 필터링 이후에 Chaining 되는 쿼리셋은 published_date에 대해서 오름차순으로 정렬합니다. order_by() 쿼리셋 인자에 필드 이름으로 앞에 '-'를 붙이게 되면 내림차순으로 정렬 할 수도 있습니다. 이 경우 예시에서는 order_by('-published_date')가 됩니다.

이로써 뷰 컨텍스트에 동적 데이터를 포함시켰습니다. 다음으로 해당 컨텍스트를 사용하여 템플릿을 작성하도록 하겠습니다.

템플릿 작성 및 HTML 문서 렌더링 결과 확인

post_list.html 파일을 다음과 같이 수정합니다. 이전 문서에서 처럼 장고 템플릿이 제공하는 for 구문을 사용하며, 컨텍스트에 포함되어 있는 동적 데이터를 접근하기 위해서 'posts'에 접근하고 있습니다. for 구문의 각 post 엘리멘트는 JSON 포멧으로 구성되어 있고, (post.필드 이름)으로 객체 기준 멤버 변수에 접근 할 수 있습니다. 그 외에는 html 구문을 그대로 사용하고 잇습니다.

<html>
    <h1>Blog post list</h1>
    <ul>
        {% for post in posts %}
        <li>
            <div>
                <p>published : {{ post.published_date }}</p>
                <h1><a href="">{{ post.title }}</a></h1>
                <p>{{ post.text|linebreaksbr }}</p>
            </div>
        </li>
        {% endfor %}
    </ul>
</html>

파이프(|)에 이어지는 linebreaksbr 역시 장고에 내장 된 템플릿 코드 중 하나입니다. linebreaks+br의 합성어이며, 문단(Paragraph tag, <p>) 내부 개행에 대해서 <br />으로 처리합니다. 가령 post.text의 값이 "이 문장은\n개행됩니다."인 경우, 장고 템플릿에 의해서 "이 문장은<br />개행됩니다."로 렌더링됩니다. 이제 해당 뷰에 대한 요청(http://127.0.0.1:8000/)을 보내면 아래와 같이 Post 모델에 대한 데이터를 우리가 작성한 템플릿 코드에 따라서 출력되는 것을 확인 할 수 있습니다.

이 상태에서 인터렉티브 콘솔에 접근하여 새로운 Post 객체를 생성 쿼리셋(create)을 실행하고, 웹 브라우저를 새로고침하면 실시간, 동적으로 반영되는 것 역시 확인 할 수 있습니다.