단숨에 배우는 타입스크립트(기초부터 블록체인 실습까지)

이 책은 크게 타입스크립트 문법 설명과 웹 개발 실습, 두 부분으로 구분됩니다. 1부는 타입스크립트를 사용한 짧은 코드 스니펫들을 통해 이해를 도울 겁니다. 2부에서는 타입스크립트를 사용해 블록체인 앱을 다양한 방식으로 만들어볼 겁니다. 만약 타입스크립트 문법과 도구에 대해 빠르게 이해하고 싶다면 1부만 읽으셔도 무방합니다.



제 1장에서는 타입스크립트 기초를 다룹니다. 타입스크립트로 간단한 프로그램을 만들어 본 후 자바스크립트 코드로 컴파일하는 과정을 배웁니다. 타입스크립트 개발에 안성맞춤인 마이크로소프트 사의 비주얼 스튜디오 코드(Visual Studio Code)로 실습을 진행합니다.



제 2장에서는 변수와 함수 선언에 타입을 정의하는 방법을 설명합니다. 타입 키워드 선언, 클래스와 인터페이스를 사용한 커스텀 타입에 대해 알아보고 명목적(nominal)과 구조적(structural) 타입 시스템의 차이에 대해 알아봅니다.



제 3장에서는 클래스 상속과 추상화를 다룹니다. 타입스크립트 인터페이스가 구현 세부 사항을 신경쓰지 않고 클래스에 지정된 메서드를 강제로 부여하는 방법을 설명합니다. 인터페이스 프로그래밍에 대해서도 설명합니다.



제 4장에서는 열거 타입과 제네릭 타입에 대해 알아봅니다. 열거 타입의 장점과 숫자형, 문자형 열거 타입의 문법을 알아보고 제네릭 타입의 장점과 이를 지원하는 클래스 인터페이스 함수의 작성법에 대해서 알아봅니다.



제 5장에서는 데코레이터, 맵핑, 조건 타입에 대해 설명합니다. 타입스크립트의 심화 내용으로 이전 장에서 충분히 타입스크립트에 익숙해져야 이해할 수 있을 것입니다.



제 6장에서는 도구에 대해 설명합니다. 소스맵과 ESLint 사용법을 설명합니다. 웹팩으로 타입스크립트 앱을 컴파일하고 번들링하는 과정을 배웁니다. 바벨을 사용해야 하는 이유에 대해서도 알게 될 것입니다.



제 7장에서는 타입스크립트 앱에 자바스크립트 외부 라이브러리를 도입하는 방법을 설명합니다. 타입 정의를 한 파일의 역할에 대해 알아본 후, 직접 기존 타입스크립트 앱에 자바스크립트 외부 라이브러리를 추가하는 실습이 있습니다. 마지막으로 기존 자바스크립트 프로젝트를 타입스크립트로 변환하는 과정을 알아볼 것입니다.



2부에서는 블록체인 앱에 타입스크립트를 적용합니다. 타입스크립트를 익히는데 블록체인이 무슨 관계가 있나 의문이 생길지도 모르지만 할 일 목록 앱을 만들기보다는 세간의 화두인 기술에 타입스크립트를 적용하는 게 더 좋다고 판단했기에 블록체인을 다루기로 했습니다. 엄청난 앱을 만드는게 오히려 더 실용적이 될 수도 있답니다.

이 프로젝트에서는 타입스크립트를 사용해 블록체인 애플리케이션을 함께 만들어 볼 것입니다. 웹소켓과 더불어 실제 앵귤러(Angular), 리액트(React), 뷰(Vue) 프로젝트를 실습해봅니다. 관심있는 부분만 읽으셔도 좋습니다만 8장과 10장은 기초적인 개념들을 소개하고 있으니 참고하시기 바랍니다.



제 8장부터 본격적인 블록체인 애플리케이션 개발을 시작합니다. 해시 함수, 블록 마이닝 개념에 대해 알아보고 블록체인에 새로운 블록을 추가하기 위한 증명이 필요한 이유를 알아봅니다. 블록체인 기초 지식을 학습한 후 맨 밑바닥부터 프로젝트를 만들어 볼 것입니다. 각 코드에 대한 설명과 더불어 실행 방법이 기술되어 있습니다.



제 9장에서는 블록체인을 위한 웹 클라이언트를 만드는 방법을 설명합니다. 웹 프레임워크 대신에 HTML, CSS, 타입스크립트만을 사용합니다. 브라우저와 독립형 클라이언트 양쪽에서 사용 가능한 해시 생성 라이브러리를 만들어 봅니다. 브라우저에서 타입스크립트를 디버깅하는 방법도 알아봅니다.



제 10장에서는 메시지 서버에서 각 멤버 간 통신을 전파하는 기능을 만들어봅니다. 타입스크립트로 Node.js과 웹소켓을 만들고 다수의 노드들이 상호 검증을 거쳐 올바른 블록 생성을 이끄는 합의 알고리즘(Consensus Algorithm)을 구현해봅니다.



제 11장에서는 타입스크립트를 사용한 앵귤러 웹 개발에 대해 간략히 소개합니다.



제 12장에서는 앵귤러 프레임워크와 타입스크립트로 개발된 블록체인 웹 클라이언트 코드를 살펴봅니다.



제 13장에서는 리액트와 타입스크립트로 개발된 블록체인 웹 클라이언트 코드를 살펴봅니다.



