TIL #4 [스파르타코딩클럽] 웹개발 종합반 4주차 회고

김헤일리·2022년 10월 6일
0

웹개발 종합반

목록 보기
4/5

Flask를 통해 처음으로 서버를 구동시켜봤다.
고작 포스팅 기능이 들어간 웹페이지지만, 적어도 어떤 방식으로 백-프론트 개발이 이뤄지는지 얼추 감은 잡을 수 있었다.
다만 에러가 자주 발생했었는데, 각 에러마다 해결 방안을 구글링 해봤지만 아직 이해하기엔 어려웠다.
에러는 앞으로도 자주 발생할테니 에러 해결에 대해 구글링 하는 법도 익혀봐야겠다.

그리고 에러의 대부분은 문법 실수니... 잘 확인하는 습관을 들여야겠다..


1. API 만들기

POST 방식

  1. 통상적으로 데이터를 생성(create), 변경(update), 삭제(delete)할 때 사용한다.
    • 데이터 전달 방식: 바로 보이지 않는 HTML body에 key:value 형태로 전달
  2. 서버(_flask_)에 받아야하는 데이터 별로 코드를 짜고 받아야하는 자료의 형식에 맞게 정렬한 다음 "insert_one(doc)"의 형태로 집어넣는다.
  3. API 생성 후 클라이언트(_ajax_) 페이지(_텍스트_html)에 자바스크립트 함수 쪽에 다시 한번 받아야할 데이터를 정의하고 ajax 콜을 날린다.
- 오늘 진행한 내용은 사용자가 주문한 내역을 저장하는 방식이었다.(Create → POST)

GET 방식

  1. 통상적으로 데이터를 조회(read)할 때 사용한다.
    • 데이터 전달 방식: URL 뒤에 물음표를 붙여 key=value로 전달
  2. 클라이언트(_ajax_)가 요청하진 않고 서버(_flask_)에서 전체 주문 내역을 보여주는 형식이었다.
    • 서버쪽에선 데이터 호출만 하고, 클라이언트쪽은 for문을 이용해서 데이터를 받았다. (feat. temp_html)
    • temp_html 사용 시, id/class 값 헷갈리지 않게 조심하자


2. 조각 기능 구현 해보기

조각 기능을 구현하는 이유

  • API에서 수행해야하는 작업 중 익숙하지 않은 것들은, 따로 python 파일을 만들어 실행해보고, 잘 되면 코드를 붙여넣는 방식으로 하는 게 편하다고 한다.

  • Meta Tag 스크래핑 시도

    1. URL만 입력했는데, 자동으로 불러와지는 부분들이 있다. (카카오톡 공유 시 보이는 썸네일과 이미지)
      • 이 부분은, 'meta'태그를 크롤링 함으로써 공통적으로 얻을 수 있다.
    2. 메타 태그는, 해드태크 부분에 들어가는, 눈으로 보이는 것(body) 외에 사이트의 속성을 설명해주는 태그다.
      • 예) 구글 검색 시 표시 될 설명문, 사이트 제목, 카톡 공유 시 표시 될 이미지 등
    3. beatifulsoup으로 원하는 정보를 "soup.select.one()"을 이용해 스크래핑한다.
    4. 스크래핑한 정보를 정의하고 출력한다.


    확실히 아직 문법을 정확하게 이해하지 못한 상태에서 따라가려니 머릿속에 잘 각인이 되지 않는다.
    이런식이면 앞으로 다른 상황에 비슷한 방식으로 코드를 넣을 때 제대로 해결하지 못 할것 같다.
    5주차 수업만 끝나면 일단 javascript 기초 문법부터 차근차근 공부해야지.
    profile
    공부하느라 녹는 중... 밖에 안 나가서 버섯 피는 중... 🍄

    0개의 댓글