LEARN

파이썬 웹 프레임워크 Flask

 
Contents
  1. 파이썬 웹 프레임워크 Flask

파이썬 웹 프레임워크 Flask

Flask 사용법

html에서 파이썬을 사용하기 위해서 Flask라는 웹 프레임워크를 설치해야한다. 터미널에서 pip install flask 명령어로 Flask를 설치할 수 있다. Flask는 Jinja2라는 템플릿 엔진을 기반으로 하고 있다. 다음의 간단한 예제로 Flask의 동작 원리를 파악해 보자.

 

from flask import Flask
app = Flask(__name__)

@app.route("/hello") 
def hello():
    return "Hello World!"

@app.route("/bye")
def bye():
    return "Bye!!"

if __name__ == "__main__":
    app.run(host="0.0.0.0",port=3500 ) #0.0.0.0 :
1.Flask를 import한다.

from flask import Flask

Flask를 사용하기 위해서는 라이브러리를 import 해야한다. 만약 import가 되지 않는다면 설치가 되지 않았거나 환경변수가 제대로 잡히지 않은 것이니 확인하길 바란다.

2.Flask 객체를 생성한다.

app = Flask(__name__)

Flask 객체를 생성하여 app이라는 변수에 담아준다.

3.Flask 객체의 경로 설정한다.

@app.route("/hello")

4.’/hello’ 경로에 사용할 함수를 만들어준다.

def hello(): return "Hello World!"

5.조건 설정 후 서버를 실행시킨다.

if __name__ == "__main__": app.run(host="0.0.0.0",port=3500 )

‘__name__’이면 3500번 포트에서 모든 IP를 받아 서버를 실행하라.

Flask 예제

파이썬 웹 프레임워크 구조

python

static 폴더 : html, css 등의 동적인 파일 

templates 폴더 : 템플릿 엔진 진저2가 인식할 수 있는 파일

router.py : controller

python

하단의 언어 모드 선택에서 Django HTML을 일반 HTML로 변경하면 자동 완성 기능을 사용할 수 있습니다. html 파일의 경우 ‘ ! ‘을 적고 enter 키를 누르면 html 구조가 자동으로 생성됩니다.

영화 데이터(json)를 Flask를 사용하여 웹에 바인딩하기

movie_api.py : 영화 데이터를 불러오기 위한 파일.

router.py : [Controller]요청한 뷰를 분기하기 위한 제어 파일.

index.html : 데이터 바인딩하기 위한 파일

import requests

def callMovieApi(page=1):

    url = f'''
        https://yts.mx/api/v2/list_movies.json?sort_by=rating&page_number={page}&limit=20
    '''
    response = requests.get(url)

    responseDict = response.json() # 딕셔너리 타입으로 변환
    movies = responseDict["data"]["movies"] # movies : List타입 
    return movies

from flask import Flask
from flask import render_template #파일을 리턴하기 위한 라이브러리
import movie_api as ma

app = Flask(__name__)

@app.route("/")
def index():
    return render_template("index.html",movies=ma.callMovieApi()) 
    #파이썬에 html로 만들어도 됨  prifix가 잡혀있다  suffix는 적어줘야함 

if __name__ == "__main__":
    app.run(debug=True) #debug=True : 리로드 ,서버 재시작할 필요없음
<!DOCTYPE html>
<html lang="en">

<head>
    <title>영화리스트</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>

    <style>
        .m_box {
            display: grid;
            grid-template-columns: 1fr 1fr 1fr;
            grid-gap: 10px;
        }

        .m_tm_20 {
            margin-top: 20px;
        }
    </style>
</head>

<body>

    <div class="container m_box m_tm_20">

      {% for movie in movies%}
        <!-- 영화 카드 시작 -->
        <div class="card">
            <img class="card-img-top" src="{{movie.medium_cover_image}}" alt="Card image" style="width:100%">
            <div class="card-body">
                <h4 class="card-title">{{movie.title}}</h4>
                <p class="card-text">{{movie.rating}}</p>
                <a href="#" class="btn btn-primary">상세보기</a>
            </div>
        </div>
        <!-- 영화 카드 끝 -->
        {% endfor %}

    </div>

</body>

</html>
결과화면
python

 

Class를 만들어서 필요한 데이터만 사용하기
from movie_model import MovieModel
import requests

def callMovieApi(page=1):

    url = f'''
        https://yts.mx/api/v2/list_movies.json?sort_by=rating&page_number={page}&limit=20
    '''
    response = requests.get(url)

    responseDict = response.json() # 딕셔너리 타입으로 변환
    movies = responseDict["data"]["movies"] # movies :  List타입 
    return convert_model(movies)

def convert_model(movies):
    list=[]

    for movie in movies:
        movie_model = MovieModel(movie["title"], movie["rating"], movie["medium_cover_image"])
        list.append(movie_model)

    print(list)
    return list

from flask import Flask
from flask.templating import render_template #파일을 리턴하기 위한 라이브러리
import movie_api as ma

app = Flask(__name__)

@app.route("/")
def index():
    return render_template("index.html", movies=ma.callMovieApi()) 
    #파이썬에 html로 만들어도 됨  prifix가 잡혀있다  suffix는 적어줘야함 

if __name__ == "__main__":
    app.run(debug=True) #debug=True : 리로드 ,서버 재시작할 필요없음   

class MovieModel:
    def __init__(self, title, rating, medium_cover_image):
        self.title = title
        self.rating = rating
        self.medium_cover_image = medium_cover_image

<!DOCTYPE html>
<html lang="en">

<head>
    <title>영화리스트</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>

    <style>
        .m_box {
            display: grid;
            grid-template-columns: 1fr 1fr 1fr;
            grid-gap: 10px;
        }

        .m_tm_20 {
            margin-top: 20px;
        }
    </style>
</head>

<body>

    <div class="container m_box m_tm_20">

      {% for movie in movies %}
        <!-- 영화 카드 시작 -->
        <div class="card">
            <img class="card-img-top" src="{{movie.medium_cover_image}}" alt="Card image" style="width:100%">
            <div class="card-body">
                <h4 class="card-title">{{movie.title}}</h4>
                <p class="card-text">{{movie.rating}}</p>
                <a href="#" class="btn btn-primary">상세보기</a>
            </div>
        </div>
        <!-- 영화 카드 끝 -->
        {% endfor %}

    </div>

</body>

</html>

 

RELATED POST