스택 = 서로 의존하는 PR의 연쇄. 기능 브랜치는 main에서 분기하지만 스택은 부모 PR에서 분기한다 — 그래서 검토를 기다리는 동안 다음 조각을 이어서 작업할 수 있다.

병합은 스택 아래부터. 하나가 병합되면 그 위 PR의 base를 갱신해야 한다. git 기본 기능만으로도 되지만 리베이스가 계속 따라붙어서, Graphite·Sapling 같은 도구가 그 부분을 자동화한다.

#git#stacking#sapling
#272
#json#diff#deep-object-diff#json-diff#microdiff
#271
const root = createRoot(document.querySelector('#confirm-root'))

root.render(<Confirm />)

confirm ui를 만들다보면 window.confirm을 호출하는 방식으로 사용하는게 가장 좋은 방법인데 (안그러면 state로 관리해야하고 결국 이건 무의미한 코드의 반복이다.) 이걸 react로 구현하려면 결국 render를 사용해야함. react-confirm, react-confirm-alert 둘다 소스를 보면 비슷한 방식으로 접근한다.

#react#ui#confirm#react-confirm#react-confirm-alert
#270

모바일 웹뷰에서 특정 영역을 zoom할수 있게 해달라는 요청이 있어서 적용한 내역. 정확히 기억은 안나는데 react-prismazoom를 선택했다.

그 외 비슷한

#ui#react#zoom
#269

prefetch는 내려받기만 하고, prerender는 내려받은 뒤 렌더링까지 시작한다.

Tachyon은 <a>에 커서가 50ms 이상 머물면 <link rel="prerender">를 넣어주는 라이브러리.

#performance#tachyon#prefetch#prerender
#268

원칙 — 명확하고 구체적인 지시, 그리고 모델에게 생각할 시간 주기.

전술 — 구분자로 입력 경계 표시(```, “”“, < >, <tag> </tag>, :), 구조화된 출력 요청(JSON·HTML), 조건 충족 여부를 모델에게 확인시키기, few-shot 으로 스타일 고정.

https://www.deeplearning.ai/short-courses/chatgpt-prompt-engineering-for-developers/

#prompt#llm
#267
async function main({ onActivate, onError, onReading, onDenied }) {
  const result = await navigator.permissions.query({
    name: 'ambient-light-sensor',
  })

  if (result.state === 'denied') {
    onDenied()
    return
  }

  const ambientLightSensor = new AmbientLightSensor({ frequency: 20 })
  
  ambientLightSensor.addEventListener('activate', onActivate)
  ambientLightSensor.addEventListener('error', onError)
  ambientLightSensor.addEventListener('reading', () => {
    const ISO = 100
    const C = 250

    const EV = Math.round(Math.log2((ambientLightSensor.illuminance * ISO) / C))

    onReading(EV)
  })

  ambientLightSensor.start()
}

Footnotes

  1. 주변광 센서 인터페이스가 포함된 일반 센서 API를 사용하는 방법을 설명 ↩

#web-api#ambient-light-sensor
#257
const { Parser } = require('acorn')
const JSXParser = Parser.extend(require('acorn-jsx')())

const isReactComponent = Boolean(
  JSON.stringify(
    JSXParser.parse(fileContent, {
      sourceType: 'module',
      ecmaVersion: 'latest',
    })
  ).includes('JSXIdentifier')
)
#typescript#jsx#parser
#255

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
31 중 19페이지
이전 페이지다음 페이지