[vue3] api와 런타입 타입 체크 : io-ts

io-ts를 이용하여 api 결과 리턴값에 대해 타입을 체크 해 주는 코덱을 설정한다.

타입스크립트는 컴파일 타임에서만 타입 체크가 가능하기 때문에
이런 런타임 타입체커가 도움이 된다.

라이브러리 : io-ts

• https://www.npmjs.com/package/io-ts
• https://github.com/gcanti/io-ts
• https://www.youtube.com/watch?v=nzksxLhj7wc&t=1589s
• https://dev.to/ruizb/using-fp-ts-and-io-ts-types-and-implementation-1k6a
• https://www.tooploox.com/blog/bridging-static-and-runtime-types-with-io-ts
• https://olavihaapala.fi/2019/02/08/runtime-type-checking-in-ts.html
• https://www.azavea.com/blog/2020/10/29/run-time-type-checking-in-typescript-with-io-ts/
• https://kieran.casa/io-ts
• https://medium.com/swlh/typescript-runtime-validation-with-io-ts-456f095b7f86
• https://javascript.plainenglish.io/a-typescript-runtime-data-validators-comparison-eeedc6b0583a
• https://blog.logrocket.com/methods-for-typescript-runtime-type-checking/
• http://www.kononov.space/runtime-type-safety-in-typescript/

==> 이것이 가장 이해가 쉬움.
https://kieran.casa/io-ts

api 통신을 하면 마치 직렬화되어 값을 받게 된다.
이는 객체를 직렬화 해서 비교해 보면 된다.
그래서 decode개념이 들어간다.
type.decode(변수) 이렇게 한 결과 값을 가지고
isRight(결과) 또는 isLeft(결과)를 호출한다.
isRight()은 옳은 것인가? isLeft는 틀린 것인가? 비교하는 함수이다.
둘 중 하나를 사용하면 된다.
result값에 .right을 하면 옳을 때 정상적으로 받은 객체가 들어간다.
result.right.객체내변수 이런식으로 사용가능하다.

사용법 -
https://github.com/gcanti/io-ts/blob/HEAD/index.md