Merge pull request #129 from jiwnchoi/main

ko-translation: fix typo

webgpu/lessons/ko/webgpu-fundamentals.md

@@ -58,7 +58,7 @@ WebGPU는 아주 저수준(low-level)의 API입니다. 작은 예제를 만들 
     * `'triangle-list'`: 3개 위치마다 삼각형을 그림 (**기본값(default)**)
     * `'triangle-strip'`: 새로운 위치와 이전 마지막 2개 위치로 삼각형을 그림
 
-정점 셰이더는 색상값을 계산합니다[^fragment-output]. 
+프래그먼트 셰이더는 색상값을 계산합니다[^fragment-output]. 
 삼각형이 그려지면, 그려질 각 픽셀마다 GPU는 프래그먼트 셰이더를 호출(call)합니다.
 그리고 프래그먼트 셰이더는 색상을 반환합니다.
 
@@ -679,7 +679,7 @@ WebGPU 버퍼로부터 데이터를 직접 읽을 수는 없다는 점을 유념
 셰이더에 버퍼의 존재를 알려주기 위해서는 바인드그룹을 만들어야 합니다.
 
 ```js
-  // 셰산을 위해 어떤 버퍼를 사용해야 할지 알려주기 위해 바인드그룹을 설정함
+  // 계산을 위해 어떤 버퍼를 사용해야 할지 알려주기 위해 바인드그룹을 설정함
   const bindGroup = device.createBindGroup({
     label: 'bindGroup for work buffer',
     layout: pipeline.getBindGroupLayout(0),

webgpu/lessons/ko/webgpu-storage-buffers.md

@@ -49,7 +49,7 @@ uniform 버퍼와 스토리지 버퍼의 주요한 차이점은 아래와 같습
 
   사용 법에 따라 다를 수 있습니다. 일반적인 앱에서는 여러가지 다른 것들을 그려야 합니다.
   3D 게임의 예를 들어보죠. 앱에서 자동차, 건물, 바위, 덤불, 사람 등등을 그려야 합니다.
-  이들 각각에 대한 자세와 머티리얼(material) 속성 등을 위 예제와 같이 넘겨주어야 합니다.
+  이들 각각에 대한 방향(orientation)과 머티리얼(material) 속성 등을 위 예제와 같이 넘겨주어야 합니다.
   이러한 경우 uniform 버퍼를 사용하는 것이 좋은 방법입니다.
 
 2. 스토리지 버퍼는 uniform 버퍼보다 훨씬 클 수 있음

webgpu/lessons/ko/webgpu-uniforms.md

@@ -230,7 +230,7 @@ scale은 절반 크기로 하였고 캔버스의 종횡비(aspect ratio)를 고
 
 그러니 우리는 그리기를 원하는 상태 하나당 하나의 uniform 버퍼를 만들 것입니다. 
 그리고 버퍼는 바인드 그룹을 통해 간접적으로 사용되니 그리기를 원하는 것 하나마다 하나의 바인드 그룹을 만듭니다.
-그리고 모든 그리기를 원하는 것을 하나의 커맨드 버퍼에 넣을 겁닏.
+그리고 모든 그리기를 원하는 것을 하나의 커맨드 버퍼에 넣을 겁니다.
 
 한 번 해 보죠.
 
@@ -474,7 +474,7 @@ device.queue.submit([commandBuffer]);
 
 {{{example url="../webgpu-simple-triangle-uniforms-split.html"}}}
 
-이 간단한 예제에서 uniform 버퍼를 구분하는 것은 과할 수고 있지만, 언제 무엇이 변하는지에 따라 구분하는 것이 일반적입니다.
+이 간단한 예제에서 uniform 버퍼를 구분하는 것은 과할 수도 있지만, 언제 무엇이 변하는지에 따라 구분하는 것이 일반적입니다.
 예를 들어 공유되는 행렬에 대한 uniform 버퍼가 있습니다. 
 투영(project), 뷰(view)/카메라 행렬이 있을 수 있겠죠.
 대부분 이 값들은 우리가 그리고자 하는 대상에 대해 동일한 값을 사용하기 때문에 하나의 버퍼를 만들어서 모든 객체가 동일한 uniform 버퍼를 사용하게 하면 됩니다.
@@ -483,6 +483,6 @@ device.queue.submit([commandBuffer]);
 
 또 다른 uniform 버퍼는 머티리얼(material) 세팅값을 가지고 있을 수 있습니다. 이러한 세팅값은 여러 객체에서 공유될 것입니다.
 
-이러한 내용은 3D 그리기 많이 활용할 것입니다.
+이러한 내용은 3D 그리기를 다룰 때 많이 활용할 것입니다.
 
 다음은 [스토리지 버퍼(storage buffer)](webgpu-storage-buffers.html)입니다.

webgpu/lessons/ko/webgpu-vertex-buffers.md

@@ -8,9 +8,9 @@ TOC: 정점 버퍼
 넘기는 방법은 정점 버퍼와 어트리뷰트(attribute)를 사용하는 방법입니다.
 
 정점 버퍼는 다른 WebGPU 버퍼들과 다를 바 없습니다. 데이터를 저장하죠.
-차이점이라면 정점 셰이더로부터 직접 접근하지 않는다는 점입니다.
+차이점이라면 정점 셰이더에서 직접 접근하지 않는다는 점입니다.
 대신에, WebGPU에게 어떤 데이터가 버퍼에 있고, 어떤 구조로 저장되어 있는지 알려줍니다.
-그러면 데이터를 버퍼로부터 가져와 전달해줍니다.
+그런 다음 데이터를 버퍼로부터 가져와 전달해줍니다.
 
 [지난 글](webgpu-storage-buffers.html)의 마지막 예제를 가져와서, 
 스토리지 버퍼 대신에 정점 버퍼를 사용하도록 수정해 보겠습니다.
@@ -531,7 +531,7 @@ function createCircleVertices({
 
 {{{example url="../webgpu-vertex-buffers-per-vertex-colors.html"}}}
 
-## <a id="a-default-values"></a>WESL의 어트리뷰트와 자바스크립트 어트리뷰트가 매칭될 필요는 없습니다
+## <a id="a-default-values"></a>WGSL의 어트리뷰트와 자바스크립트 어트리뷰트가 매칭될 필요는 없습니다
 
 위에서 `perVertexColor` 어트리뷰트를 `vec3f` 타입으로 아래와 같이 선언했습니다.
 
@@ -917,7 +917,7 @@ function createCircleVertices({
 +  }
 
   return {
-    positionData,
+    vertexData,
     colorData,
 +    indexData,
     numVertices: indexData.length,
@@ -974,7 +974,7 @@ usage를 `INDEX`로 설정한 것에 주목하세요.
 
 {{{example url="../webgpu-vertex-buffers-index-buffer.html"}}}
 
-[이전 글](webgpu-storage-buffers.html)의 예제에서 스토리지 버퍼와 인덱스 버퍼 사용할 수도 있었음을 명심하세요.
+[이전 글](webgpu-storage-buffers.html)의 예제에서 스토리지 버퍼와 인덱스 버퍼를 사용할 수도 있었음을 명심하세요.
 이러한 경우 `@builtin(vertex_index)`로 넘어오는 값은 인덱스 버퍼의 인덱스 순서와 같습니다.
 
 다음으로 [텍스처](webgpu-textures.html)에 대해 다뤄보겠습니다.