deploy: 5274218

game-of-life/debugging.html

@@ -174,7 +174,7 @@ <h1 class="menu-title">Rust and WebAssembly</h1>
                 <div id="content" class="content">
                     <main>
                         <h1 id="디버깅"><a class="header" href="#디버깅">디버깅</a></h1>
-<p>코드를 더 작성하기 전에, 디버깅 툴들을 살펴보고 한번 장전해보도록 합시다. 관심이 있다면 <a href="../reference/debugging.html">Rust로 WebAssembly 바이너리를 생성하는 데에 사용해볼수 있는 접근방법과 툴에 대해 다루는 참조 페이지</a>도 확인해보세요!</p>
+<p>코드를 더 작성하기 전에, 디버깅 툴들을 살펴보고 한번 장전해보도록 합시다. 관심이 있다면 <a href="../reference/debugging.html">Rust로 WebAssembly 바이너리를 생성하는 데에 사용해볼수 있는 접근방법과 툴에 대해 다루는 참조 페이지</a> 도 확인해보세요!</p>
 <h2 id="패닉-로그-활성화하기"><a class="header" href="#패닉-로그-활성화하기">패닉 로그 활성화하기</a></h2>
 <p><a href="../reference/debugging.html#logging-panics">코드가 패닉할 때 개발자 콘솔에 도움이 되는 에러 메세지를 표시해보면 좋습니다.</a></p>
 <p>필수로 사용해야 하진 않지만 <code>wasm-pack-template</code>은 <code>wasm-game-of-life/src/utils.rs</code> 파일에 기본으로 활성화 돼 있는 종속성인 <a href="https://github.com/rustwasm/console_error_panic_hook">the <code>console_error_panic_hook</code> 크레이트</a>를 포함합니다. 이 훅(hook)을 생성자에 포함시켜주면 이 기능을 사용할 수 있습니다. <code>wasm-game-of-life/src/lib.rs</code> 파일 내의 <code>Universe::new</code> 생성자에서 불러보도록 하겠습니다.</p>
@@ -242,7 +242,7 @@ <h2 id="game-of-life-구현에-로그-기능-추가하기"><a class="header" hre
 </code></pre>
 <h2 id="디버깅-툴debugger-를-사용하여-매-틱마다-일시정지-시키기"><a class="header" href="#디버깅-툴debugger-를-사용하여-매-틱마다-일시정지-시키기">디버깅 툴(debugger) 를 사용하여 매 틱마다 일시정지 시키기</a></h2>
 <p><a href="../reference/debugging.html#using-a-debugger">브라우저 디버깅 툴은 Rust로 작성한 WebAssembly와 상호작용하는 JavaScript 코드를 살펴볼 때 유용합니다.</a></p>
