typescript

(Effective Typescript) 이펙티브 타입스크립트 스터디 시작!

먼 옛날에 사뒀던 책을 이제야 공부하려고 한다. 마이크로소프트가 만든 괴물인 "Typescript". 벌써 버전이 4.9버전이다. 먼 미래에는 5를 넘어 새로운 버전이 계속 생겨있겠지. 이 책은 2021년에 2쇄가 찍힌 책이다. 본문의 내용으로 말미암아 2.1버전 근처의 타입스크립트로 작성된 것으로 보인다. 그동안 deprecated 된 것이 있는지도 살펴보고 타입스크립트의 Best Practice가 뭔지도 알아보려고 한다. 혼자 하기는 당연히 어렵기에 다른 콘텐츠의 도움을 받아보려고 한다. 바로 인프런의 영상인데, 하단에 링크를 남겨두었다. 참고 1. 이펙티브 타입스크립트 스터디 https://www.inflearn.com/course/%EC%9D%B4%ED%8E%99%ED%8B%B0%EB%B8%8C-..

2. Parcel.js로 타입스크립트 컴파일

1. Node 프로젝트 세팅 및 Parcel.js 세팅 npm 세팅을 위해 프로젝트 세팅을 해준다. 해당 프로젝트에서 터미널 호출 후 타이핑 npm init 프로젝트명, 버전, 라이센스 등을 정의하고 시작하자. 이제 parcel을 설치해줄 차례다. 터미널에서 아래 명령어 타이핑 npm i parcel-bundler 혹시 parcel.js index.html이 안된다면, npx로 실행하자. npx는 모듈을 임시로 설치하고 실행만 하는 것이기 때문에 해당 모듈이 설치되어 있지 않아도 실행된다. npx parcel index.html 그러면 번들링이 성공적으로 되고,, dist에 완성본 파일이 담긴다. dist 폴더에 있는 .js.map은 tsconfig.json에 있는 "sourceMap": true 에서 ..

1. 타입스크립트(Typescript) 세팅하기 - tsconfig.json

1. tsconfig.json에 대하여 타입스크립트를 자바스크립트로 변환(컴파일-프로그래밍 언어를 다른 언어로 변경함)할 때 여러 가지 옵션을 줘서 다양한 방식으로 변경할 수가 있다. 자바스크립트를 공부한 사람이라면 알고 있듯이, 자바스크립트는 표준 자체만으로도 버전이 엄청나게 많다. 그래서 타입스크립트 변환 옵션 중에 대표적인 것이 어떤 버전의 자바스크립트로 타깃 하느냐도 있다. 이 옵션은 대부분의 node 프로젝트와 같이 json파일 규격으로 지정해두는데, 타입스크립트를 위한 옵션 파일은 파일명을 "tsconfig.json"으로 지정해야한다. 먼저 tsconfig.json을 생성해보자. tsconfig.json { "compilerOptions": { "strict": true, "target": "..

0. Hackers News 자바스크립트 코드 타입스크립트로 마이그레이션 시작

1. 타입스크립트란? 타입스크립트(Typescript)는 타입이 유연한 자바스크립트에 좀 더 엄격하게 타입을 줄 수 있는 언어이다. 타입을 명시할 수 있는 버전의 자바스크립트라고 생각하면 되고, 여러 실수를 잡기 위해서 타입스크립트로 코딩한 다음에 자바스크립트로 변환해서 사용한다. 2. 변환할 코드 타입스크립트 공부를 위해서 Hackers News API를 통해 간단하게 구현한 예제를 사용할 것이다. 아래 예제를 타입스크립트로 부분적으로 바꿔볼 것이고, 바꾸면서 장점에 대해서도 함께 기술할 예정이다. 본 수업은 패스트캠퍼스의 "김민태의 프론트엔드 아카데미 : 제 1강 JS & TS Essential"의 내용을 따왔다. 예제 코드: index.html app.js const container = docum..