제 14장에서는 뷰와 타입스크립트로 개발된 블록체인 웹 클라이언트 코드를 살펴봅니다.



부록 A는 ECMA스크립트 6, 7, 8에 도입된 문법이 수록되어 있습니다. 클래스, 화살표 함수, 스프레드와 레스트 연산자, 구조 분해에 대해 배울 수 있습니다. async-await 키워드로 비동기 코드를 동기적으로 만드는 방법도 설명합니다. 최신 ECMA스크립트 문법과 타입스크립트 문법이 혼동된다면 먼저 부록 A부터 읽는 것이 좋습니다. 그래야 ECMA스크립트와 타입스크립트의 경계를 알 수 있습니다.

1부. 타입스크립트 문법 완전 정복



제 1장: 타입스크립트 기초

1.1 왜 타입스크립트인가

1.2 타입스크립트 애플리케이션 개발 과정

1.3 타입스크립트 컴파일러

1.4 비주얼 스튜디오 코드

요약



제 2장: 기본 타입과 커스텀 타입

2.1 변수 타입 선언

2.2 커스텀 타입 정의

2.3 any, unknown

2.4 연습 문제

요약



제 3장: 클래스와 인터페이스를 사용한 객체 지향 프로그래밍

3.1 클래스 사용

3.2 인터페이스 사용

요약



제 4장: 열거 타입(Enum)과 제너릭(Generic)

4.1 열거 타입(Enum)

4.2 제네릭(Generic)

요약



제 5장: 데코레이터와 심화 타입

5.1 데코레이터

5.2 맵핑 타입

5.3 조건 타입

요약



제 6장: 도구

6.1 소스맵

6.2 ESLint 린터

6.3 웹팩을 사용한 번들링

6.4 바벨 트랜스파일러

6.5 주목해야 할 타입스크립트 도구

요약



제 7장: 프로젝트에서 타입스크립트와 자바스크립트를 동시에 사용하기

7.1 타입 정의 파일

7.2 자바스크립트 라이브러리를 활용한 타입스크립트 개발 실습

7.3 자바스크립트 프로젝트에 타입스크립트 도입

요약



2부. 타입스크립트로 블록체인 앱 만들기



제 8장: 타입스크립트를 활용한 블록체인 애플리케이션 개발 실습

8.1 블록체인 기초

8.2 블록체인 앱 개발

요약



제 9장: 브라우저 기반 블록체인 노드 개발

9.1 블록체인 앱 실행

9.2 웹 클라이언트

9.3 블록 채굴

9.4 해시 생성을 위한 crypto API 사용

9.5 독립형 블록체인 클라이언트

9.6 브라우저 내 타입스크립트 디버깅

요약



제 10장: Node.js, 타입스크립트, 웹소켓을 사용한 클라이언트-서버 간 통신

10.1 가장 긴 체인 규칙

10.2 블록체인 서버

10.3 프로젝트 구조

10.4 프로젝트 환경 설정

10.5 웹소켓

10.6 알림

요약



제 11장: 타입스크립트 기반 앵귤러 애플리케이션 개발

11.1 앵귤러 CLI로 앱 생성 및 실행

11.2 생성된 앱 살펴보기

11.3 앵귤러 서비스와 의존성 주입

11.4 ProductService 주입

11.5 타입스크립트 추상화 프로그래밍

11.6 HTTP 요청

11.7 폼

11.8 라우터 기초

요약



제 12장: 앵귤러 블록체인 클라이언트 개발

12.1 앵귤러 블록체인 앱

12.2. AppComponent 리뷰

12.3 TransactionFormComponent 컴포넌트

12.4 BlockComponent

12.5 서비스

요약



제 13장: 타입스크립트 리액트 개발

13.1 리액트로 간단한 웹 페이지 생성

13.2 create-react-app 으로 프로젝트 생성하기

13.3 컴포넌트 상태 관리

13.4 날씨 정보 애플리케이션 개발

13.5 가상 DOM

요약



제 14장: 리액트 블록체인 개발

14.1 클라이언트와 메시징 서버 실행하기

14.2 lib 디렉토리 변경 사항

14.3 App 컴포넌트

14.4 프레젠테이션 컴포넌트 TransactionForm

14.5 PendingTransactionPanel 프레젠테이션 컴포넌트

14.6 BlockPanel과 BlockComponent 프레젠테이션 컴포넌트

요약



제 15장: 타입스크립트를 사용한 Vue.js 앱 개발

15.1 간단한 Vue 웹 페이지 개발

15.2 뷰 CLI로 프로젝트 생성 및 시작

15.3 라우터가 추가된 단일 페이지 앱 개발

요약



제 16장: Vue.js 블록체인 개발

16.1 클라이언트 및 메시징 서버 시작

16.2 App 컴포넌트

16.3 TransactionForm 프레젠테이션 컴포넌트

16.4 PendingTransactionsPanel 프레젠테이션 컴포넌트

16.5 BlockPanel 및 Block 프레젠테이션 컴포넌트

요약



마치며



부록. 최신 자바스크립트

야코프 페인 야코프 페인(Yakov Fain)
Farata Systems와 SuranceBay의 공동창립자. 저서로는 〈Java Programming: 24-Hour Trainer〉, 〈Angular Development with TypeScript〉, 〈Java Programming for Kids〉등이 있으며 웹과 자바와 관련된 기술들을 주제로 다양한 수업과 워크샵을 진행했다.