타입스크립트 컴파일러 설치 (JS 강좌 연재)(002) – 하이미디어 분당 웹개발 학원

안녕하세요~ 여기 연재되고 있는 자바스크립트 강좌는 타자 스크립트 예시를 함께 다루므로 타자 스크립트 컴파일러(프로그래밍 언어를 다른 언어로 변환하는 도구)를 설치해 보겠습니다~ 자바스크립트의 경우 컴파일러가 웹 브라우저에 내장되어 있기 때문에 따로 설치할 필요는 없지만 타자 스크립트는 컴파일러가 내장되어 있는 것이 아니라 별도로 설치해야 합니다.Node.jsNode.js는 Chrome의 V8 자바스크립트 engine.nodejs.org 상에 구축된 자바스크립트 런타임입니다.타이프스크립트는 위의 Node.js를 먼저 설치해 주세요. 버전이 두가지인데 그중에서 LTS를 설치해주세요.위와 같은 화면이 나오면 Automatically로 시작하는 곳을 체크해 주세요.그리고 설치를 계속하면 중간에 검은색 화면 창이 뜹니다.위 화면의 창도 Node.js 설치와 관련되어 있으므로 어떤 키를 누르면 파란색 창이 나오고 나서 설치하는 데 시간이 걸리므로 기다려 주시기 바랍니다.설치가 끝나면 윈도우 키+R 키를 눌러주세요.그 다음은 cmd를 입력하고 엔터를 눌러주세요.그 뒤에 나온 검은색 화면의 창에서 node-v를 입력하고 엔터를 입력했을 때 아래와 같이 Node.js 버전이 나타나면 성공적인 설치입니다~이제 유형 스크립트 컴파일러를 설치해야 합니다.아래 시작버튼(윈도우 로고가 그려져 있는 버튼)에 마우스 오른쪽 버튼을 클릭한 후 윈도우 터미널(관리자)을 실행해 주세요.그런 다음 위와 같이 npm i-gtypescript를 입력하고 엔터를 치면 타이프스크립트 컴파일러(tsc)가 설치됩니다~ 그 후에는 타이프스크립트 실행을 위해 npm i-gts-node도 입력하고 엔터를 눌러주세요~이제 tsc를 실행해 보겠습니다.윈도우 익스플로러를 열고 어떤 폴더에서든 마우스 오른쪽 버튼을 누르면 아래와 같은 메뉴가 나타납니다.위 메뉴에서 새로 만들기 – 텍스트 문서로 가십시오.그런 다음 텍스트 문서가 작성되면 이름을 a로 바꾼 후 그것을 더블 클릭하십시오.위 메뉴에서 새로 만들기 – 텍스트 문서로 가십시오.그런 다음 텍스트 문서가 작성되면 이름을 a로 바꾼 후 그것을 더블 클릭하십시오.위와 같이 메모장이 나타나면 파일 – 다른 이름으로 저장에 들어가세요.위와 같이 파일형식에는 모든 파일을 선택하시고 파일명을 a.ts로 저장해주세요..js파일은 자바스크립트파일, .ts파일은 타자스크립트파일이라서 비어있는 타자스크립트파일을 [만든거에요~방금 파일을 작성한 익스플로러로 돌아가서 주소창에 cmd를 입력하고 엔터를 눌러주세요.그러면 검은 화면의 명령 프롬프트 창이 열립니다.거기서 tsca를 입력하고 엔터를 눌러주세요.위 화면처럼 별다른 메시지가 없고, 행정만 바뀌어서 아까 폴더에 a.js가 생기면 성공이에요~ 타자기 컴파일러(TSC)가 타자기 파일(TS)을 웹브라우저에서 사용할 수 있는 자바스크립트 파일(JS)로 바꿨거든요~ 이렇게 타자기를 다룰 준비가 됐어요~ 타자기는 자바처럼 자료형을 표시하기 때문에 자바에 익숙한 분들이 다루기 더 편리해요!따라서 본 연재에서는 자바스크립트를 다룰 때 타이프 스크립트 실습 예시도 함께 올리겠습니다~ 자바스크립트 학습과 웹 개발에 대해 궁금한 점이 있으시면 아래로 연락주세요!국비지원 최대 816000원 훈련수당 하이미디어 성남/모란/분당웹개발학원 문의전화 031-736-0008