-<p>예를 들어서, <code>universe.tick()</code> 호출 이전에 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/debugger">JavaScript 코드의 <code>debugger;</code> 줄</a>을 추가하면 디버깅 툴을 사용하여 <code>renderLoop</code>의 매 순회마다 코드 실행을 일시정지 시킬 수 있게 됩니다.</p>
+<p>예를 들어서, <code>universe.tick()</code> 호출 이전에 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/debugger">JavaScript 코드에 <code>debugger;</code> 줄</a>을 추가하면 디버깅 툴을 사용하여 <code>renderLoop</code>의 매 순회마다 코드 실행을 일시정지 시킬 수 있게 됩니다.</p>
 <pre><code class="language-js">const renderLoop = () =&gt; {
   debugger;
   universe.tick();

game-of-life/implementing.html

@@ -194,7 +194,7 @@ <h3 id="rust와-javascript-코드끼리-연결하기"><a class="header" href="#r
 <blockquote>
 <p>⚡ 다음 내용은 이 튜토리얼에서 다루는 내용 중에서도 아주 중요한 내용입니다. 이 내용을 이해하면서 얻어갈 수 있는 부분이 많습니다!</p>
 </blockquote>
-<p>JavaScript는 <code>Object</code>, <code>Array</code> 그리고 <a href="https://developer.mozilla.org/ko/docs/Glossary/Node/DOM">DOM 노드 (node)</a>들이 할당되는 가비지 콜렉터가 관리하는 힙을 사용하지만, 작성하게 될 Rust 코드의 선형 메모리는 별개의 공간을 사용하게 됩니다. WebAssembly는 현재로써는 가비지 콜렉터가 관리하는 힙에 직접 접근할수 없습니다. (2018년 4월 기준으로, <a href="https://github.com/WebAssembly/interface-types/blob/master/proposals/interface-types/Explainer.md">"Interface Types" proposal</a>과 함께 변경될 전망이긴 합니다.) 반면에 JavaScript는 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer"><code>ArrayBuffer</code></a>나 스칼라 값 (scalar values / <code>u8</code>, <code>i32</code>, <code>f64</code>, 등...)만으로라도 이 선형 메모리를 읽고 쓸수 있습니다. 이런 내용을 기반으로 모든 WebAssembly와 JavaScript 사이의 커뮤니케이션이 구성되게 됩니다.</p>
+<p>JavaScript는 <code>Object</code>, <code>Array</code> 그리고 <a href="https://developer.mozilla.org/ko/docs/Glossary/Node/DOM">DOM 노드(node)</a>들이 할당되는 가비지 콜렉터가 관리하는 힙을 사용하지만, 작성하게 될 Rust 코드의 선형 메모리는 별개의 공간을 사용하게 됩니다. WebAssembly는 현재로써는 가비지 콜렉터가 관리하는 힙에 직접 접근할수 없습니다. (2018년 4월 기준으로, <a href="https://github.com/WebAssembly/interface-types/blob/master/proposals/interface-types/Explainer.md">"인터페이스 타입" 제안</a> 과 함께 변경될 전망이긴 합니다.) 반면에 JavaScript는 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer"><code>ArrayBuffer</code></a>나 스칼라 값 (scalar values / <code>u8</code>, <code>i32</code>, <code>f64</code>, 등...)만으로라도 이 선형 메모리를 읽고 쓸수 있습니다. 이런 내용을 기반으로 모든 WebAssembly와 JavaScript 사이의 커뮤니케이션이 구성되게 됩니다.</p>
 <p><code>wasm_bindgen</code>는 이 경계를 사이로 어떻게 구조체(compound structure)들을 주고받아야 하는지 정해주는 역할을 합니다. 이러한 작업은 Rust 구조체를 박싱(boxing)하고, 쉽게 사용하기 위해 JavaScript 클래스에 포인터를 랩핑(wrapping)하고, Rust 코드에서 JavaScript 객체 테이블을 인덱싱(indexing)하는 과정을 포함합니다. <code>wasm_bindgen</code>은 매우 간편하지만, 데이터 표현 설계를 모두 대신 해주진 않습니다. 원하는 방식으로 인터페이스 설계를 구현할수 있도록 도와주는 도구 정도로 생각해주세요.</p>
 <p>WebAssembly와 JavaScript 사이의 인터페이스를 설계할 때, 다음 내용들을 최적화 작업 시 고려해야 합니다:</p>
 <ol>

game-of-life/publishing-to-npm.html

@@ -176,7 +176,7 @@ <h1 class="menu-title">Rust and WebAssembly</h1>
                         <h1 id="npm에-배포하기"><a class="header" href="#npm에-배포하기">npm에 배포하기</a></h1>
 <p>이제 잘 작동하는 빠르고 작은 <code>wasm-game-of-life</code> 패키지가 있으니, 다른 JavaScript 개발자들이 Game of Life 코드를 바로 받아 사용해야 할 때 종속성으로 사용할수 있도록 npm에 배포해보겠습니다.</p>
 <h2 id="준비-사항"><a class="header" href="#준비-사항">준비 사항</a></h2>
-<p>우선, <a href="https://www.npmjs.com/signup">npm 계정이 있는지 확인해주세요</a>.</p>
+<p>우선, <a href="https://www.npmjs.com/signup">기존에 생성된 npm 계정이 있는지 확인해주세요</a>.</p>
 <p>그 다음, 다음 명령어를 실행하여 로컬 머신에서 계정에 로그인돼 있는지 확인해주세요:</p>
 <pre><code>wasm-pack login
 </code></pre>