추가 적립 안내

웹어셈블리가 무엇인지, 웹어셈블리 모듈을 어떻게 작성하고 빌드하는지가 궁금하다면 이 책을 보자. 작성한 웹어셈블리 모듈과 자바스크립트가 어떻게 상호작용하는지, 웹어셈블리를 이용해서 어떤 웹 애플리케이션을 만들 수 있는지 자세히 배울 수 있다.

★ 이 책에서 다루는 내용 ★

■ 웹어셈블리의 개념과 관련 요소(텍스트 포맷, 모듈, 자바스크립트 API)
■ 웹어셈블리 모듈 생성과 로드, 디버깅(에디터와 컴파일러, 툴체인)
■ C와 웹어셈블리를 이용한 고성능 애플리케이션 작성 방법
■ 기존의 C++로 작성된 게임을 Emscripten을 이용해 웹어셈블리로 포팅
■ 웹어셈블리의 향후 기능과 Node.js와의 통합, 또 다른 컴파일 방법

★ 이 책의 대상 독자 ★

웹을 위한 애플리케이션을 만들고자 하는 C/C++ 프로그래머이거나 자바스크립트 애플리케이션의 성능을 향상시키고자 하는 웹 개발자라면 이 책은 여러분을 위한 책이다. 이 책은 C와 C++를 배우는 것을 개의치 않는 자바스크립트 개발자나 또는 그 반대 경우의 개발자를 대상으로 한다. C/C++ 프로그래머와 자바스크립트 프로그래머를 위해 두 가지의 예제를 제공한다.

★ 이 책의 구성 ★

1장, ‘웹어셈블리란 무엇인가’에서는 웹어셈블리의 기원과 기술에 관해 개요를 간략하게 설명한다. 웹어셈블리가 어떻게 사용되고, 어떤 프로그래밍 언어가 지원되는지, 현재 어떤 제한이 있는지 설명한다.
2장, ‘웹어셈블리의 요소 - Wat, Wasm, 그리고 자바스크립트 API’에서는 웹어셈블리를 구성하는 요소를 설명한다. 텍스트 포맷과 바이너리 포맷을 자세히 설명하며 이와 관련된 자바스크립트 API와 Web API에 대해서도 설명한다.
3장, ‘개발 환경 세팅’에서는 웹어셈블리로 개발하는 데 사용되는 도구를 알아본다. 각 플랫폼별 설치 방법과 개발 경험을 향상시키기 위한 권장 내용도 포함한다.
4장, ‘필수 종속성 설치’에서는 각 플랫폼별로 설치가 필요한 툴체인 설치 방법을 제공한다. 4장을 통해 C와 C++를 웹어셈블리 모듈로 컴파일할 수 있게 될 것이다.
5장, ‘웹어셈블리 모듈 생성과 로딩’에서는 Emscripten을 이용해 웹어셈블리 모듈을 만드는 방법과 컴파일러 출력물에 영향을 주는 플래그를 컴파일러에 전달하는 방법을 설명한다. 브라우저에서 웹어셈블리 모듈을 로딩하는 기술에 대해서도 설명한다.
6장, ‘자바스크립트와의 상호작용과 디버깅’에서는 Emscripten의 Module 객체와 브라우저의 전역 WebAssembly 객체와의 차이에 대해 자세히 설명한다. Emscripten이 제공하는 기능과 소스 맵을 만드는 절차에 대해서도 설명한다.
7장, ‘웹 어셈블리 애플리케이션 만들기’에서는 웹어셈블리 모듈과 상호작용하는 자바스크립트 회계 애플리케이션을 만들어 볼 것이다. 회계 거래를 계산하고 자바스크립트와 컴파일된 웹어셈블리 모듈 간에 데이터를 전단하기 위한 C 코드를 작성할 것이다.
8장, ‘Emscripten으로 게임 포팅’에서는 기존의 C++ 게임을 Emscripten을 이용해서 웹어셈블리로 포팅하는 과정을 단계별로 설명한다. 기존의 C++ 코드를 검토한 후에는 게임이 브라우저에서 실행될 수 있도록 적절히 파일을 수정할 것이다.
9장, ‘Node.js와 통합’에서는 서버와 클라이언트에서 Node.js와 npm이 웹어셈블리에서 어떻게 사용되는지 설명한다. Express 애플리케이션에서의 웹어셈블리 사용과 웹어셈블리와 webpack과의 통합 그리고 Jest를 이용해서 웹어셈블리를 테스트하는 방법을 설명한다.
10장, ‘고급 도구와 향후 기능’에서는 고급 도구와 사용 사례, 현재 표준화 절차에 있는 새로운 웹어셈블리의 기능을 설명한다. 또한 WABT과 Binaryen, 온라인에서 사용 가능한 도구에 관해서도 설명한다. LLVM을 이용해서 웹어셈블리 모듈로 컴파일하는 방법과 Web Workers와 웹어셈블리가 어떻게 함께 사용되는지에 대해서도 배우게 될 것이다. 표준화 절차와 스펙에 추가되기 위한 과정에 있는 몇 가지 흥미로운 기능을 살펴본다.

