이미지 미리 보기 시에는 원본 이미지를 보여주고, 이미지 저장 후에는 리사이징된 이미지를 보여주도록 수정했습니다. 이미지 업로드와 이미지 리사이징 간의 시간차가 있으므로 이미지가 보이지 않을 수 있는데, 그 문제를 해결하기 위한 방법입니다.

npm run dev로 서버를 실행한 뒤 http://localhost:8001에 접속합니다. 로그인 후 이미지를 업로드합니다.

▲ 그림 16-35 이미지가 리사이징된 모습

▲ 그림 16-36 thumb 폴더에 리사이징된 이미지가 저장된 모습