개발 동기
Next.js를 사용해서 개발했던 프로젝트를 Flask와 Jinja2로 개발해보려고 합니다.
Flask와 Jinja2로 개발하게 되는 이유는 지원하고싶은 회사에서 해당 스택으로 개발을 하는 부분이 있다고 하여 이와 관련된 프로젝트를 포트폴리오로 만들고 싶어서 시작하게 되었습니다.
사실 이름만 들었을 때는 낯설었지만 Jinja2로 작성된 코드를 보니, 예전에 Express 프레임워크에서 ejs로 개발했던 것과 유사한 형태라서 크게 어렵게 느껴지지는 않았습니다.
Flask와 Jinja2란?
일단 설치에 대해서 설명하기 전에 가볍게 Flask와 Jinja2가 무엇인지 설명하고 넘어가보겠습니다.
Flask(공식 링크)는 쉽고 빠르게 사용할 수 있도록 설계된 Phtyon용 웹 애플리케이션 프레임워크이고,
Jinja(공식 링크)는 HTML 안에 파이썬 변수를 삽입하거나 조건문과 반복문을 사용할 수 있게 해주는 Python용 템플릿 엔진입니다.
*여담
Jinja라는 이름의 뜻이 궁금해서 찾아봤는데 일본의 '신사 사원' 또는 '사원(temple)'을 의미하고, '사원(temple)'과 '템플릿(template)'는 영어 발음이 유사하여 Jinja라는 이름을 선택한 것으로 보입니다.
출처 - https://jinja.palletsprojects.com/en/stable/faq/#why-is-it-called-jinja
코드는 아래와 같은 형식으로 작성할 수 있습니다.
<!DOCTYPE html>
<html>
<head>
<title>For Example</title>
</head>
<body>
<h2> Geeksforgeeks Available Course </h2>
{% for course in courses%}
<h4> {{course}} </h4>
{% endfor %}
</body>
</html>
Jinja2는 2008년 7월, Flask는 2010년 4월에 출시가 되었는데, 오래된 만큼 안정적인 기술이라고도 볼 수 있을 것 같습니다.
참고로 Flask는 어떤 회사에서 사용되었을까 궁금해서 찾아보었는데 과거 넷플릭스 기술 블로그(링크)에서 내부 개발 도구를 개발할 떄 사용한 것을 알 수 있었습니다.
설치하기
설치 방법은 간단합니다.
Jinja2는 Flask에 내장되어 있기 때문에 Flask만 설치하면 Jinja2가 함께 설치됩니다.
pip install flask
간단한 예제로 실행도 해보겠습니다.
먼저 프로젝트 폴더 안에 다음과 같이 간단하게 폴더 구조를 구성해줍니다.
- templates: 렌더링할 html 파일들을 저장하는 폴더
- app.py: Flask 앱을 실행시키는 파일로써, 라우팅, 템플릿 렌더링, DB 연결 등의 작업을 수행
app.py 코드는 아래와 같습니다.
from flask import Flask, render_template
# Flask 웹 애플리케이션 생성
app = Flask(__name__)
# 루트 경로로 접근했을 때
@app.route("/")
def home():
position = "프론트엔드"
return render_template("index.html", position=position)
if __name__ == "__main__":
app.run(debug=True) # Flask 애플리케이션 실행 및 디버그 모드 활성화
그리고 index.html 코드는 다음과 같습니다.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>Jinja2 Test</title>
</head>
<body>
<h1>안녕하세요, 저는 {{ position }} 개발자 입니다!</h1>
</body>
</html>
여기서 position은 app.py에서 전달한 position 값을 보여줍니다.
실행하기
이렇게 작성된 코드를 실행하기 위해서 app.py 파일이 위치한 경로에서 터미널에 다음 명령어를 입력합니다.
flask run --debug
# 또는
python app.py
를 실행시켜주면 아래와 같이 실행 화면과 함께 접속할 주소(http://127.0.0.1:5000)가 나타납니다.
접속해보면 아래와 같은 결과 화면이 나타납니다.
마무리
간단하게 Jinja2와 Flask를 사용하는 방법에 대해서 살펴봤습니다. 다음 글에서는 좀 더 편리한 환경에서 코드를 작성하기 위해 prettier와 eslint 설정하는 법에서 다뤄보겠습니다.
읽어주셔서 감사합니다! :)
댓글은 언제나 환영입니다 ☺️
참고
https://www.geeksforgeeks.org/python/templating-with-jinja2-in-flask/
'개발 지식 > Flask와 Jinja2' 카테고리의 다른 글
| Flask와 Jinja2로 개발하기 - (4) Flask로 작성한 코드 살펴보기(feat. Next.js) (0) | 2025.11.10 |
|---|---|
| Flask와 Jinja2로 개발하기 - (3) SCSS 사용하기 (0) | 2025.11.01 |
| Flask와 Jinja2로 개발하기 - (2) Prettier와 Black 설정하기 (0) | 2025.11.01 |