[0722] OOSIE 프로젝트 5분 기록

스토리북

이번 프로젝트에서 스토리북을 사용하지 않는 것으로 결정이 되었다..
MVP..
식단 등록 페이지 supabase 업로드까지 마쳤다..!

식단 기록 페이지 - supabase 업로드 구현

supabase 업로드를 하면서 약간? 아니면 조금 많은? 트러블 슈팅이 있었지만 해결을 완료했다 효효효 =v=

• formData

route handler에서 request.json()을 이용하여 받아오니 내용이 비어있었다.
이유는 이미지를 받아왔어야 하기 때문에 formData에 값들을 담아준 후, request.formData() 를 이용하여 받아오니 값이 들어왔다.

• formData에 객체 리스트 넣기

보통 DB 컬럼에 객체나 리스트를 넣지 않아서 정해진 방법은 없는 것 같았다.
그래서 JSON stringify 함수를 이용하여 문자열로 바꿔줘서 보낸 후, parse로 객체로 바꿔줬다.

보낼 때 stringify하고

formData.append('foodInfo', JSON.stringify(foodForms));

받아올 때 parse한다

const foodInfo = JSON.parse(formData.get('foodInfo') as string);

• formData에 이미지 여러개 넣기

반복문을 이용하여 여러개를 넣어준 후

imageFiles.forEach((file: File) => {
	formData.append('imageFiles', file);
}

route handler에서 getAll()을 이용하여 받아준다.

const imageFiles = formData.getAll('imageFiles') as File[];

처음에 get() 을 이용해서 받아오려고 했었는데 자꾸 첫번째 파일만 들어와서 열😡받았었는데, 설마하고 getAll 함수가 있는지 자동완성을 써 봤더니 있었다;; ㅋㅋ