파이썬 관련 포스팅 목록
Jinja2
안녕하세요. 오늘은 이전에 포스팅 했던 Flask Web 서버에 Jinja2 템플릿을 사용하여 특정 엔드포인트로 접근하였을 때 고정적인 서식과 동적으로 변하는 변수의 값을 사용하여 클라이언트에게 출력해줄 것입니다. 만약 Flask 웹 서버 구성을 하지 않았다면 Flask 웹 서버 구성하기 포스팅 을 우선 살펴보고 이 포스팅을 읽어주세요. 우선 Jinja2가 무엇인지 알아야 합니다.
Jinja 템플릿은 Python Flask 패키지에 내장된 Template 엔진입니다. 개발자가 동적으로 변하는 웹 페이지를 쉽게 구현할 수 있도록 도와줍니다. 고정적으로 출력되어야 할 서식 html 코드가 존재하고 동적으로 변해야할 자리는 Jinja2 문법으로 비워둡니다. 이후 클라이언트가 웹 브라우저를 통해 엔드포인트에 접근하면 아까 비워둔 자리에 값을 설정하여 클라이언트에게 출력합니다. 이처럼 고정적인 행위와 변해야할 행위를 쉽게 할 수 있다는 장점이 있습니다.
자 그러면 Flask 웹 서버에서 Jinja2 템플릿을 사용하는 예제를 직접 해보겠습니다. 우선 오늘 포스팅에서 진행할 예제는 아래와같은 시험환경에서 진행하였습니다.
시험환경
Linux Ubuntu 16.04 LTS x64
Python 3.5
아이피: 172.16.3.58
Linux aav-cn-vmm 4.15.0-106-generic #107~16.04.1 Ubuntu SMP Thu Jun 4 15:40:05 U TC 2020 x86_64 x86_64 x86_64 GNU/Linux
Jinja2 설치
Jinja2 템플릿을 사용하기 위해서는 Python Jinja2 패키지를 설치해야 합니다. 아래 명령을 실행하여 패키지를 설치합니다.
$ pip3 install jinja2
Jinja 템플릿 디렉토리 생성
Jinja 템플릿을 사용하기 위해서는 우리가 구성한 Flask 웹 서버 모듈의 위치에 "templates" 라는 디렉토리를 반드시 생성해줘야 합니다. 그리고 이 templates 디렉토리 하위에는 우리가 실제 사용할 HTML 템플릿 파일들을 저장할 것입니다. 이전 포스팅에서 다룬 Flask 웹 서버 모듈인 app.py과 templates 폴더 위치를 표로 나타내면 아래와 같습니다.
./app.py
./templates
/test.j2
자 이제 템플릿 파일을 생성해보겠습니다. 우선 템플릿 파일이 쓰이는 목적과 어떻게 표시할것인지 알아야합니다.
Jinja 템플릿 파일 생성
클라이언트가 웹브라우저를 통해 엔드포인트에 접근하였을 때 현재 시간을 출력시키는 템플릿을 생성해보겠습니다.
여기서 중요한 것은 "Current Time : " 의 문자열은 절대 변하지 않는다는 것입니다. 저 문자열은 항상 그 자리에 고정으로 들어가고 단지 "시간" 값 만 바뀐다는 것을 알 수 있습니다. 이런 경우 사용하는게 Jinja 템플릿입니다. HTML의 서식을 고정으로 만들어놓고 저 값의 자리만 Python에서 처리해주면 됩니다. 템플릿 파일의 확장자는 j2로 설정하겠습니다.
현재 시간 알리미
Current Time : {시간} 입니다.
<html>
<head>
</head>
<body>
현재 시간 알리미<br>
Current Time : {{ current_time }} 입니다.
</body>
</html>
자 위와 같이 test.j2 문서를 작성하였을 때 특이한 부분이 있습니다. HTML 문법에서 {{, }} 와 같은 문법은 존재하지 않습니다. 저런 형식은 바로 jinja2 템플릿 문법입니다. HTML 문서를 렌더링 할때 "{{" 와 "}}" 사이에 있는 것은 변수명으로 판단하며 이는 Python에서 전달한 값을 참조합니다. 즉 "{{ current_time }}" 문구는 Python에서 전달한 current_time 값을 이곳에 써라 라는 말이 됩니다. 자 그렇다면 이제 우리가 이전 포스팅에서 구현했던 app.py을 수정하여 실제 current_time 값에 현재 시간의 값을 전달해야합니다. 만약 현재 시간을 구하는 "datetime" 파이선 패키지 를 설치하지 않았다면 pip3 명령을 통해 설치합니다.
$ vim app.py
현재 시간을 구하기 위해 datetime 모듈을 import하고 jinja2 템플릿을 사용하기 위해 render_template 모듈을 import 합니다. 이후 이전 포스팅에서 구현한 "/homepage" 엔드포인트를 수정하였으며 최종적으로 "return render_template('test.j2', current_time=now)" 구문으로 인해 클라이언트의 웹 브라우저에 우리가 생각했던 시나리오의 결과를 얻을 수 있습니다.
from flask import Flask, render_template
import datetime
app = Flask(__name__)
@app.route('/homepage')
def start_homepage():
now = datetime.datetime.now()
return render_template('test.j2', current_time=now)
app.run('0.0.0.0', port = 5010, threaded = True)
current_time=now 구문을 통해 현재 시간을 "current_time" 이라는 이름의 변수로 전달하고 있습니다. 이후 이 값은 j2 문서에서 읽어질 것입니다.
이제 결과를 확인해보겠습니다.
위와 같이 매번 클라이언트가 웹브라우저에 접속 할 때마다 "현재 시간"의 값만 바뀌고 있습니다. 이처럼 고정적인 내용와 동적인 값 변경이 필요할 때 사용하는것이 jinja2 템플릿입니다.
마무리
다음 포스팅에서는 더 자세한 예제를 통해 jinja 템플릿을 알아보겠습니다