★ 옮긴이의 말 ★

웹어셈블리는 기존의 웹 애플리케이션 개발 패러다임을 바꿀 수 있는 기술로, 앞으로 어떻게 성장하고 발전해 나갈 것인지 관심 갖고 지켜봐야 하는 분야다. 아직 일반적으로 사용되기에는 진입 장벽이 있고 부족한 점도 있지만 기술 자체의 개념과 목적, 필요성이 명확하기 때문에 대부분의 웹 브라우저 벤더에서 이미 웹어셈블리를 지원하고 있다.
비록 지금은 다른 웹 기술에 비해서 상대적으로 많은 관심을 받거나 사용되는 것은 아니지만, 웹어셈블리를 사용해 기존보다 빠른 성능의 웹 애플리케이션을 만들 수 있다. 그리고 이를 통해서 사용자들에게 다양하고 풍부한 웹 경험을 제공할 수 있다. 비단 PC나 모바일의 웹 브라우저 기반의 웹 애플리케이션뿐만 아니라, 잠재적으로 IoT나 자동차, 로봇 등 다양한 플랫폼에도 네이티브 애플리케이션처럼 적용이 가능하다고 생각한다.
이 책을 통해 웹어셈블리가 무엇이며, 웹어셈블리 모듈을 어떻게 작성하고 빌드하는지, 작성한 웹어셈블리 모듈과 자바스크립트가 어떻게 상호작용하며 웹어셈블리를 이용해서 어떤 웹 애플리케이션을 만들 수 있는지 자세히 알게 될 것이다.

지은이 소개
기술 감수자 소개
옮긴이 소개
옮긴이의 말
들어가며

1장. 웹어셈블리란 무엇인가
__웹어셈블리로의 여정
____자바스크립트의 진화
____구글과 네이티브 클라이언트
____모질라와 asm.js
____웹어셈블리의 탄생
__웹어셈블리가 정확히 무엇이고 어디에 사용할 수 있는가?
____공식적인 정의
____Core Specification
____자바스크립트와 Web API
____그렇다면 웹어셈블리가 자바스크립트를 대체할까?
____어디에서 사용할 수 있을까?
__어떤 언어가 지원되는가?
____C와 C++
____Rust
____다른 언어들
__웹어셈블리의 한계는 무엇인가?
____가비지 컬렉션()이 없음
____DOM에 대한 직접적인 접근이 없음
____오래된 브라우저에 대한 지원이 없음
__Emscripten과의 관계
____Emscripten의 역할
____EMSDK와 Binaryen
__요약
__질문
__추가 자료

2장. 웹어셈블리의 요소 - Wat, Wasm 그리고 JavaScript API
__공통 구조와 추상 구문
__Wat
____정의와 S-표현
____값, 타입 그리고 명령
____개발 과정에서의 역할
__바이너리 포맷과 모듈 파일
____정의와 모듈 개요
____모듈 섹션
__자바스크립트 API와 Web API
____웹어셈블리 저장소와 객체 캐시
____모듈 로딩과 웹어셈블리 네임스페이스 메소드
____WebAssembly 객체
__WasmFiddle을 이용한 개념 연결
____WasmFiddle이란?
____C 코드에서 Wat로
____Wasm에서 자바스크립트로
__요약
__질문
__추가 자료

3장. 개발 환경 세팅
__개발 툴 설치
____운영체제와 하드웨어
____패키지 매니저
____Git
____Node.js
____GNU make와 rimraf
____VS Code
__VS Code 설정
____설정과 사용자 정의 관리
____확장 프로그램 개요
____C/C++와 웹어셈블리를 위한 설정
____다른 유용한 확장 프로그램들
____Bracket pair colorizer
__웹을 위한 설정
____책 예제 코드 저장소 복제
____로컬 서버 설치
____브라우저 확인
__다른 툴들
____맥OS를 위한 iTerm2
____우분투를 위한 Terminator
____윈도우를 위한 cmder
____Zsh와 Oh-My-Zsh
__요약
__질문
__추가 자료

4장. 필수 종속성 설치
__개발 워크플로
____워크플로의 단계
____워크플로에 툴을 통합
__Emscripten과 EMSDK
____Emscripten 개요
____EMSDK는 어디에 적합한가?
__필수 구성 요소 설치
____공통적으로 필요한 필수 구성 요소
____맥OS에 필수 구성 요소 설치하기
____우분투에 필수 구성 요소 설치하기
____윈도우에 필수 구성 요소 설치하기
__EMSDK 설치와 설정
____모든 플랫폼에서의 설치 절차
____맥OS와 우분투에서의 설치
____윈도우에서의 설치와 설정
____VS Code 설정
__컴파일러 테스트
____C 코드
____C 코드 컴파일
__요약
__질문
__추가 자료

