[항해99 사전준비] 웹개발종합반 4주차

Flask

python으로 서버를 쉽게 만들 수 있도록 돕는 프레임워크.

프레임워크란?

남들이 만들어놓은 규칙이나 틀에서 제공하는 편리기능들을 사용하면서 작업할 수 있는 공간(혹은 도구).
라이브러리는 프레임워크랑 다르게, 평소처럼 규칙이나 틀의 제약없이 작업할 수 있음.

(회사에선 '프레임워크입니다!' 라는데, 유저는 '이건 라이브러리지 않나요?' 라는 경우도 있는 것 같다..)

사용법

basic form

from flask import Flask
app = Flask(__name__)

@app.route('/')
def home():
   return 'hello world'

if __name__ == '__main__':
   app.run('0.0.0.0',port=5000,debug=True)

__name__ ?
__name__ 은 파이썬에서 내부적으로 사용하는 특별한 변수 입니다. 보통 __name__의 값을 출력 하면 모듈의 이름을 뜻하는데 만약 실행이 되는 .py 모듈은 __main__ 으로 나옵니다.

Flask app에서는 시스템에서 경로를 설정하기 위한 위치(리소스를 찾는데 사용)를 알기 위해 사용 합니다. 또 디버깅 정보등에도 사용 됩니다.

단일 모듈을 사용 할 때는 따로 지정 하지 않고 __name__ 을 사용 하면 되지만 패키지 형태로 사용 할 경우 패키지 이름을 직접 써줘야 합니다.

단일 모듈: app = Flask(__name__)
패키지 형태: app = Flask('application 명 지정')

출처: https://wings2pc.tistory.com/entry/웹-앱프로그래밍-파이썬-플라스크Python-Flask [Wings on PC]

__main__ ?
다른 언어에서 main entry point(진입점) 로 표현되며, 파이썬에서도 python app.py 로 실행이 되면 app.py 의 코드는 entry point가 되어 __name__ 의 값은 __main__이 됩니다. 즉 프로그램의 시작점이라고 볼수 있습니다.

여기서도 우리는 python app.py 로 실행 시키기 때문에 __name__에는 __main__ 이 들어가므로, app.run() 이 실행이 되는 것을 알수 있습니다. 만약 app.py 을 외부 모듈로 사용 되는 경우면 __name__ 은 app이라는 이름으로 나오게 되어 app.run() 은 실행이 되지 않습니다.

출처: https://wings2pc.tistory.com/entry/웹-앱프로그래밍-파이썬-플라스크Python-Flask [Wings on PC]

@?
데코레이터(decorator): 파이썬에서 기본적으로 사용되는 기술로, 함수 내의 추가적인 작업들을 간단하게 사용 가능하도록 도와주는 기술입니다. Flask 동작 원리는 복잡하지만 데코레이터 함수에 구현해서 복잡성을 숨기고 간단하게 사용 할 수 있게 합니다.

출처: https://wings2pc.tistory.com/entry/웹-앱프로그래밍-파이썬-플라스크Python-Flask [Wings on PC]

HTML Response

1. 프로젝트 폴더안에 templates, static 폴더 생성.
2. templates 폴더 안에 html 파일 생성.
3. static 폴더 안에 css, js 파일 생성.
4. render_template importing.

from flask import Flask, render_template
app = Flask(__name__)

@app.route('/')
def home():
   file_name = 'index.html'
   return render_template(file_name)

if __name__ == '__main__':
   app.run('0.0.0.0',port=5000,debug=True)

• templates 라는 단어와 일치하는 폴더에서 render_template의 인자로 넣어준 파일 이름을 찾아 response해주는 방식.

Request Receiving

1. request, jsonify importing.
2. @app.route 2번째 인자에 methods 추가.

from flask import Flask, request, jsonify
app = Flask(__name__)

@app.route('/')
def home():
   return 'hello world'
   
@app.route('/test', methods=['GET', 'POST'])
def test():
   if request.method == 'GET':
      title_receive = request.args.get('title_give')
      print(title_receive)
      return jsonify({'result':'success', 'msg': '이 요청은 GET!'})
   elif request.method == 'POST':
      title_receive = request.form['title_give']
      print(title_receive)
      return jsonify({'result':'success', 'msg': '이 요청은 POST!'})
   
