📒 [ TIL ] 2022.06.30_51일차 # 유화제작 drf (3)

[ 2022-06-30 (목) 오늘의 TIL ]

[ Today Project ]

유화제작 백엔드개발 + 프론트개발
: 이번 프로젝트는 팀프로젝트로 시작합니다.

[ Today Learn ]

• 서버와 프론트 연동
• 게시글 및 댓글 CRUD

✏️ 내가 배운것, 얻은것

* Web Client(프론트엔드) 와 Django Server(백엔드)사이의 소통과정

❓ JSON

시스템간 데이터를 주고받을 때 사용하는 데이터 포맷. 형태는 파이썬의 딕셔너리, 자바스크립트의 오브젝트와 같다.

HTTP 통신 시 html 전체를 리로드하는 대신, 보다 가벼운 JSON 포맷으로 body에 담아 필요한 데이터만 주고받는다. 같은 목적으로 xml, yaml 등이있다.

❓ Frontend(Web Client)

httpie 설치

brew install httpie

Request 보내기/ httpie를 통해 서버로 Request가 보내진다.

http -v POST 127.0.01:8000/

Start line

• POST : 데이터를 등록하라
• 127.0.0.1 : 내 PC 주소
• 8000 : 장고 채널 포트
• 목표 : target
• 나머지 : JSON 데이터

Headers

• Content-Type: body부분이 JSON 데이터로 보내지고있다.
• User-Agent: 누가요청을 보냈는가, httpie/2.2.0이 요청 보냄

body

• body의 json 데이터를 Python형식으로 바꿔서 백엔드에 보내준다.

❓ Backend(Web Server)
위와 같이 웹클라이언트, 즉 프론트엔드에서 요청이 들어오면 요청은 장고의 urls.py로 들어가게된다.

urls.py
요청이 들어오면 장고는 path list 를 순차적으로 확인하며 타겟과 일치하는 path가 있는지 확인한 후, 매칭되는 것이 있으면 request를 전달한다.

view.py
view 에선 받은 요청을 어떻게 처리할 것인지(C.R.U.D)결정한 후 데이터를 가공해 다시 프론트에 응답한다. 따라서 프론트에서 받은 JSON을 파이썬으로 변환하고, 또 응답할때는 파이썬 데이터를 다시 JSON으로 변환시킨다.

view에서 import 해야할것들

import json 
from django.http import JsonResponse 
from django.views import View 
from starbucks.models import Menu, Categories, Drinks

• json : 프론트에서 받은 JSON데이터를 파이썬이 읽을 수 있게 딕셔너리로 바꾼다
• JsonResponse : 파이썬의 딕셔너리를 JSON으로 바꾸어 프론트에응답한다
• View : view의 기능이 담긴 모듈
• models: model 클래스들을 가져온다

view class
프론트에서 요청이 들어오면 view는 get/post/put/delete 중 무엇인지 파악하고 해당하는 메소드를 실행한다.

post(self, request)

• self : StarbucksView의 인스턴스, view는 상속받은 모듈이기때문에 starbucks view 인지 다른 앱의 view인지 확인시킬 필요가 있다. 여기선 starbucks의 post메소드란걸 알려준다.

• request : 장고에 요청을 보낼 때, request라는 변수를 만든다음 body에있는 데이터를 넣어 post메소드의 인자로 넣어서 전달해준다

request객체는 JSON이다. 따라서 파이썬에서 인식할 수 있는 딕셔너리로 바꾸어주어야하는데, 여기서 json모듈의 loads()메소드를 이용한다.

프론트의 모든 요청은 request라는 하나의 객체에 담겨 view로 전달되게 된다. 따라서 request 객체안에는 startline, headers, body 가 모두 들어있다.

body 데이터를 사용할 땐 json.load(request.body)로 파이썬 딕셔너리 데이터로 만들어준 다음, request 객체에서 꺼내와 사용하능하다.

🌱 느낀 점

오늘은 각각 따로 만든 프론트엔드와 백엔드를 연동했다. 보통 현업에서는 프론트와 서버부분을 한 프로젝트 안에서 만드는 일은 거의 없다고 들었는데, 이제부터는 프로젝트를 진행할때 필수적으로 따로 분리해서 진행해서 연동하는 것에 익숙해져야겠다는 생각이 들었다.
생각보다 프로젝트기간이 길지않아서 세 명이서 진행하는데 조금 벅찬느낌이 있긴하지만 그래도 우리 팀원들과 함께 힘내서 만든 프로젝트를 기분좋게 시연발표하는 시간을 가졌으면 좋겠다 !

🎁 자세한 코드는 Moonmoo 에 게시했습니다