전체 글39 [FormData 전송] 배열 데이터를 POST할 때 [object Object] 에러가 발생한 이유와 해결 방법 프로젝트에서 이미지 업로드 기능을 구현하며 POST 요청을 보낼 일이 있었는데,요청 payload에 객체 배열을 포함하자 다음과 같은 문제가 발생했습니다.[object Object] 형태로 전송되어 서버에서 파싱 오류 발생🔍 문제 원인: 배열 형태의 객체가 그대로 직렬화되지 않음일반적으로 JSON API에서는 JSON.stringify()로 객체를 문자열로 변환해 전송하면 문제가 해결됩니다.하지만 이번 케이스는 FormData를 이용한 multipart/form-data 방식이었고,배열 속 객체에 File 타입이 포함되어 있었습니다.{ images: [ { displayOrder: 1, imageType: 'thumbnail', imageFormat: 'jpeg', .. 2025. 3. 10. [어드민 시스템] 추가 개발건 보호되어 있는 글 입니다. 2024. 6. 27. 🌳 Tree-shaking과 enum 사용에 대한 고민 ✅ Tree-shaking이란?Tree-shaking은 번들에서 사용되지 않는(dead code) 코드를 제거하여 최종 번들 크기를 줄이는 최적화 기법이를 통해 페이지 로딩 속도 개선과 초기 렌더링 성능 향상에 도움을 줄 수 있습니다 Enum이란?enum은 열거형 타입으로, 관련된 상수들을 하나의 그룹으로 묶어 표현할 수 있도록 도와주는 기능입니다.TypeScript에서 제공하는 기능이며, JavaScript에는 기본적으로 존재하지 않습니다.숫자 또는 문자열 값을 지정할 수 있으며, 타입 안전성을 확보하고 코드의 가독성과 유지보수성을 높여줍니다.// 일반적으로 사용하고 있는 유형enum TYPE { KOREA = 'Korea', JAPAN = 'Japan'}// Javascript에서 사용하고 있는.. 2024. 6. 23. 애니메이션 라이브러리 lottie > 애니메이션 라이브러리https://lottiefiles.com/ LottieFiles: Download Free lightweight animations for website & apps.Effortlessly bring the smallest, free, ready-to-use motion graphics for the web, app, social, and designs. Create, edit, test, collaborate, and ship Lottie animations in no time!lottiefiles.com 사용법https://velog.io/@ooo3289/lottie.js-htmljs-%EC%82%AC%EC%9A%A9%EB%B2%95-%EC%8B%9C%EC%9E%.. 2024. 6. 12. 데이터를 useMutation으로 가져오는 건 괜찮을까? 일반적으로 React Query의 useMutation은 서버에 데이터를 전송(POST, PUT, DELETE 등) 하는 작업에 사용합니다.반대로 데이터를 가져오는 작업(FETCH) 은 useQuery로 처리하는 것이 표준적인 방식입니다.하지만 특정 상황에서는 useMutation을 사용해서 데이터를 가져오는 것이 더 적절한 경우도 존재합니다. 🧩 상황 설명: 버튼 클릭 시 조건에 따라 API 호출이 필요한 케이스현재 진행 중인 프로젝트에서는 버튼 클릭 이벤트를 통해 특정 플래그 값을 기준으로 다음 동작을 결정해야 했습니다.이러한 경우 useQuery는 컴포넌트 마운트 시점에 자동 실행되기 때문에, 사용자 액션에 따라 조건부로 실행되는 useMutation이 더 적합했습니다.🛠️ 실제 구현 예시// .. 2024. 6. 11. useSyncExternalStore https://react-ko.dev/reference/react/useSyncExternalStore useSyncExternalStore – ReactThe library for web and native user interfacesreact-ko.dev외부 스토어를 구독할 수 있는 React 훅 2024. 4. 25. 이전 1 2 3 4 5 ··· 7 다음
