월 15,400원
5개월 할부 시다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 해결됨이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)
Response Time (강의 외 질문)
안녕하세요 선생님! 이전 시리즈의 강의에서도 언급해주셨듯 운영환경에서 바람직한 Response Time이 있고 이에 관해 찾아보던 중 100ms 이하의 Response Time 성능을 가져야한다는 글을 보았습니다! 하지만 제가 현재 개발하고 있는 api의 Response Time은 대략 250ms ~ 350ms 정도 나옵니다(local 환경에서) 정말 단순히 로그인 유무를 체크하는 api 조차도 대략 250ms의 Response Time이 발생합니다. 인증 관련 api부분이라 조금이라도 response time을 줄이기 위해 promise.all을 사용하여 코드를 구현해보았는데 만족스럽지 않은 Response Time이 발생합니다. 전체적인 설계의 문제인지 다른 고려사항이 있는지 조언을 부탁드려도 될까요? 혹시나 봐주실 수 있으시다면 https://github.com/FITTOSS/fittoss_backend 전체 코드도 올리겠습니다!감사합니다!
- 해결됨이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)
강의 외적인 질문입니다.
안녕하세요 선생님. 선생님의 강의를 듣고 사이드 프로젝트를 진행하고 있습니다. 그러던 중 API 명세와 관련되서 고민되는 점이 있어 조언을 얻고자 질문을 남깁니다. API 명세를 위한 tool을 찾아보던 중 swagger를 알게되었고 적용을 하려했으나 러닝커브가 있어 망설여지네요. 선생님께서는 API 명세를 작성할 때 어떤 방식으로 진행하시는지 궁금합니다! 감사합니다!
- 미해결이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)
이미지 업로드후 이미지리스트에 썸네일이 보여지기 전까지 403오류가 나요
cdn 설정을 하고, imageurl 코드로 바꿔주고 이미지 업로드를 하면 썸네일이 뜨기전까지 시간이 몇초 걸리는데 이미지가 완전히 이미지리스트에 썸네일이 뜨기전까진 저렇게 403 에러가 반복적으로 뜨다가 사진이 뜨면 403 에러가 멈추는현상이 발생합니다.
- 미해결이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)
multer에서 storage 관련 코드가 추가되었는데 설명이 없네요
cb는 무슨역할을 하는건가요?? melter 공식문서 보고 하면 되나요?
- 미해결이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)
저는 이미지 세장 선택했을때 각각의 이미지 밑에 프로그래스바가 출력되지 않습니다
저는 이미지 선택했을때 이미지 밑에 프로그래스바가 출력되지 않습니다. 그리고 이미지를 선택하자마자 프로그래스바가 초록색도 아닙니다. 어떤 부분이 잘못된것인지 알려주시면 감사하겠습니다. https://github.com/node-hyun/file-attach-dropzone https://github.com/node-hyun/file-attach-dropzone/blob/main/client/src/components/ProgressBar.js
- 미해결이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)
로그인 안했는데 isPublic에 따라 setMyImages를 하는 이유가 있나요?
client\src\context\ImageContext.js 에서 로그인이 안된 상태에서도 isPublic에 따라 setMyImages를 하도록 되있는데 로그인 안한 상태에서는 /images 요청만 날리 개인 사진 보기 버튼이 있지도 않은데 setMyImages는 의미가 없지 않나요? useEffect(() => { setImageLoading(true) axios .get(imageUrl) // .then((result) => setImages((prevData) => [...prevData, ...result.data])) .then((result) => isPublic ? setImages((prevData) => [...prevData, ...result.data]) : setMyImages((prevData) => [...prevData, ...result.data]), ) .catch((err) => { console.error(err) setImageError(err) }) .finally(() => setImageLoading(false)) }, [imageUrl, isPublic]) useEffect(() => { if (me) { setTimeout(() => { axios .get('/users/me/images') .then((result) => setMyImages(result.data)) .catch((err) => console.error(err)) }, 0) } else { setMyImages([]) setIsPublic(true) } }, [me])
- 미해결이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)
처음 시작할때 무한 스크롤이 안되요
안녕하세요 질문이 있습니다. 이미지가 20개 이상이고 15번째 이미지가 ref로 참조되고 있는데도 추가로 이미지를 불러오지 못하는 이유가 무엇일까요? https://github.com/node-hyun/file-attach-dropzone https://github.com/node-hyun/file-attach-dropzone/blob/main/client/src/components/ImageList.js
- 해결됨이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)
윈도우에서 진행하는데 오류가 납니다
안녕하세요 선생님 선생님은 맥에서 리눅스 환경으로 npm install --arch=x64 --platform=linux sharp 로 진행하셨는데, 저는 윈도우에서 진행중입니다! https://sharp.pixelplumbing.com/install 을 참고해 npm install sharp 또는 npm install --platform=win32 --arch=ia32 sharp npm install --ignore-scripts=false --verbose sharp 위에 명령어로 설치해봐도 2021-08-20T11:43:36.173Z undefined ERROR Something went wrong installing the "sharp" module Cannot find module '../build/Release/sharp-linux-x64.node' Require stack: - /var/task/node_modules/sharp/lib/sharp.js - /var/task/node_modules/sharp/lib/constructor.js - /var/task/node_modules/sharp/lib/index.js - /var/task/index.js - /var/runtime/UserFunction.js - /var/runtime/index.js Possible solutions: - Install with the --verbose flag and look for errors: "npm install --ignore-scripts=false --verbose sharp" - Install for the current runtime: "npm install --platform=linux --arch=x64 sharp" - Consult the installation documentation: https://sharp.pixelplumbing.com/install 이러한 에러가 납니다. 해결방안이 있을까요? +추가로 npm install --platform=linux --arch=x64 sharp도 설치해봐도 같은 에러가 떠요! npm install --platform=win32 --arch=ia32 sharp npm install --ignore-scripts=false --verbose sharp npm install --platform=linux --arch=x64 sharp 이거 다설치해봐도 오류가 납니다 sharp-linux-x64.node이 명령어를 입력해도 설치가 안되는데 혹시 직접 노드파일을 넣어주면 오류가 안날까요? ../build/Release/ 경로에서 sharp-linux-x64.node 파일을 주실수있을까요?
- 해결됨이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)
AWS Presigned url 장점
기존의 user -> server -> s3 flow로 이미지 업로드를 진행 할 경우 Presigned url를 사용해 구현할 경우와 대비해서 '네트워크 대역폭'이 증가하여 속도적인 측면에서 단점을 가진다고 설명해주셨습니다. 즉 Presigned url을 사용하면 서버에서는 Presign url만 클라이언트에게 던져주고, 실제 파일 업로드는 클라이언트에서 진행되기 때문에 '트래픽 및 대역폭'을 신경쓰지 않아도 된다인거 같은데 여기서 '대역폭의 상관관계(Presigned url 사용 유무에 따른)'가 잘 와닿지 않아서 보충 설명 부탁드려도 될까요? 감사합니다!
- 해결됨이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)
objectId compare
강의에서 언급해주셨듯이 objectId를 비교할 때는 string으로 변환하여 비교해야하는데, useEffect(() => { const img = Images.find((image) => image._id === imageId); if (img) setImage(img); }, [Images, imageId]); 이 경우에는 image._id는 objectId이고 imageId string이여서 image._id를 image.id로 하던지 string으로 변환해야한다고 생각하는데 위의 코드와 같이 해도 정상적으로 동작하는 이유가 무엇인가여??감사합니다!
- 해결됨이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)
서비스 배포
안녕하세요 선생님. 강의 잘 보고 있습니다. 강의를 보다가 궁금한 점이 생겨서 질문을 남깁니다. 서비스를 배포하고 운영한다고 가정했을때, atlas에 유저의 개인정보(전화번호, 비밀번호, 성별)를 저장하였고 강의와 같이 비밀번호를 암호화하여 저장했을 때, 개발자로써 더 고려해야 할 사안이 있을까요? 보통 서비스를 운영할 때는 강의 이상의 것들을 더 고려하는지 궁금하고 더 고려한다면 무엇이 있을지 궁금합니다! 감사합니다!
- 해결됨이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)
미리보기 에러
안녕하세요 선생님. 사진과 같이 미리보기 사진이 보이지 않는데 이유를 잘 모르겠습니다. 깃허브 주소는 https://github.com/onejaejae/Learn_Image_Fullstack 입니다. 좋은 강의 감사합니다.
- 해결됨이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)
Context로 받는걸 객체로 바꾸고 이미지리스트를 삼항연산자로 바꾸면 이러한 오류가 납니다.
사진저장해서 봐주세요ㅜㅜ 터미널 오류는 없습니다. + 마지막 사진엔 setIsPublic 이라고 되어있지만 myImages로 세팅했습니다. const imgList = (isPublic ? images : myImages).map((image) => (
- 해결됨이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)
에러 발생
이와 같은 에러가 발생하였는데 해결방법을 고민해보았지만 답을 찾지 못하여 질문을 남깁니다.깃허브 주소도 남기겠습니다https://github.com/onejaejae/Learn_Image_Fullstack양질의 강의 감사합니다!
- 미해결이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)
virtualized list 기술 적용한 성능 최적화
안녕하세요 강사님! 이미지 인피니트 스크롤링할때 virtualized list 적용해서 성능을 최적화 하는 방법도 강의해 주실 수 있을까요?
- 미해결이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)
체크 박스 체크 + 파일 여러개 한번에 다운로드를 할수 있나요?(강의외 질문)
안녕하세요 김시훈 강사님 질문이 있습니다 파일 리스트가 출력된 상태에서 체크박스 체크 => 저장 버튼 클릭 => 파일 열기창 열리고 폴더 선택 => 체크된 행의 파일들을 한번에 다운로드 이렇게 구현하는게 가능한가요? <a href="/test1.txt> {file.name} </a> 이렇게 하면 바로 다운로드는 되는데 체크 박스 체크 후에 여러행의 파일을 한번에 다운 로드 하는 방법이 있을까요? 그리고 또 한가지 질문은 몽고 디비 로컬 설정 방법은 뭘 보고 하면 좋을까요?
- 미해결이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)
이미지 삭제 or 서버에 보관
안녕하세요. 이미지 삭제 강의를 보다가 궁금한게 있어서 질문드립니다. 보통 이미지 삭제 요청이 프론트에서 오면 디비와 파일시스템에서 사진을 삭제를 하나요 아니면 유저가 접근못하게 deactivate를 하나요? 이미지도 나중에 많이 쌓이면 좋은 자료일거 같아서 그냥 삭제하기에는 아쉬워보여서요,
- 미해결이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)
세션에 대해서 질문이 있습니다.
강의 너무 감사히 잘 듣고 있습니다. 강의를 들다 궁금한게 있어서 질문을 드립니다. 개인적으로 서버를 구축할떄 JWT가 간단하고 추가적으로 Redis server를 추가할 필요가 없어서 jwt를 선호합니다. 실무에서는 세션 vs JWT중 어떤것을 많이 쓰는지와 트랜드 혹은 선호되는 이유를 알 수 있을까요?
- 미해결이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)
이 강좌는 소스코드 제공이 안되나욤?
지금 aws 직전까지 들으면서 같이 코딩했는데 조금 빠르게 완성된 코드와 비교해서 보고싶은데 완성된 코드는 따로 제공하시지는 않나요?? 제공된다면 공부하는데 많은 도움이 될 것 같아서요. 영상 되돌려 보면서 오타찾고, 디버깅하면서 고치면서 보고있는데 완성코드와 비교해보면서 보면 더 좋을것 같습니당
- 해결됨이미지 관리 풀스택(feat. Node.js, React, MongoDB, AWS)
setFile default 값으로
이미지 업로드 후 setFileName, setPercent를 default 값으로 해준것과 마찬가지로 setFile도 null값으로 바꿔줘야한다고 생각하는데 어떻게 생각하시나요??