if __name__ == '__main__':
   app.run('0.0.0.0',port=5000,debug=True)

• request.args.get() 을 이용해 query data를 가져올 수 있다.
• request.args['title_give'] 를 사용해도 된다.
• 여러 query를 가져올 때, request.args.to_dict() 를 받아서 쓰면 된다.
• request.form 역시 to_dict() 메소드를 이용해 dictionary로 변환할 수 있다.

🧐 여러 query를 가져오고 싶은 경우

# 바이트 문자열 형태의 query string을 decoding.
queries = request.query_string.decode('ascii')

# dict 형태로 변환
queries_dict = dict(query.split("=") for query in queries.split("&"))

# 퍼센트 문자열의 경우, urllib 패키지를 이용해 decoding 해주면 된다.
import urllib
urllib.parse.unquote("%EB%B4%84%EB%82%A0%EC%9D%80%EA%B0%84%EB%8B%A4")

(위의 취소선들은 삽질의 흔적이다..)

API 설계 및 과정

풀스택 개발을 한다고 가정했을 때, 정해진 순서는 없지만 백엔드 -> 프론트엔드 순서로 개발할 것을 권장하고 있다.

특히 백엔드에서도 API 설계가 우선적으로 이루어져야한다.

강의에서 진행한 나홀로메모장 프로젝트에서 설계과정은 다음과 같다.

1. 서비스에 필요한 기능
   • url, comment를 작성해서 넘겨주면 데이터를 DB에 저장.
   • 페이지 로드 시, DB에 저장된 데이터를 카드형태로 보여줌.
2. DB에 저장할 데이터
   • 이미지, 제목, 요약, 코멘트, url
3. 조각 기능(fragment feature) 구현
   • api에서 진행할 작업 중에 익숙하지 않은 것들은 따로 파일을 만들어 테스트해봄.

다음으로 실질적인 코딩과정이 들어간다.

1. 제일 먼저 서버와 클라이언트 간의 api 통신을 간단한 request query와 response message로 확인한다.
2. 서버에서 api요청의 응답에 필요한 과정들을 작업한다.
   • GET의 경우, query data에 따른 DB 조회 및 결과 response.
   • POST의 경우, request body data를 가공 및 DB에 insert 혹은 delete, update.
3. 클라이언트 역시 api 요청에 필요한 과정들을 작업한다.
   • GET의 경우, 서버로부터 받은 data를 적절한 형태로 가공해 브라우저에 뿌려줌.
   • POST의 경우, 필요한 data(ex. input value)를 취합해 약속된 형식으로 가공해서 request에 실어보냄.

etc

• bs4로 meta tag를 스크래핑할 때, 개발자 도구 - elements - 원하는 element 우클릭 - Copy selector 로 selector를 불러와 사용하면 간혹 None이 뜨는 경우가 있다.
  이는 브라우저에서 받는 meta tag들과 스크래핑할 때 받는 meta tag들의 순서가 틀릴 수 있다는 것이다.
  이럴 땐, 속성값을 이용한 selector를 이용하면 된다.
  (ex. meta[og:title="title"])
  (head > meta[og:title="title"]을 하면 None이 뜬다. head를 빼거나, >를 빼면 잘 나온다.)
  (자세히 보니, meta tag들 중 일부가 브라우저에선 형제 관계였는데 스크래핑 결과는 부모-자식 관계로 되어있었다..)
• 페이지 리로드: window.location.reload()

후기

'만약 아무 것도 없는 상태에서, 내가 생각하는 서비스를 만든다면 어떻게 시작해야할까?'

라고 했을 때, 어떻게 해나가야할지 조금은 알 것 같다.

flask도 flask 나름대로 배우는 과정이 재밌었지만, api를 설계하고 어떤 data를 주고 받을지를 구체화하는 과정이 가장 인상깊었다.
이런 과정은 만들고자하는 서비스마다 다를 수 있기 때문에, 어려우면서도 중요한 부분이라고 생각한다.