목록2025/04 (2)
Joonas' Note

서버에 파일을 업로드하는 함수를 구현하던 중, axios를 fetch 로 변경하였는데 서버쪽에서 500 에러가 발생했다.문제는 서버에 도달한 요청 데이터에 RequestBody가 사라진 것이다.아래의 두 함수를 비교하면, 전혀 문제될 것이 없어보인다.먼저, axios를 사용하고 있던 기존의 함수 로직이다.axios .post(ENDPOINT, formData, { headers: { 'Content-Type': 'multipart/form-data', }, }) .then((data) => console.log(data))다음으로 fetch로 변경한 함수 로직이다.fetch(ENDPOINT, { method: 'POST', headers: { 'Content-Type':..
primitive 하게 비교되지 않는 object들은 의존성 배열에서 같은 값으로 인식하지 않는다.이건 javascript 의 비교 연산자가 얕은 비교를 하기 때문이다. 아래는 대표적인 사례.{} == {}// output: false즉, 아래의 memo는 전혀 캐싱되지 않기 때문에 어떤 스노우볼을 굴릴 지 모른다.const complexObject = {a:1, b:2, c:"xyz"}// 의존성 배열은 항상 다른 값으로 인식된다.const complexMemo = useMemo(() => complexObject, [complextObject])아래와 같이 비교 대상을 문자열로 변경해서 해결하는 방법도 있는데, 보기에도 느껴지지만 그렇게 권장되는 방법은 아니다.const complexObject = ..