9월 첫주차 기록

September 9, 2023 • ☕️ 3 min read

weekly

일만 하면 심심해

배워가기

shell script에서 `-`와 `--`

-는 --의 shortcut이다.
- -version / v, -hlep / h 등..
모든 -에는 그에 대응하는 --가 존재하지만 반대는 아니다. (자주 사용되는 것만 숏컷으로 제공하는 듯)
--의 경우 붙여쓰는 것과 띄어쓰는 것은 전혀 다른 의미다
- ex) pnpm tr --filter '@projects/baemin' run -- beta
  - --filter은 그 자체로 하나의 argument로, 쉘 스크립트는 띄어쓰기를 기준으로 스크립트의 요소를 분리한다.
  - ["pnpm", "tr", "--filter", "'@projects/baemin'", "run", "--", "beta"]
쉘 스크립트는 각 argument에 따라 순서대로 동작한다.
- -- - -- 를 기준으로 앞선 ‘명령’ 스크립트가 끝났음을 표시하고,
- 이후에오는 것은 모두 argument이다.
- 앞선 명령어로 인해 실행되는 다른 내부 스크립트의 argument로 전달한다.

zustand

작고 빠르고 확장 가능한 상태 관리 툴
flux 패턴을 따른다
hook 기반의 API를 제공한다
보일러플레이트가 필요 없다

예시)

Copy

import { create } from "zustand";

const useBearStore = create((set) => ({
  bears: 0,
  increasePopulation: () => set((state) => ({ bears: state.bears + 1 })),
  removeAllBears: () => set({ bears: 0 }),
}));

Copy

function BearCounter() {
  const bears = useBearStore((state) => state.bears);
  return <h1>{bears} around here ...</h1>;
}

🐻 로고부터 예시까지 왜 이렇게 bear(곰)을 많이 쓰나 했더니

bear-bones - 일반적으로 어떤 것이 최소한의 필수 요소나 부속품만 포함하고 있어 매우 간단하고 기본적인 상태를 나타내는 표현이다. 이 표현은 주로 기술, 제품, 시스템 등을 설명할 때 사용된다.

Ref ChatGPT

jest에 babel이 필요한 이유

기본적으로 jest는 테스트파일을 es5 구문으로 해석한다. jest는 React에 종속된 라이브러리가 아니기 때문에, React가 쓰는 es6 구문에 맞출 필요가 없다. 따라서 우리는 es6구문으로 작성된 test파일을 트랜스파일해야 테스트를 정상적으로 진행할 수 있다.

TypeScript 파일은 ts-jest를, JavaScript 파일은 babel-jest를 사용하도록 customize할 수 있다.

Copy

// jest.config.js
module.exports = {
  // ...
  transform: {
    "^.+\\.tsx?$": [
      "ts-jest",
      {
        isolatedModules: true,
      },
    ],
    ".*(bsds-component).*.(jsx|js)$": "babel-jest",
  },
};