이번 코드는 토스 슬래시 라이브러리에 있는 코드는 아니다. 토스 슬래시에도 스토리지 관련 코드들이 있기는 한데 내가 느끼기에 더 효율적으로 쓸 수 있을 거 같은 코드가 있어서 들고 오게 되었다. 일단 나는 로컬 스토리지로 범위를 좁혔고, 로컬 스토리지 상에서 직렬화, 비직렬화 관련 함수까지 정의해서 효율적으로 사용하는 코드가 있다는 것을 알게 되어 이 코드로 로컬 스토리지를 정의해서 쓰게 되었고, 그와 관련된 테스트 코드까지 작성해봤다. 이 코드는 같이 프로젝트를 진행하는 친구가 작성한 코드, 당근과 토스 라이브러리 상에 있는 스토리지 관련 코드들을 쭉 한 번 둘러본 후 필요한 부분 위주로 취합하여 작성한 코드이다. 코드 전체는 다음과 같다. interface Storage { get(key: strin..

이번에는 토스 슬래시 라이브러리에 있는 assert 함수를 이해해보려 한다. 근데 진짜 느끼는 거지만 토스 슬래시 라이브러리 보면 타입스크립트를 너무 잘 쓴다. 이번에도 타입 코드 부분들 위주로 알아보도록 하자. 일단 아래 코드는 assert 함수이다. export const assert = ( condition: unknown, error: string | Error = new Error() ): asserts condition => { if (!condition) { if (typeof error === "string") { throw new Error(error); } else { throw error; } } }; 코드에 대해서 간단히 설명하자면, 인자로 받는 condition에 만족했으면 하는 ..

사실, TIFY 프로젝트에서 프론트 리드님이 toss-slash 라이브러리 참고하면서 우리 프로젝트에 맞게 퍼널 컴포넌트 커스텀하신 걸 보고 나도 toss-slash 라이브러리에 대해서 깊게 파보고 싶다는 생각이 들었다. 그래서 toss-slash 라이브러리에 들어가서 코드를 슬쩍 봤는데 너무 고퀄의 코드여서 놀랐다. https://github.com/toss/slash 진짜 놀랐던 점은 타입 코드였다. 타입을 너무 잘 써서 할 말을 잃었다. 그래서 나도 여러 코드들을 따라 구현해보면서 타입을 잘 쓰는 방법을 익히고 싶어서 시작하게 되었다. 그러다가, 각 컴포넌트/유틸 함수들뿐만 아니라 테스트 코드도 있다는 것을 알게 되었는데, 사실 나는 테스트 코드를 짜보고 싶다고만 생각했지, 제대로 배워보지는 못했다..