둘 다 기술적으로는 transpile 해주는게 맞기는 한데, 둘은 용도가 서로 전혀 다른겁니다.
js가 강타입 언어가 아니다 보니까 코딩시에 여러 실수도 나오고, 버그 발생 시 오류를 찾기도 힘들고 하는 그런 문제들이 있죠.
그래서 MS에서 강타입 언어처럼 사용되도록 만든것인 TypeScript 입니다.
그래서 컴파일 타임에 타입에 대한 오류를 잡아줄 수 있고, 강력한 디버깅툴도 제공이 됩니다.
TypeScript의 컴파일 결과가 js로 나오니, transpile 처럼 보이기도 합니다.
하지만 js를 확장한 새로운 언어라고 보는 것이 맞는 관점입니다.
babel이 진짜 transpile 이죠. js가 버전이 높아지면서 발전하고 있지만, 클라이언크측의 브라우저들은 지원을 못하는 경우들이 있어서
새로운 버전의 문법으로 코딩해도 옛날 버전에서 동작할 수 있도록 transpile 해주는 것이죠.
이 둘을 섞어서 TypeScript로 개발하고, 컴파일 결과를 babel을 돌려 실행하면
개발간에는 강타입의 안정함과 강력한 디버깅 툴을 사용할 수 있게 되면서
결과물은 낮은 버전의 js를 지원하는 브라우저에서도 호환될 수 있을 겁니다.