JNarin Development Story

어쩌다 보니 vue를 쓰게 되다 보니 최근에 미니 플젝을 잠시 중단하고 vue에 대해 공부 중에 있습니다. Vue에서 scss를 변수를 설정하기 위해서는 두 가지를 프로젝트에 설치를 해야 합니다. npm i node-sass sass-loader node-sass 스타일시트 전처리 언어입니다. sass나 scss를 사용할 수 있습니다. sass-loader SCSS 파일을 가져와 CSS로 컴파일합니다. 여기서 컴파일은 특정 프로그래밍 언어로 쓰여 있는 문서를 다른 프로그래밍 언어로 옮기는 언어 번역 프로그램을 말한다. 즉 필자가 이해한 바로는 한국어를 영어로 바꿔주는 거로 이해가 되었습니다. 즉, node-sass로 sass 혹은 scss를 사용할 수 있으며, sass-loader가 sass/scss 확..

게시판이라 하면 일반적으로 제목과 내용 이미지 등 최소한의 필요한 것이 있습니다. 그래서 이전에 AWS에 대해서 공부했지만, 아직 이해하지 못하는 과정도 많았고 오류도 있어 그 부분을 이제 겨우 해결을 해서 정리도 할 겸 내용을 쓰게 되었습니다. 일단 필자가 개발에 사용하고 있는 것은 프론트에서는 리액트입니다. 그리고 벡엔드는 노드에서 몽고 디비를 현내 사용 중에 있습니다. 위 구조를 참고로 아래 코드를 참고해주시기 바랍니다. 먼저 이미지 업로드하는 API를 만들기 위해서는 몇가지 라이브러리를 설치해야 합니다. npm i aws-sdk dotenv multer multer-s3 1) aws-sdk 먼저 SDK는 Software Development Kit의 약자로 특정한 소프트웨어나 플랫폼을 이용해서 소..

안녕하세요. 제이나린입니다. 최근 s3이미지 업로드라는 신문물을 독학하면서 몇 가지 삽질을 적어보려고 합니다, 진짜 이거 때문에 며칠을 삽질했는데... TypeError: this.client.send is not a function multerS3에서 에러가 발생하는 것 같아 해당 관련 공식 깃허브에 가서 보니 해답은 단순했습니다. 즉 multerS3는 aws-sdk와 버전이 같아야 한다는 것이랍니다. 하필이면 필자가 공부를 할 때에는 aws-sdk의 최신 버전은 2.x이었고, multerS3는 3.x로 인하여 문제가 발생하게 되었습니다. 이점 꼭 확인하여 삽질을 줄입시다. 하나를 해결하니 다음 에러가 또 발생... AccessControlListNotSupported: The bucket does n..

필자가 만들고 싶어 하던 프로젝트에서는 이미지를 업로드를 해야 합니다. 그래서 회사에서도 가장 많이 사용하는 걸로 알고 있는 AWS S3로 공부하기 위해 해당 서비스로 선택하게 되었습니다. 먼저 S3에 대해서 알아야 하겠죠? S3는 Simple Storage Service로 단순 File을 저장하는 서비스를 의미합니다. S3의 특징은 다음과 같습니다. 객체(파일)만 저장이 가능하다. 프로그램 설치는 불가하다. 파일의 안정성을 거의 보장한다. 무제한 용량으로 1개의 파일이 5TB까지 가능하나, 사용한 만큼 과금이 붇는다. Static Web Hosting 이 가능하다. 버전 관리가 가능하다. Bucket 단위로 관리하며, 이름은 유니크해야 한다. 암호화가 가능하며, 보안 설정이 가능하다. 데이터를 저장하고..