Django 동적 웹 페이지

이전 포스팅에서 템플릿 상속을 통해 부모 템플릿으로부터 html 요소를 상속받고 상속받지 않은 내용은 block 영역을 채워넣는 방법을 배웠다. 그런데 만약 웹 페이지 수가 더 많아진다면? 모든 페이지에 대한 html 요소를 하나하나 채워넣는 하드코딩의 방식은 우리를 괴롭게 할 것이다. 따라서 본 포스팅에서는 동적 웹 페이지를 구현하는 방법을 설명할 것이다.

---

동적 웹 페이지는 어떻게 작동하나요?

MVT 구조를 살펴보면 장고는 유저의 url 요청에 따라 view를 확인하고, view의 함수를 호출하여 model에 접근한다. model을 통해 데이터베이스에 접근한 view는 데이터베이스를 가공하여 template에 전달하고 template은 가공된 데이터를 품은 채 화면에 렌더된다.

URL 요청 > view > 함수 호출 > model > db접근 >
db가공 > db를 template에 전달 > template 렌더 > 화면

---

날짜 변경

이전 포스트에서 작성한 자식 템플릿에서 하드코딩된 날짜 부분을 데이터 호출을 통해 동적으로 변경되는 기능을 추가한다.

{% block date-block %}  
	<div>2023년 12월 26일</div>  📌하드코딩된 날짜
{% endblock date-block %}

{% block container %}  
	<div>
      <h2>평화로운 마을의 아침</h2>
      <img src="images/flower.jpg">
      <p>
        어느 평화로운 마을의 이른 아침, 새들의 지저귐이 부드럽게 울려 퍼지며,<br>
        햇살이 창문을 통해 스며들어 온 방을 환하게 밝혀줍니다.<br>
        사람들은 잠에서 깨어나 하루를 시작하고, 아이들은 학교로 가는 길에 즐겁게 뛰어놉니다.<br>
        마을 곳곳에서는 사람들이 서로 인사를 나누며, 작은 가게들은 아침 준비를 시작합니다. <br>
        모든 것이 평온하고, 마음은 기쁨으로 가득 차 있습니다.
      </p>
	</div>
{% endblock container %}

---

views.py 파일 변경

view.py 파일에서 datetime 모듈을 이용해 오늘 날짜를 가져오는 로직을 추가한다.

from django.shortcuts import render
from django.http import HttpResponse
from datetime import datetime  📌datetime 모듈의 datetime 함수를 불러오는 코드
    
def index(request):
	today = datetime.today().date()  📌today에 오늘의 날짜를 불러오는 함수의 결과값을 지정
	return render(request, 'APP1/index.html')

이후 context 변수를 사전형으로 지정하고, 키는 date, 값은 today로 지정한다.

from django.shortcuts import render
from django.http import HttpResponse
from datetime import datetime
    
def index(request):
	today = datetime.today().date()  
    context = {"date" : today}  📌context 변수를 사전형으로 지정하고, today를 date 키의 값으로 지정
	return render(request, 'APP1/index.html')

이후 render 함수의 세 번째 파라미터로 context변수를 context와 매칭시켜 넘겨준다

from django.shortcuts import render
from django.http import HttpResponse
from datetime import datetime
    
def index(request):
	today = datetime.today().date()  
    context = {"date" : today}
	<return render(request, 'APP1/index.html', context=context)  📌

이렇게 하면 오늘의 날짜를 today에 저장하고, 저장된 today를 사전형 자료인 context의 키 date의 값에 저장하고, 사전형 자료인 context를 context에 매칭해 APP1/index.html에 전달한다. 따라서 index.html 템플릿에서는 템플릿 변수인 {{ date }} 또는 {{ context.date }}를 통해 today 즉, 오늘의 날짜 데이터를 사용할 수 있다.

---

index.html 파일 변경

index.html을 다시 살펴보고 하드코딩된 날짜를 변경한다.

{% block date-block %}  
	<div>2023년 12월 26일</div>  📌하드코딩된 날짜
{% endblock date-block %}

