Instagram-Clone 👩‍💻

summary 📖

항해99 두번째 "인스타그램 클론코딩" 입니다!

많은 기능을 구현하려면 SNS보다 좋은 주제는 없다고 생각했고 그 중 가장 인기가 많은 인스타그램을 한번 클론코딩 해봤습니다!

노션

https://stripe-balmoral-028.notion.site/99-Front-Backend-Instagram-d26c741eaa214551996a2eaadfaa227e

기술 스택 ⚙

Front-end

• Pure CSS

• React

Back-end

• Node.js

• Express

• MongoDB

• S3

API 명세서

이번 프로젝트 하면서 어려웠던 점.

서버에서 가장 어려웠던것은 S3를 이용하여 이미지를 저장하고 업로드 하는 것이었다.
역시 처음 구축하는것이 가장 어려웠고 가장 신기했다.

해결한 문제들.

1. multer를 이용하여 이미지를 내 서버의 file에 업로드 하는 것이 아니라
   S3 버킷에 이미지를 업로드 했다.

2. 업로드한 이미지의 용량이 생각보다 커서 multer-s3-transform을 이용해서
   파일을 압축시켜 용량을 줄였다. 이로써 전체이미지를 가져오는 속도가 빨라졌다.

3. 프런트쪽에서 form-data를 보낼때 append를 사용해이미지와 텍스트를 동시에 보내는 법을
   찾아서 적용시켰다.