목차
파이썬을 다루다 보면 WebUI를 구축해야 할 필요가 있을 때가 많습니다. 백엔드 프로그래머들에게 웹이든 앱이든 UI와 관련한 개발은 낯설기도 하고 좀 복잡하게 느껴지기도 합니다. 사실, 그보다는 성가신 작업이라고 느끼는 경우가 더 많을 거예요. 하지만, 파이썬에서는 Flask(플라스크)라는 웹프레임워크로 간단하게 WebUI를 구축할 수 있습니다.
파이썬 Flask 구현하기
Flask(플라스크)는 파이썬으로 만든 ‘마이크로 웹 프레임워크’예요. 꼭 필요한 기능만 담아 가볍고, 우리가 원하는 대로 추가할 수가 있어요. 복잡한 설정 없이도 금방 웹 애플리케이션을 만들 수 있어요. 그래서 초보자도 쉽게 배울 수 있고, 전문가도 애용하는 프레임워크입니다.
플라스크를 쓰면 좋은 점이 또 있어요. 바로 자유로움이에요. 다른 프레임워크들은 이것저것 강제하는 게 많은데, 플라스크는 우리가 원하는 대로 구조를 짤 수 있어요. 마치 레고와 같은 블록처럼 필요한 기능을 하나씩 쌓아갈 수 있습니다.
개발 환경 설정
당연하게도 플라스크로 웹 개발을 시작하려면 먼저 개발 환경을 준비해야 합니다. 먼저, 파이썬이 컴퓨터에 설치되어 있어야 해요. 파이썬 공식 홈페이지에서 최신 버전을 내려받아 설치하면 돼요. (이하 윈도우 환경을 전제로 설명합니다.)
파이썬 패키지들은 pip라는 명령을 통해 설치할 수 있습니다. 만일 자신의 시스템에 pip가 설치되지 않았다면 pip부터 설치해야 합니다. 다음과 같은 명령어를 cmd에 입력하여 pip 설치합니다.
python get-pip.py그런 후 pip 최신 버전으로 업그레이드를 합니다. 이 업그레이드 명령은 다른 패키지 설치 전 항상 수행한다고 생각하시게 좋아요. 가끔 pip 버전에 낮아서 패키지가 잘 설치되지 않는 경우도 있으니 항상 먼저 한번 수행해 보는 게 편합니다.
python -m pip install --upgrade pip그다음은 플라스크를 설치할 차례예요. 명령 프롬프트(윈도우)나 터미널(맥, 리눅스)을 열고 다음 명령어로 플라스크 패키지를 설치합니다.
pip install flask이렇게 하면 플라스크가 설치돼요. 쉽죠?
플라스크 패키지가 잘 설치되었는지 확인해 봐야죠. cmd를 열고 다음을 입력해 보세요.
python #파이썬을 실행하는 거예요.
>>> import flask #파이썬이 실행되고 cmd에서 코드를 입력해 보는 거예요.
>>> flask.__version__이제 플라스크를 사용할 준비가 끝났어요. 간단한 예제로 플라스크가 잘 설치됐는지 확인해 볼게요. 텍스트 편집기나 VScode를 열고 다음 코드를 입력해 보세요.
from flask import Flask
app = Flask(__name__)
@app.route('/')
def hello():
return "안녕하세요, 플라스크의 세계에 오신 것을 환영합니다!"
if __name__ == '__main__':
app.run(debug=True)이 코드를 ‘app.py’라는 이름으로 저장하고, 명령 프롬프트나 터미널에서 다음 명령어를 실행해 보세요.
python app.py웹 브라우저를 열고 주소창에 ‘http://localhost:5000’을 입력하면, “안녕하세요, 플라스크의 세계에 오신 것을 환영합니다!”라는 메시지를 볼 수 있을 거예요.
앞서 플라스크 예시 코드에서 포트 번호는 특정하지 않았기 때문에 기본 5000번 포트를 사용하는 거예요. 만일 포트 번호를 변경하고 싶다면 다음과 같이 코드를 수정할 수 있어요.
if __name__ == '__main__':
app.run(host='0.0.0.0', port=8080, debug=True)위와 같이 port=8080으로 하면 포트 번호는 5000번에서 8080번으로 변경하게 됩니다.
라우팅 URL 설정
웹 개발에서 ‘라우팅’이란 무엇일까요? 쉽게 말해, 웹 주소(URL)와 그 주소에서 실행될 파이썬 함수를 연결하는 작업이에요. 플라스크에서는 이 작업이 정말 쉽답니다.
플라스크에서 라우팅을 하는 방법은 간단해요. ‘@app.route()’ 데코레이터를 사용하면 돼요. 이게 무슨 말인지 예제를 통해 알아볼게요.
from flask import Flask
app = Flask(__name__)
@app.route('/')
def home():
return "환영합니다! 여기는 홈페이지입니다."
@app.route('/about')
def about():
return "이곳은 소개 페이지입니다."
@app.route('/contact')
def contact():
return "연락처: admin@example.com"
if __name__ == '__main__':
app.run(debug=True)이 코드에서 ‘@app.route(‘/’)’는 웹사이트의 루트 주소(예: http://example.com/)를 의미해요. 누군가 이 주소로 접속하면 바로 아래에 있는 ‘home()’ 함수가 실행되죠.
마찬가지로 ‘example.com/about’이나 ‘example.com/contact’ 주소로 접속하면 각각 ‘about()’과 ‘contact()’ 함수가 실행됩니다. 앞서 URL이라고 했던 의미가 이해되실 거예요..
라우팅에는 더 재미있는 기능들이 있어요. 예를 들어, 동적 라우팅이라는 거예요.
@app.route('/user/<username>')
def show_user_profile(username):
return f"안녕하세요, {username}님!"이렇게 하면 ‘/user/영희’로 접속하면 “안녕하세요, 영희 님!”이라고 표시되고, ‘/user/철수’로 접속하면 “안녕하세요, 철수님!”이라고 표시됩니다. 재미있지 않나요? 사용자 입력에 따라 또는 어떤 다양한 값들에 따라 자유롭게 설정할 수 있어요.
템플릿, 동적 웹 페이지
지금까지는 간단한 문자열만 반환했지만, 실제 웹사이트는 이것보다 훨씬 복잡하죠. HTML, CSS, JavaScript 등을 사용해야 할 때가 많습니다. 플라스크에서는 이를 위해 ‘템플릿(templates)’이라는 걸 사용해요.
템플릿은 뼈대가 되는 HTML 파일이에요. 여기에 파이썬 코드로 동적인 내용을 채워 넣을 수 있죠. flask는 Jinja2라는 템플릿 엔진을 사용해요.
먼저, ‘templates’라는 폴더를 만들고 그 안에 ‘hello.html’이라는 파일을 만들어보세요.
<!DOCTYPE html>
<html>
<head>
<title>인사 페이지</title>
</head>
<body>
<h1>안녕하세요, {{ name }}님!</h1>
<p>오늘은 {{ date }}입니다.</p>
</body>
</html>이제 이 템플릿을 사용하는 플라스크 코드를 볼까요?
from flask import Flask, render_template
from datetime import datetime
app = Flask(__name__)
@app.route('/hello/<name>')
def hello(name):
today = datetime.now().strftime("%Y년 %m월 %d일")
return render_template('hello.html', name=name, date=today)
if __name__ == '__main__':
app.run(debug=True)이 코드에서 ‘render_template’ 함수가 중요해요. 이 함수는 ‘hello.html’ 템플릿을 불러와서 ‘name’과 ‘date’ 변수에 값을 채워 넣어요.
템플릿에서 ‘{{ }}’로 둘러싸인 부분은 파이썬 변수가 들어갈 자리예요. 예를 들어, ‘/hello/영희’로 접속하면 “안녕하세요, 영희 님!”이라고 표시되겠죠.
Jinja2는 더 많은 기능을 제공해요. 예를 들어, 조건문이나 반복문도 사용할 수 있어요:
<ul>
{% for item in items %}
<li>{{ item }}</li>
{% endfor %}
</ul>이렇게 하면 파이썬에서 전달한 ‘items’ 리스트의 모든 항목을 표시할 수 있어요.
템플릿을 잘 활용하면 동적이고 인터랙티브 한 웹 페이지를 쉽게 만들 수 있어요.
자, 여기까지만 이해해도 간단한 WebUI를 구축하기는 어렵지 않을 겁니다. 이전 글에서도 오늘은 플라스크에 대해 간단하게 살펴봤습니다.
아래 관련 글도 참고해 보세요.