react-image-crop1 커버 이미지 업로드 구현하기 ( react-dropzone + react-image-crop ) 커버이미지 1. 노션 2. ko-fi 개인 토이프로젝트를 진행하면서 유저 페이지에 커버 이미지를 넣으면 좋겠다고 생각했습니다. 그래서 커버 이미지 업로드하는 걸 구현해봤습니다! ko-fi의 커버 이미지 업로드 창입니다. 이 형태를 보고, 이전에 사용했던 react-dropzone 라이브러리를 쓰면 좋겠다고 생각했습니다. 사진 업로드 저도 ko-fi처럼 모달을 만들어서 이미지를 업로드하도록 했습니다. 1. 모달 만들기 React Portal을 이용해서 모달을 만들었습니다. 해당 내용은 이번 포스팅의 목적이 아니니까 스킵하도록 하겠습니다. 모달에 이미지를 업로드 시킬 Dropzone 컴포넌트와 사용자가 이미지를 크롭할 수 있는 ImageCrop 컴포넌트를 만들어서 import 시켰습니다. import Rea.. 2022. 2. 18. 이전 1 다음