React 관련/기초2 React로 이미지 업로드 (with Blob, FileReader) 서론백엔드에서 이미지를 url로 보내주세요~라고 요청을 했는데, url?? 도대체 무슨 소리지...파일을 어떻게 보내지? 라는 생각이 들었다. Blob과 File 그리고 url 사이에서 무슨 소리지? 싶어서 찾아보았다.BlobBlob은 Binary Large Object의 약자로 주로 이미지, 오디오, 비디오와 같은 멀티미디어 파일 바이너리를 객체 형태로 저장한 것을 의미한다. 멀티미디어 파일들은 대다수 용량이 큰 경우가 많기 때문에, 이를 데이터베이스에 효과적으로 저장하기 위해 고안된 자료형이다. 이 Blob 객체는 blobpart와 optional type로 나누어져 있다. 먼저, blobpart는 Blob | BufferSource | String을 속성으로 지닌 값의 배열이다. optional t.. 2024. 7. 23. React 렌더링 사이클과 useEffect, 그리고 useRef ref와 useEffectuseEffect는 굉장히 섬세하다. 웬만해서는 사용해서는 안된다. 그런데, 이전에 구글 맵을 렌더링할 때, useEffect와 ref를 같이 사용함으로써, 예기치 못한 부작용들이 발생할 수 있었다. 이를 위해서 react의 trigger phase, render phase와 commit phase를 파고들어 보자.TLDR리액트 공식문서에서는 렌더링 과정을 다음과 같이 얘기한다.렌더링 트리거 (손님의 주문을 주방으로 전달)컴포넌트 렌더링 (주방에서 주문 준비하기)DOM에 커밋 (테이블에 주문한 요리 내놓기)렌더링 트리거렌더링 트리거란, 단순히 렌더링을 트리거하는 것이다. 렌더링 트리거가 왜 일어나는지에는 다음의 두 가지 이유가 있다.Initial render어떠한 동작(페이지 방.. 2024. 4. 25. 이전 1 다음