{% block container %}  
	<div>
      <h2>평화로운 마을의 아침</h2>
      <img src="images/flower.jpg">
      <p>
        어느 평화로운 마을의 이른 아침, 새들의 지저귐이 부드럽게 울려 퍼지며,<br>
        햇살이 창문을 통해 스며들어 온 방을 환하게 밝혀줍니다.<br>
        사람들은 잠에서 깨어나 하루를 시작하고, 아이들은 학교로 가는 길에 즐겁게 뛰어놉니다.<br>
        마을 곳곳에서는 사람들이 서로 인사를 나누며, 작은 가게들은 아침 준비를 시작합니다. <br>
        모든 것이 평온하고, 마음은 기쁨으로 가득 차 있습니다.
      </p>
	</div>
{% endblock container %}

여기서 하드코딩 된 2023년 12월 26일 을 템플릿 변수로 변경해 오늘의 날짜 데이터에 접근한다.

{% block date-block %}  
	<div>{{date}}</div>  📌템플릿 변수로 변경해 오늘의 날짜(today) 호출
{% endblock date-block %}

{% block container %}  
	<div>
      <h2>평화로운 마을의 아침</h2>
      <img src="images/flower.jpg">
      <p>
        어느 평화로운 마을의 이른 아침, 새들의 지저귐이 부드럽게 울려 퍼지며,<br>
        햇살이 창문을 통해 스며들어 온 방을 환하게 밝혀줍니다.<br>
        사람들은 잠에서 깨어나 하루를 시작하고, 아이들은 학교로 가는 길에 즐겁게 뛰어놉니다.<br>
        마을 곳곳에서는 사람들이 서로 인사를 나누며, 작은 가게들은 아침 준비를 시작합니다. <br>
        모든 것이 평온하고, 마음은 기쁨으로 가득 차 있습니다.
      </p>
	</div>
{% endblock container %}

---

context=context에 대한 의문

본 포스팅의 내용을 읽다보면 다음과 같은 의문이 생길 수 있다.
1. context=context는 무슨 의미일까?
2. datetime.today().date()를 today에 지정했으면 그냥 today만 넘겨주면 되는게 아닌가
3. 왜 context를 사전형으로 생성하고, date라는 키에 today를 값으로 지정하지?

가장 먼저 context를 변수 context와 render 함수의 파라미터 context로 구분하겠다.
view의 함수는 템플릿에 데이터를 전달할 때 사전형에 담아서 전달해야 한다. 따라서 datetime.today().date()의 결과를 today 변수에 저장하고, 사전형 자료인 변수 context의 date 키에 대한 값으로 저장한다.

2번, 3번 의문에 대한 답은 나왔다. 그렇다면 context=context는 도대체 무슨 의미일까? 이는 옵셔널 파라미터를 생각하면 된다. render 함수는 아래와 같이 request와 template_name을 필수 파라미터로 하고 context, content_type, status, using을 옵셔널 파라미터로 두고 있다.

render(request, template_name, context=None, content_type=None, status=None, using=None)

옵셔널 파라미터는 인자를 전달할 때 생략해도 되는 파라미터이며, 생략하면 기본값을 파라미터에서 정의한 값으로 한다. 따라서 render의 옵셔널 파라미터는 기본값을 모두 None로 한다. 만약 우리가 render 함수를 이용할때 context는 지정하지 않고 content_type만 지정한다면 코드를 어떻게 작성해야 할까?

render(request, /index.html, abc)
render(request, /index.html, content_type=abc)

첫 번째로 작성된 코드는 abc가 세 번째 파라미터 즉, context 파라미터의 인자로 들어가기 때문에 두 번째 코드처럼 content_type을 지정하여 abc 인자를 넘겨주어야 한다.
context=context도 이와 같다. render 함수의 파라미터 context를 지정하여 변수 context를 넘겨주기 위함이다.

context=context
(render 함수의 파라미터)=(변수)

---