[Flask] Flask framework 미니프로젝트(project mars) 프로젝트 회고 배운점, 어려웠던점

• 배운점:
  • 프로젝트 처럼 진행하기 위해 프로젝트 개요 작성
  • 구현할 기능을 기획
  • 프로젝트 진행 단계 구성
    • 초기환경구축
    • 프레임워크, 라이브러리 설치
    • 기초 프로젝트 구조 생성 및 협업분배
    • GET 기능구현
    • POST 기능구현
    • 최종 테스트
  • CSS, JavaScript 모듈화(Static) 및 참조 링크 설정
• 어려운 점:
  • 라이브러리란? 개념 이해
    • 함수들이 뭉쳐진 하나의 .py 파일 안에 이루어진 것을 모듈이라고 합니다.
    • 여러 개의 모듈을 그룹화 하면 패키지가 됩니다.
    • 툴킷 또는 패키지는 종종 라이브러리라고도 불리웁니다.
  • 프로젝트를 분리하는 과정과 가상환경을 다시 설정하는 환경구축 단계에서 에러가 발생 및 해결
    • Import "flask" could not be resolved from source Pylance (reportMissingModuleSource)
    • 상위 폴더가 있는 경우.. VSCode에서 "폴더 선택"을 상위 폴더를 선택한 상태에서 (venv)가상환경을 설정하면 상위 폴더에서 venv폴더와 설정 파일들이 생겨난다. 아마 선택된 폴더를 root처럼 인식해서 root/venv/를 생성하는 것 같다.
  • 클라이언트 요청-백엔드 응답과 송신 등 통신의 흐름, 데이터의 흐름이 어렵다.
    • 위 View 페이지 클라이언트에서 Frontend로부터 Backend 간의 요청 및 응답, 데이터 변환과 이동 흐름을 스스로 "한줄씩" script.js파일과 app.py 파일을 왔다갔다하며 읽어내고 모르는 부분, 이해가 안되는 부분들을 찾아보았다.
  • fetch()와 연속된 .then()절
    • 서버 통신(fetch())에 대한 응답(response)객체를 반환
    • fetch().then( respose => {콜백 함수1} ).then( respose => {콜백 함수2} )
    • fetch의 대한 결과를 response인자에 보낸다.
    • 콜백함수를 통해 결과를 다시 return 한다.
    • then()를 여러번 사용할 수 있으며, 인자 값은 전 함수의 결과를 의미한다.
  • jsonify()
    • 사용자가 json data를 내보내도록 제공하는 flask의 함수. jsonify()는 json response를 보내기 위해 이미 content-type header가 'application/json'로 되어 있는 flask.Response() 객체를 리턴한다.
  • res.json()
    • Response: json() method== Response stream을 가지고와서(take) 끝날때 까지 읽는다(read it to completion). body text를 JSON형태로 파싱(parsing)한 resolve값인 Promise 를 리턴한다.)
    • (*The json() method of the Body mixin takes a Response stream and reads it to completion. It returns a promise that resolves with the result of parsing the body text as JSON.
  • Promise
    • Promise는 프로미스가 생성된 시점에는 알려지지 않았을 수도 있는 값을 위한 대리자로, 비동기 연산이 종료된 이후에 결과 값과 실패 사유를 처리하기 위한 처리기를 연결할 수 있습니다. 프로미스를 사용하면 비동기 메서드에서 마치 동기 메서드처럼 값을 반환할 수 있습니다. 다만 최종 결과를 반환하는 것이 아니고, 미래의 어떤 시점에 결과를 제공하겠다는 '약속'(프로미스)을 반환합니다.
  • fetch()의 body
    • fetch('/mars', { method: "POST", body: formData })
    • body는 요청에 추가하고자 하는 본문입니다. Blob, ArrayBuffer, TypedArray, DataView, FormData, URLSearchParams, 문자열 객체 또는 리터럴, ReadableStream 객체를 사용할 수 있습니다. 제일 마지막은 아직 실험적 기능이므로 호환성 정보를 먼저 확인해서 사용할 수 있을지 검증하세요. GET과 HEAD 메서드는 본문을 가질 수 없습니다.
• 블로그 링크 :
  • https://ohnyong.tistory.com/52
  • https://ohnyong.tistory.com/53
  • https://ohnyong.tistory.com/54
  • https://ohnyong.tistory.com/55
  • https://ohnyong.tistory.com/56
  • https://ohnyong.tistory.com/57
  • https://ohnyong.tistory.com/58
  • https://ohnyong.tistory.com/59
  • https://ohnyong.tistory.com/60