Immer가 생성하는 맵과 세트는 인위적으로 불변으로 만들어집니다. 즉, 프로듀서 외부에서 세트, 클리어 등과 같은 변경 메서드를 시도할 때 예외(throw an exception)가 발생합니다.

test('Map and Set', () => {
  const baseMap = new Map();

  const nextBaseMap = create(baseMap, (draft) => {
    draft.set('a', 1);
  });

  expect(nextBaseMap).toMatchInlineSnapshot(`
    Map {
      "a" => 1,
    }
  `);
});
#javascript#immer#Map#Set
#252

npm을 사용하여 패키지의 여러 버전을 설치하려면 npm 설치 명령 뒤에 패키지 이름과 설치하려는 버전 번호를 사용하면 됩니다. 이 명령을 다른 버전 번호로 반복하여 여러 버전의 패키지를 설치할 수 있습니다.

yarn add react-tooltip-5@npm:react-tooltip@5.8.3
{
  "react-tooltip-5": "npm:react-tooltip@5.8.3"
}
#npm
#249
#wcag#ux
#247
async function loader() {
  const family = 'Material Symbols Outlined'
  const source =
    'url(https://fonts.gstatic.com/s/materialsymbolsoutlined/v75/kJEhBvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oFsLjBuVY.woff2)'
  const fontFace = new FontFace(family, source)

  document.fonts.add(fontFace)
  await fontFace.load()
}
#font
#243

Footnotes

  1. 일반 텍스트 파일을 데이터 소스로 사용하여 간단한 웹 애플리케이션을 구축하고 배포하기 위한 플랫폼. 백엔드 서버나 데이터베이스 없이 배포 가능. 텍스트 파일에서 데이터를 읽고 쓰고 검색하는 데 사용할 수 있는 간단한 REST API를 제공. ↩

  2. JavaScript 애플리케이션용 경량 데이터베이스 엔진. 브라우저에서 데이터를 저장, 쿼리 및 조작하기 위한 간단하고 직관적인 API를 제공하며 챗봇, 검색 엔진 및 게임을 포함한 다양한 유형의 애플리케이션을 구축하는 데 사용 가능. 이 데이터베이스는 오프라인에서 작동하도록 설계되어 PWA(Progressive Web Application) 및 기타 유형의 클라이언트측 애플리케이션을 구축하는 데 이상적. ↩

#db
#238
# 빌드 시 timestamp를 참조하기 위한 방법
timestamp=$(date +%s) # 1670759329
# 하지만 현실에서는 `TURBO_HASH`값을 참조하는 방식을 `.env`에서 사용
REACT_APP_VERSION=1.0.0-${TURBO_HASH}

Footnotes

  1. 스크립트에서 현재 타임스탬프를 특정 형식의 변수로 만드는 방법에 대한 질문. 특정 형식 문자열과 함께 날짜 명령을 사용하여 타임스탬프를 만들고 변수에 저장하도록 하는 답변들… ↩

  2. dotenv-expand는 .env 파일에서 환경 변수를 확장하기 위한 모듈입니다. 중첩 변수 확장 및 셸 명령 실행과 같은 더 많은 고급 기능을 사용 가능. ↩

#shell#node#env
#235
# `System limit for number of file watchers reached`

echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p
#node#webpack
#234

좋은 시스템일수록 실제 서비스에 적용하기는 더 어렵다는 문제가 발생. 결국 필요한건 headless 인데 생각보다 많지 않고 어떤 선택이 좋은 선택인가에 대한 조심스러운 부분이 있다.

Footnotes

  1. 참고 ↩

#ui#design-system#headless
#233

Footnotes

  1. textarea에서 특정 키입력이 발생할 경우 액션(멘션)을 발생시키는 기능 ↩

  2. 옜날에는 어떻게 한거지? 궁금해서 찾아봤습니다 ↩

  3. 입력필드에서 문자 트리거 ↩

  4. contenteditable 컴포넌트 ↩

  5. 의식의 흐름 속 갑자기 생각나버림 ↩

#editor#input
#232
version: 1
applications:
  - frontend:
      phases:
        preBuild:
          commands:
            # AWS Amplify 에서 모노레포 구조를 사용 할 경우 root 레벨로 올라가서 install
            - cd ../../
            - echo "$PWD"
            - yarn install
        build:
          commands:
            - echo "$PWD"
            # 현재 root로 이동한 상태이므로 $AMPLIFY_MONOREPO_APP_ROOT를 바로 참조하도록 설정
            - if [ $NODE_ENV_VARIABLES = ".env.development" ]; then cat "./$AMPLIFY_MONOREPO_APP_ROOT/$NODE_ENV_VARIABLES" > "./$AMPLIFY_MONOREPO_APP_ROOT/.env.production"; fi
            - yarn run "build:$AMPLIFY_MONOREPO_APP"
      artifacts:
        baseDirectory: build
        files:
          - '**/*'
      cache:
        paths:
          - node_modules/**/*
    appRoot: apps/app
#monorepo
#231
33 중 20페이지
이전 페이지다음 페이지