5장. 웹어셈블리 모듈 생성과 로딩
__글루 코드로 C 컴파일
____예제 C 코드 작성
____예제 C 코드 컴파일
__Emscripten 모듈 로딩
____사전에 생성된 로딩 코드
____사용자 정의 로딩 코드 작성
__글루 코드 없이 C 컴파일
____웹어셈블리를 위한 C 코드
____VS Code의 Build Task로 컴파일
__Wasm 파일을 가져오고 인스턴스화하기
____일반적인 자바스크립트 로딩 코드
____HTML 페이지
____실행과 테스트
__요약
__질문
__추가 자료

6장. 자바스크립트와의 상호작용과 디버깅
__Emscripten Module과 WebAssembly 객체
____Emscripten의 Module이 무엇일까?
____글루 코드의 디폴트 메소드
____WebAssembly 객체와의 차이점
__자바스크립트에서 컴파일된 C/C++ 함수 호출
____Module에서 함수 호출
____웹어셈블리 인스턴스에서 함수 호출
__C/C++에서 자바스크립트 함수 호출
____글루 코드를 이용한 자바스크립트와의 통합
____글루 코드 이용 예
____글루 코드 없이 자바스크립트와 통합
____글루 코드 없는 예
__고급 Emscripten 기능
____Embind
____파일 시스템 API
____Fetch API
__브라우저에서 디버깅
____하이 레벨의 개요
____소스 맵 이용
__요약
__질문
__추가 자료

7장. 웹어셈블리 애플리케이션 만들기
__분식 회계-웹어셈블리를 신뢰성 있게 만들기
____개요와 기능
____사용된 자바스크립트 라이브러리
____C와 빌드 절차
____프로젝트 셋업
____Node.js 설정
____파일과 폴더 추가
____빌드 절차 설정
____목업 API 설정
____C stdlib Wasm 다운로드
____최종 결과
__C 부분 빌드
____개요
____C 파일 내용
____Wasm으로 컴파일
__자바스크립트 부분 빌드
____개요
____initializeWasm.js에서 Wasm 인스턴스 생성
____WasmTransactions.js에서 Wasm과 상호작용
____api.js에서 API 이용
____store.js에서 전역 상태 관리
____main.js에서 애플리케이션 로드
____웹 자산 추가
____Vue 컴포넌트 생성
__애플리케이션 실행
____/src 폴더 확인
____시작!
____테스트
____마무리
__요약
__질문
__추가 자료

8장. Emscripten으로 게임 포팅
__게임의 개요
____테트리스 게임
____소스코드의 출처
____테트리스 소스코드 가져오기
____네이티브 프로젝트 빌드
____게임 실행
__코드의 세부 내용
____코드를 객체로 분해하기
____constants 파일
____piece 클래스
____Board 클래스
____Game 클래스
____main.cpp 파일
____Emscripten으로 포팅
____포팅을 위한 준비
____무엇이 변경되는가?
____웹 자산 추가
____기존 코드 포팅
__게임 빌드와 실행
____VS Code Task로 빌드
____Makefile로 빌드
____게임 실행
__요약
__질문
__추가 자료

9장. Node.js와 통합
__왜 Node.js인가?
____매끄러운 통합
____상호 보완적인 기술
____npm으로 개발
__xpress를 이용한 서버 사이드 웹어셈블리
____프로젝트 개요
____Express 설정
____Node.js로 Wasm 모듈 인스턴스화
____목업 데이터베이스 만들기
____웹어셈블리 모듈과의 상호작용
____애플리케이션 빌드와 실행
__Webpack을 이용한 클라이언트 사이드 웹어셈블리
____프로젝트 개요
____Webpack이 무엇인가?
____Webpack 설치와 설정
____C 코드
____자바스크립트 코드
____애플리케이션 빌드와 실행
__Jest로 웹어셈블리 모듈 테스트
____테스트 대상 코드
____테스트 설정
____테스트 파일
____테스트 실행
__요약
__질문
__추가 자료

10장. 고급 도구와 향후 기능
__WABT와 Binaryen
____WABT-웹어셈블리 바이너리 툴킷
____Binaryen
__LLVM으로 컴파일
____설치 과정
____예제 코드
____컴파일과 실행
__온라인 도구
____WasmFiddle
____WebAssembly Explorer
____WebAssembly Studio
__Web Workers로 Wasm 병렬 처리
____Web Workers와 웹어셈블리
____코드의 개요
____C 코드
____자바스크립트 코드
____웹 자산
____애플리케이션 빌드와 실행
__향후 기능
____표준화 절차
____스레드
____호스트 바인딩
____가비지 컬렉션
____레퍼런스 타입
__요약
__질문
__추가 자료

찾아보기