# Guide

  • 본 카테고리는 vue.js 에 TypeScript(TS)를 적용하자는 생각으로 TS를 공부하고 기록한 내용으로 구성되어 있습니다.
  • 사전 준비
    • vue create를 통해 프로젝트를 만들었다고 가정하고 vue.js 코드 위에 ts 예제를 적습니다.

주로 다음과 같은 내용들이 포스팅 됩니다.

  1. TS 주요 개념
  2. vue에 대입하여 사용되는 ts 예제
  3. vue + ts 이용한 toy 프로젝트에 해결하기 어려웠던 점

TypeScript 란 무엇인가?

  • 자바스크립트에 타입이라는 개념이 추가된 언어로 es7 이하 모든 표준을 포함하고 있기에, js의 최신 문법도 사용할 수 있다. ts는 정적 타입 언어 이기에 js보다 컴파일시 시간이 조금 더 오래 걸리지만 안정성을을 보장한다.

TypeScript 를 쓰려고 하는가?

  1. object, array내 들어올 값 파악
  • 기존 만들어져 있는 코드를 유지보수, 추가 개발을 하기 위해서는 데이터 형태를 이해해야 합니다. 이때마다 network 탭을 보거나 콘솔을 통해 데이터를 파악하는데, ts의 경우 미리 타입을 정의해놓은 상태이기에 타인도 빠르게 데이터를 파악할 수 있습니다.
  1. 컴파일 전 (코드 실행 전) 버그 찾기
  • 함수 및 객체내 들어올 타입이 미리 정해져 있기에, 코딩을 할때 그 값의 타입이 맞지 않으면 에디터 내에서 오류를 띄웁니다. 즉, 컴파일 해서 오류창을 보기 전 빠르게 개발을 진행할 수 있습니다.
  1. api payload 값이 변경되어 들어오는 값의 이름 또는 타입이 바뀌게 되면, js의 경우 바뀐 값들도 에러 없이 가져오기에 추적을 하는데 시간이 오래 걸리나, ts의 경우 바뀐 api가 바뀌는 즉시, 감지하기에 payload 값 변경에 대해 빠르게 반응 할 수 있습니다.
Last Updated: 3/24/2021, 8:55:12 PM