개발/typescript, web24 [ts, fp] @fp-ts/schema를 사용한 안전한 데이터 유효성 검사, 변환 선행으로 Either과 Option에 대한 이해가 필요합니다. fp-ts가 3버전으로 개발하면서 기존의 io-ts를 fp-ts/schema가 대체하게 된다. 아직 레포가 생성된지 오래되지 않아 부족한 것이 있겠지만, 기존의 io-ts보다 훨신 진일보한 모습에 반해 파고들게 되었다. zod에 대비해 뚜렷한 강점도 보이고 fp-ts를 기존에 사용하던 유저라면 같이 쓰기에 훨신 강력할 수 있을 것 같다. 사용하기에 앞서 먼저 사전 지식에 대해 설명하겠다. 0. AST AST 유형은 ADT(대수 데이터 유형), 즉 구조체 및 튜플과 같은 공용체에 대한 명세서이다. Schema에서의 AST는 더 대략적이고 작은 부분을 다룬다. 밑에 설명할 Schema는 AST의 wrapper라고 이해하면 쉽다. 1. Schema.. 2023. 2. 6. type safety한 RESTful을 위한 zodios (nextjs13 appDir, monorepo) zodios는 기존 axios 통신에 zod를 resolver처럼 활용하여 type safety하고 미리 에러 검출을 할 수 있게 해줍니다. type alias도 지원해주고 zod를 기반으로 타입 추론을 해주므로 안전하고 편한 RESTful이 가능합니다. 클라이언트단을 위한 react-query wrapper도 지원하므로 그야말로 완벽 https://www.zodios.org/ Zodios | Zodios End-to-end typesafe REST API toolbox www.zodios.org 먼저 제 monorepo 패키지 구조는 다음과 같이 되어 있습니다. 여기서 dashboard-web에서 nextjs13의 appDir feature을 사용하여 작업하겠습니다. pnpm add @zodios/co.. 2022. 12. 16. Module Augmentation와 Interface Merge를 활용한 bottom - up 식 구현 모듈의 interface에 merge 함으로써 타입을 관리하면 더 강력한 추상화와 중앙집권식이 구조가 아닌 개별 관리 구조를 가져갈 수 있다. (bottom - top) remix.run 프레임워크를 사용한 예제이나, 해당 프레임워크를 몰라도 상관없습니다. app/service/api.ts export interface ApiFns {} export type ApiFnKeys = keyof ApiFns; export type ApiProps = { [key in ApiFnKeys]: Parameters[0]; }; export type Method = { method: M }; type ApiMethod = { [key in ApiFnKeys]: ApiFns[key]['method']; }; /* ..... 2022. 7. 24. remix ssr에서 esmodule 패키지 사용하기 (ex: swiper) 현재 Swiper 8버전처럼 esmodule로만 되어있는 패키지는 remix에서 사용시 Error [ERR_REQUIRE_ESM]: require() of ES Module /Users/hj/study/keylogee/node_modules/.pnpm/swiper@8.2.4/node_modules/swiper/swiper.esm.js from /Users/hj/study/keylogee/api/index.js not supported. 와 같이 ERR_REQUIRE_ESM 에러가 나는데 이는 서버사이드에서 esmodule 방식을 컴파일을 하는 방법을 알지 못하기 때문이다. 이런 경우 config에 serverDependenciesToBundle 속성에 미리 의존성 번들을 추가해주어야 한다. remix.c.. 2022. 6. 16. 이전 1 2 3 4 ··· 6 다음
