본문 바로가기

분류 전체보기

 (36)
사내 디자인 시스템 사용기 2023.12.06
youthcon 2023 발표 https://frost-witch-afb.notion.site/React-Hook-Form-92974c0596d34a2e922817c3deab3022 칼퇴근을 위한 React Hook Form | Built with Notion 소개 frost-witch-afb.notion.site
Dead code check depcheck 호출하지 않는 라이브러리를 체크해 준다. $ yarn add -D depcheck $ yarn depcheck unimported 호출하지 않는 라이브러리, 파일을 체크해 준다. $ yarn add -D unimported $ yarn unimported 사용하지 않는 컴포넌트를 찾고자 하는데 요건 안되는듯 하다.
call api when parameter is not empty in SWR ✅ Conditional Fetching useSWR 인자인 key 값이나, fetcher 파라미터에 null을 주면 swr는 fetch를 하지 않는다. ✅ mutate 같이 적용하기 export const getMall = (token: string) => { const { data, mutate } = useSWRImmutable('/mall', (url) => (token ? fetcher(url, null, token) : null)); return { mall: data?.result as MallProps, mutate, }; }; getMall 함수에서 token 값이 없으면 fetch를 진행하지 않는다. getMall 함수를 호출하는 곳에서 token 을 얻으면 다시 mutate 를 통해서..
RabbitMQ 지연큐 적용하기 큐를 쌓는 api를 개발했는데, 한번의 호출에 N개의 큐가 쌓여진다. 이때 N의 수가 클 경우 큐가 너무 많이 쌓여졌고 컨슈머 쪽에서 처리량이 너무 많아지고 악순환을 만들어냈다. 이를 해결하기 위해 주어진 미션은 다음과 같다. 🧡 미션 큐에 쌓을때 (M, M*2, M*3, ..., M*N )초의 지연을 주자. 예를 들어 M을 5초로 잡았을때, 한번의 api 에서 4개의 큐가 쌓이게 되면 지연을 5초, 10초, 15초, 20초 간격으로 줘야 한다 🧡 구현 방법 먼저 지연 시간 전 값을 저장할 임시 큐와, 지연 시간 이후 실제 consumer가 값을 읽어고 처리할 real 큐가 필요하다. temp Q에서 만료시간이 끝나면 real Q로 값을 넣어줘야 한다. 이 기능은 rabbitMQ 에서 x-dead-let..
이미지 url로 base64 encode 값 구하기 export async function loadImage(url: string) { return new Promise((resolve) => { const img = new Image() img.src = url + "?timestamp=" + new Date().getTime() img.crossOrigin = "Anonymous" img.onload = () => { const canvas = document.createElement("canvas") canvas.height = img.height canvas.width = img.width const ctx = canvas.getContext("2d") if (ctx) { ctx.drawImage(img, 0, 0) const base64 = ca..
또 사용할것 같은 custom 함수들 - chunk array function chunk(array: object[], size: number) { const chunked: object[] = []; let index = 0; while (index setTimeout(resolve, ms)); }
@nestjs-modules/ioredis로 redis queue 사용하기 redis in nestjs 로 검색하면 많은 정보가 나오는데 거의다 cache로 사용하는 예제이다. 그런데 최근에 nestjs팀에서 ioredis 전용 라이브러리를 업데이트 해주셨다. 덕분에 아주 간단하게 연결해서 사용할수 있었다. 짧게 연결 법부터 적용 방법을 기록한다 ! 라이브러리 설치 $ yarn add @nestjs-modules/ioredis ioredis 연결하기 import { RedisModule } from '@nestjs-modules/ioredis'; @Module({ imports: [ RedisModule.forRoot({ config: { url: `redis://${process.env.REDIS_HOST}:${process.env.REDIS_PORT}`, password: ..

티스토리툴바