Dev갱이 Dev갱이

calendar.tsx Calendar.module.scss  Reference- (https://reactdatepicker.com/ )

map 같은 루프문을 이용하여 Promise.allSettled를 사용하여 Promise 결과값들을 받게 되었을때 상태가 fulfilled 일때와 rejected일때의 결과값을 가공해야될 경우가 있다. 해당 결과값을 특정 repository에 저장 하거나 할때 각각의 Promise의 결과값에 해당하는 프로퍼티들을 추가 하여 리턴 해주어야 한다. // es2020.promise.d.ts interface PromiseFulfilledResult { status: "fulfilled"; value: T;}interface PromiseRejectedResult { status: "rejected"; reason: any;}type PromiseSettledResult = PromiseF..

Promise.allSettled를 활용해서 여러개의 메일을 전송할때 Promise.allSettled는 Pormise 객체가 성공 했을때 "fulfilled" 실패 했을때 "rejected" 와 상관없이 전부 다 실행이 되고 성공 한값과 실패한 값을 전부 받을 수 있다.그래서 "nodemailer"를 사용 했을때 모두 전송이 완료 되었을때 "fulfilled" 상태값일때 "value"값을 받고 "rejected" 상태값일때 "reason"값을 가지고 mail-log를 만들면 좋을것 같았다. 그러나 nodemailer는 rejected가 되는 상황이 생각보다 많이 없었다. 무슨 말이냐면 예를들어 수신자의 메일 주소가 존재하지 않는 메일주소인 경우에도 fulfilled로 결과를 반환 받는다. 즉, 메일이 ..

{ page: number; take: number;} 꽤 많이 사용하는 page와 take 타입이 있다고 가정 했을때 page는 backend에서 요청에 따라 유동적으로 달라지겠지만 take는 보통 상수 타입을 사용하여 동일한 갯수를 가져오는데 그범위는 number타입이기 때문에 상수의 값을 1000이든 10000이든 바꿀 수 있다. 여기서 Typescript의 강점이 나타난다. 바로 Typescript를 이용하여 number의 범위를 지정 해줄 수 있는 타입을 만든다면 런타임 환경에서 범위를 체크해주는 validation 코드 없이 해당하는 범위의 number 리터럴 타입만 올 수 있게 만들 수 있다.

// group repository create methodexport interface ICreateGroupArgs{ id: string; name: string; description: string; memberId: string;}async createGroup(createGroupArgs:ICreateGroupArgs){ await this.groupRepository.insert(createArgs)}예를들어 그룹을 생성하는 repository 메서드의 createGroup 메서드를 생성하여 사용하고 있다고 가정 했을때만약에 group-service에서 createGroup 메서드가 있고 createGroupAndCorverImage 메서드가 있다고 가정 해보자. // grou..

// pagination response{ list:T[]; page:number; totalPage:number; }// cursor pagination response{ list:T[]; cursor:{ after: string; }; count: number; next: string;} 보통 pagiantion이 필요하거나 cursor pagination이 필요한 api는 위와 같은 동일한 response형식을 가질것이다. // feed-get-all-res-dto.tsimport { ApiProperty } from '@nestjs/swagger';import { FeedResDto } from './feed-res.dto';export class Fe..

const obj = { foo: 'hello'}let propertyName = 'foo';console.log(obj[propertyName]); TypeScript는 기본적으로 객체의 프로퍼티를 읽을 때, string 타입의 key 사용을 허용하지 않는다. Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{ foo: string; }'. No index signature with a parameter of type 'string' was found on type '{ foo: string; }'.(7053) 에러가 발생한다. key값으로 올 수 있는 것은 str..

https://bluemiv.tistory.com/96 React와 WebRTC를 활용하여 실시간 화상 채팅 구현하기시그널링 서버(signaling server)실시간 화상채팅을 구현하기 전에 Signaling 서버에 대해 알아야 합니다. WebRTC에서 시그널링 서버(signaling server)는 매우 중요한 역할을 합니다. 이 서버는 WebRTC 연결을bluemiv.tistory.comhttps://www.npmjs.com/package/webrtc-adapter webrtc-adapterA shim to insulate apps from WebRTC spec changes and browser prefix differences. Latest version: 9.0.1, last published..