[Typescript] Nest.js Cloudflare R2 + Images 통합 Multer storage engine 개발기

서론 이번 포스팅에선 Nest.js에서 Cloudflare R2와 Images를 통합하여 Multer Storage engine으로 사용하기 위한 개발기를 담았다. 이전 포스팅과 이어지는 내용이니 그 포스팅을 참고하길 바란다. 2023.03.08 - [SW/Typescript] - [Typescript] Nest.js Multer Storage Engine에 Cloudflare Images 적용기 [Typescript] Nest.js Multer Storage Engine에 Cloudflare Images 적용기 서론 이번 포스팅에서는 nest.js multer의 storage engine으로 Cloudflare Images 서비스를 URL 업로드 방식으로 연동해보려는 시도를 담았다. 1. Cloudfl..

• format_list_bulleted SW/Typescript
• · 2023. 3. 18.
• textsms

[Typescript] Nest.js JWT 인증 모듈 만들기 (+ 커스텀 데코레이터)

서론 이번 포스팅에서는 Nest.js에 JWT 인증 모듈을 개발한 경험을 담았다. 실제 필자가 JWT 인증 모듈을 만들면서 개인적으로 고려했던 부분들이 포함되어있다. 1. 프로젝트 구조 JWT 인증/발급 기능에 대한 관심사를 "JWT 인증 모듈"만 가지도록 분리하기 위해 다음과 같은 프로젝트 구조를 가졌다. global.d.ts: 전역에서 JWT의 사용하기 위해 전역으로 인터페이스를 본 파일에 정의하게 된다. jwt-auth.module.ts: PassportModule이나 JwtModule을 import 및 initialize하기 위한 파일이다. 이 모듈은 @Global() 데코레이터가 붙였기 때문에, jwt 인증/발급 기능을 사용할 다른 모듈에선 jwt-auth.module을 import하지 않아도 ..

• format_list_bulleted SW/Typescript
• · 2023. 3. 10.
• textsms

[Typescript] Nest.js Multer Storage Engine에 Cloudflare Images 적용기

서론 이번 포스팅에서는 nest.js multer의 storage engine으로 Cloudflare Images 서비스를 URL 업로드 방식으로 연동해보려는 시도를 담았다. 1. Cloudflare Images가 뭔데? Cloudflare Images는 Amazon S3나 Cloudflare R2 처럼 파일을 저장하고 서빙해주는 서비스인데, 그 파일이 "이미지"에 초점이 맞춰져 있는 서비스이다. 그래서 Cloudflare Images는 이미지 파일 서빙을 위한 강력한 기능, 가격정책을 제공한다. Cloudflare Images의 가격정책은 용량단위의 가격이 아닌 이미지 개수의 대한 가격으로 책정된다. 그래서 이미지 10만개를 호스팅 하는데 $5, 이미지 10만개를 전송하는데 $1의 비용만 발생한다. C..

• format_list_bulleted SW/Typescript
• · 2023. 3. 8.
• textsms

[Typescript] 당신의 JS코드에서 if문을 줄여줄 기본 연산자 5가지

서론 이번 포스팅에서는 JS코드 상에서 if문을 줄여줄 수 있는 기본 연산자 5가지를 소개한다. 하지만 기본 연산자를 활용해 무조건적으로 if문을 줄인다고해서 가독성이 좋아지는 것은 아니니 미리 알아두고 필요할때 적절히 활용하도록 하자. 1. 논리곱(&&), 논리합(||) 연산자의 단락 평가(Short-circuit evaluation) (결과값이 false가 되는 표현식) && (임의의 표현식) Javascript는 && 표현식에서 좌항 표현식의 결과값이 false이면 우항의 표현식을 실행/검사하지 않는다. 그래서 위 예시를 보면, 좌항에 결과값이 false가 되는 표현식이 놓여있고 우항에는 어떤 임의의 표현식이 놓여있는데 우항의 표현식은 아예 실행되지 않는 것이다. 이와 같은 기능은 보통 값이 유효한..

• format_list_bulleted SW/Typescript
• · 2022. 12. 5.
• textsms

[Typescript] Next.js 13의 Image 컴포넌트 변경사항

서론 이번 포스팅은 Next.js의 버전이 12에서 13으로 업데이트되면서 발생한 Image 컴포넌트의 변경사항을 다룬다. 아직 구글에 돌아다니는 대부분의 Image 컴포넌트 자료가 12버전 이전의 자료들이라 13버전에는 사용할 수 없는 내용들이 많아 이렇게 간단히 포스팅으로 정리하게 되었다. Next.js v13.0.0 기준 v12.3.0 대비 변경사항 1. Image 컴포넌트의 를 감싸던 과 일부 Prop이 삭제됨 기존 Image 컴포넌트 내부에선 태그를 으로 감싸고 있었지만, 13버전에는 이 삭제되어 13버전에서 Image 컴포넌트를 사용하면 태그 하나만 랜더링된다. 그리고 13버전에서 삭제된 Image 컴포넌트의 Prop은 다음과 같다. layout objectFit objectPosition l..

• format_list_bulleted SW/Typescript
• · 2022. 11. 5.
• textsms

[Typescript] Javascript의 Pass by Reference와 Pass by Value

서론 이번 포스팅에선 Javascript의 Pass by Reference(이하 by Ref.)와 Pass by Value(이하 by Val.)에 대한 이야기를 해볼까 한다. (예제 코드들은 Typescript로 작성되었지만, 큰 차이는 없으므로 참고하기 바란다.) TL;DR Javascript는 함수에 인자를 전달할때 무조건 by Val.로 전달한다. Object를 함수의 인자로 전달할 때도 by Val.로 전달되지만, "Objec에 대한 참조"를 Value로 하여 전달하기 때문에 Object를 함수로 전달하면 by Ref. 처럼 사용할 수 있다. Object를 대입한 a라는 변수를 함수의 인자로 전달하면 해당 인자를 by Ref. 처럼 사용할 수 있기 때문에, 함수 내에서 해당 인자의 속성 값을 수정..

• format_list_bulleted SW/Typescript
• · 2022. 10. 25.
• textsms