[ko] Overall modification for 'javascript building blocks' module (#1948)

* Overall modification

for javascript building blocks module.

* small fix

at introduction to event article.

* translation of word 'note' changed

노트 → 참고

Co-authored-by: hochan Lee <hochan049@gmail.com>

* translation of word 'module' changed

모듈 → 과정

Co-authored-by: hochan Lee <hochan049@gmail.com>

* Overall modification

* Small fixes

* delete contradictory content

* translate 'contact us'.

Co-authored-by: hochan Lee <hochan049@gmail.com>

1 files changed, 22 insertions, 22 deletions

diff --git a/files/ko/learn/javascript/building_blocks/image_gallery/index.html b/files/ko/learn/javascript/building_blocks/image_gallery/index.html
index 5e9e8f997b..3214dd6d0f 100644
--- a/files/ko/learn/javascript/building_blocks/image_gallery/index.html
+++ b/files/ko/learn/javascript/building_blocks/image_gallery/index.html
@@ -17,13 +17,13 @@ tags:
 
 <div>{{PreviousMenu("Learn/JavaScript/Building_blocks/Events", "Learn/JavaScript/Building_blocks")}}</div>
 
-<p class="summary">이제 우리는 JavaScript의 핵심적인 구성 요소를 살펴보았으므로, 우리는 반복문, 함수, 조건문, 그리고 이벤트에 대한 당신의 이해를 시험할 것입니다. 많은 웹사이트들에서 보게 될 꽤 흔한 아이템인 — JavaScript를 이용하는 이미지 갤러리를 만듦으로써 말이죠.</p>
+<p class="summary">이제 우리는 JavaScript의 핵심적인 구성 요소를 살펴보았으므로, 우리는 반복문, 함수, 조건문, 그리고 이벤트에 대한 여러분의 이해를 시험할 것입니다. 많은 웹사이트들에서 보게 될 꽤 흔한 아이템인 — JavaScript를 이용하는 이미지 갤러리를 만듦으로써 말이죠.</p>
 
 <table class="learn-box standard-table">
  <tbody>
   <tr>
    <th scope="row">필요한 사전 지식:</th>
-   <td>이 평가를 시도하기 전에 당신은 이 모듈의 모든 문서를 독파해야만 합니다.</td>
+   <td>이 평가를 시도하기 전에 여러분은 이 모듈의 모든 문서를 독파해야만 합니다.</td>
   </tr>
   <tr>
    <th scope="row">목표:</th>
@@ -44,7 +44,7 @@ tags:
 
 <h2 id="Project_brief">프로젝트 개요</h2>
 
-<p>당신에게 몇몇 HTML, CSS 그리고 이미지 에셋(asset) 그리고 몇 줄의 JavaScript 코드가 제공되었습니다; 당신은 이것을 작동하는 프로그램으로 만들기 위해 필수적인 JavaScript를 작성할 필요가 있습니다. HTML body는 다음과 같습니다:</p>
+<p>여러분에게 몇몇 HTML, CSS 그리고 이미지 에셋(asset) 그리고 몇 줄의 JavaScript 코드가 제공되었습니다; 여러분은 이것을 작동하는 프로그램으로 만들기 위해 필수적인 JavaScript를 작성할 필요가 있습니다. HTML body는 다음과 같습니다:</p>
 
 <pre class="brush: html">&lt;h1&gt;Image gallery example&lt;/h1&gt;
 
@@ -69,7 +69,7 @@ tags:
  <li>이것은 <code>thumb-bar &lt;div&gt;</code> (소위 "섬네일" 이미지) 내부의 이미지들의 폭을 20%로 설정하고, 사진들이 한 줄에서 서로의 다음에 오도록 왼쪽으로 부유시킵니다.</li>
 </ul>
 
-<p>당신의 JavaScript는 다음을 하기를 필요로 합니다:</p>
+<p>여러분의 JavaScript는 다음을 하기를 필요로 합니다:</p>
 
 <ul>
  <li>모든 이미지를 순회하고, 각각에 대해 <code>&lt;img&gt;</code> 요소를 페이지에 그 이미지를 끼워 넣는 <code>thumb-bar &lt;div&gt;</code> 내부에 삽입하기.</li>
@@ -87,26 +87,26 @@ tags:
 
 <p>우리는 이미 <code>thumbBar</code> 상수 내부에 <code>thumb-bar &lt;div&gt;</code>에 대한 참조를 저장하고, 새로운 <code>&lt;img&gt;</code> 요소를 생성하고, 그것의 <code>src</code> 어트리뷰트를 플레이스홀더 값 <code>xxx</code>로 설정하고, 그리고 <code>thumbBar</code> 내부에 이 새로운 <code>&lt;img&gt;</code> 요소를 추가하는 코드를 제공했습니다.</p>
 
-<p>당신은 다음을 할 필요가 있습니다:</p>
+<p>여러분은 다음을 할 필요가 있습니다:</p>
 
 <ol>
- <li>5개의 모든 이미지를 순회하는 반복문 내부의 "Looping through images" 주석 아래에 코드 섹션 추가하기 — 당신은 그저 5개의 숫자를 순회할 필요가 있는데, 각 숫자는 각각의 이미지를 나타냅니다.</li>
+ <li>5개의 모든 이미지를 순회하는 반복문 내부의 "Looping through images" 주석 아래에 코드 섹션 추가하기 — 여러분은 그저 5개의 숫자를 순회할 필요가 있는데, 각 숫자는 각각의 이미지를 나타냅니다.</li>
  <li>각각의 반복에서, <code>xxx</code> 플레이스홀더 값을 각 경우의 이미지 경로와 동일한 문자열으로 대체하세요. 우리는 <code>src</code> 어트리뷰트의 값을 각 경우에서 이 값으로 설정하고 있습니다. 각 경우에서, 이미지는 이미지 디렉토리 내부에 있고 그것의 이름은 <code>pic1.jpg</code>, <code>pic2.jpg</code> 등등이라는 것을 기억해 두세요.</li>
 </ol>
 
 <h3 id="Adding_an_onclick_handler_to_each_thumbnail_image">onclick 핸들러를 각 섬네일 이미지에 추가하기</h3>
 
-<p>각각의 반복에서, 당신은 <code>onclick</code> 핸들러를 현재의 <code>newImage</code>에 추가할 필요가 있습니다 — 이 핸들러는 현재 이미지의 <code>src</code> 어트리뷰트의 값을 찾아야만 합니다. <code>displayed-img &lt;img&gt;</code>의 <code>src</code> 어트리뷰트 값을 매개변수로서 전달된 <code>src</code> 값으로 설정하세요.</p>
+<p>각각의 반복에서, 여러분은 <code>onclick</code> 핸들러를 현재의 <code>newImage</code>에 추가할 필요가 있습니다 — 이 핸들러는 현재 이미지의 <code>src</code> 어트리뷰트의 값을 찾아야만 합니다. <code>displayed-img &lt;img&gt;</code>의 <code>src</code> 어트리뷰트 값을 매개변수로서 전달된 <code>src</code> 값으로 설정하세요.</p>
 
-<p>그 대신에, 당신은 섬네일 바에 하나의 이벤트 리스너를 추가할 수 있습니다.</p>
+<p>그 대신에, 여러분은 섬네일 바에 하나의 이벤트 리스너를 추가할 수 있습니다.</p>
 
 <h3 id="Writing_a_handler_that_runs_the_darkenlighten_button">어두워지게/밝게 하는 버튼을 실행하는 핸들러 작성하기</h3>
 
-<p>우리의 어두워지게/밝게 하는 <code>&lt;button&gt;</code>은 가만히 있습니다 — 우리는 이미 <code>btn</code> 상수에 <code>&lt;button&gt;</code>에 대한 참조를 저장하는 코드 라인을 제공했습니다. 당신은 다음을 수행하는 <code>onclick</code>을 추가할 필요가 있습니다:</p>
+<p>우리의 어두워지게/밝게 하는 <code>&lt;button&gt;</code>은 가만히 있습니다 — 우리는 이미 <code>btn</code> 상수에 <code>&lt;button&gt;</code>에 대한 참조를 저장하는 코드 라인을 제공했습니다. 여러분은 다음을 수행하는 <code>onclick</code>을 추가할 필요가 있습니다:</p>
 
 <ol>
- <li><code>&lt;button&gt;</code>에 설정된 현재 클래스명을 확인 — 당신은 다시 이것을 <code>getAttribute()</code>를 사용함으로써 달성할 수 있습니다.</li>
- <li>만약 클래스명이 <code>"dark"</code>라면, <code>&lt;button&gt;</code> 클래스를 <code>"light"</code>로 (<code><a href="/ko/docs/Web/API/Element/setAttribute">setAttribute()</a></code>를 사용하여), 이것의 텍스트 콘텐츠를 "Lighten"으로, 그리고 덮어씌운 <code>&lt;div&gt;</code>의 {{cssxref("background-color")}}를 <code>"rgba(0,0,0,0.5)"</code>로 변경.</li>
+ <li><code>&lt;button&gt;</code>에 설정된 현재 클래스명을 확인 — 여러분은 다시 이것을 <code>getAttribute()</code>를 사용함으로써 달성할 수 있습니다.</li>
+ <li>만약 클래스명이 <code>"dark"</code>라면, <code>&lt;button&gt;</code> 클래스를 <code>"light"</code>로 (<code><a href="/en-US/docs/Web/API/Element/setAttribute">setAttribute()</a></code>를 사용하여), 이것의 텍스트 콘텐츠를 "Lighten"으로, 그리고 덮어씌운 <code>&lt;div&gt;</code>의 {{cssxref("background-color")}}를 <code>"rgba(0,0,0,0.5)"</code>로 변경.</li>
  <li>만약 클래스명이 <code>"dark"</code>가 아니라면, <code>&lt;button&gt;</code> 클래스를 <code>"dark"</code>로, 이것의 텍스트 콘텐츠를 다시 "Darken"으로, 덮어씌운 <code>&lt;div&gt;</code>의 {{cssxref("background-color")}}를 <code>"rgba(0,0,0,0)"</code>로 변경.</li>
 </ol>
 
@@ -119,34 +119,34 @@ overlay.style.backgroundColor = xxx;</pre>
 <h2 id="Hints_and_tips">힌트와 팁</h2>
 
 <ul>
- <li>당신은 어떤 방법으로도 HTML 또는 CSS를 수정할 필요가 없습니다.</li>
+ <li>여러분은 어떤 방법으로도 HTML 또는 CSS를 수정할 필요가 없습니다.</li>
 </ul>
 
 <h2 id="Assessment_or_further_help">평가 혹은 추가적인 도움</h2>
 
-<p>만약 당신의 작업을 평가받고 싶으시거나 막혀서 도움을 요청하기를 원하신다면:</p>
+<p>만약 여러분의 작업을 평가받고 싶으시거나 막혀서 도움을 요청하기를 원하신다면:</p>
 
 <ol>
- <li>당신의 작업을 <a href="https://codepen.io/">CodePen</a>, <a href="https://jsfiddle.net/">jsFiddle</a>, 또는 <a href="https://glitch.com/">Glitch</a> 같은 온라인에서 공유 가능한 에디터에 올리세요.</li>
- <li><a href="https://discourse.mozilla.org/c/mdn/learn">MDN Discourse forum Learning category</a> 에 평가 및/또는 도움을 요청하는 글을 작성하세요. 당신의 글은 다음을 포함해야만 합니다:
+ <li>여러분의 작업을 <a href="https://codepen.io/">CodePen</a>, <a href="https://jsfiddle.net/">jsFiddle</a>, 또는 <a href="https://glitch.com/">Glitch</a> 같은 온라인에서 공유 가능한 에디터에 올리세요.</li>
+ <li><a href="https://discourse.mozilla.org/c/mdn/learn">MDN Discourse forum Learning category</a> 에 평가 및/또는 도움을 요청하는 글을 작성하세요. 여러분의 글은 다음을 포함해야만 합니다:
   <ul>
    <li>"이미지 갤러리에 대한 평가 원함"과 같은 서술적인 제목.</li>
-   <li>당신이 이미 무엇을 시도해 봤는지, 그리고 우리가 무엇을 하기를 원하는지에 대한 설명, 예를 들자면, 만약 당신이 막혀서 도움이 필요하거나, 평가를 원하거나.</li>
-   <li>(위의 단계 1에서 언급된) 온라인에서 공유 가능한 에디터에 있는, 당신이 평가를 원하거나 도움이 필요한 예제의 링크. 이것은 익숙해지기에 좋은 실천입니다. 코딩 문제가 있는 누군가를 도울 때, 그들의 코드를 보지 못한다면 그들을 돕는 것은 몹시 힘듭니다.</li>
-   <li>우리가 당신이 도움을 원하는 문제를 찾을 수 있도록, 실제 과제나 평가 페이지의 링크.</li>
+   <li>여러분이 이미 무엇을 시도해 봤는지, 그리고 우리가 무엇을 하기를 원하는지에 대한 설명. 예를 들자면, 막혀서 도움이 필요하다거나, 평가를 원한다거나 하는 설명을 포함해야 합니다.</li>
+   <li>(위의 단계 1에서 언급된) 온라인에서 공유 가능한 에디터에 있는, 여러분이 평가를 원하거나 도움이 필요한 예제의 링크. 이것은 익숙해지기에 좋은 습관입니다. 코딩 문제가 있는 누군가를 도울 때, 그들의 코드를 보지 못한다면 그들을 돕는 것은 몹시 힘듭니다.</li>
+   <li>우리가 여러분이 도움을 원하는 문제를 찾을 수 있도록, 실제 과제나 평가 페이지의 링크.</li>
   </ul>
  </li>
 </ol>
 
 <p>{{PreviousMenu("Learn/JavaScript/Building_blocks/Events", "Learn/JavaScript/Building_blocks")}}</p>
 
-<h2 id="In_this_module">이 모듈에서는</h2>
+<h2 id="In_this_module">이 과정에서는</h2>
 
 <ul>
- <li><a href="/ko/docs/Learn/JavaScript/Building_blocks/conditionals">판단을 만드세요 — 조건문</a></li>
+ <li><a href="/ko/docs/Learn/JavaScript/Building_blocks/conditionals">판단 내리기 — 조건문</a></li>
  <li><a href="/ko/docs/Learn/JavaScript/Building_blocks/Looping_code">반복문</a></li>
- <li><a href="/ko/docs/Learn/JavaScript/Building_blocks/Functions">함수 — 재사용 가능한 코드 블록</a></li>
- <li><a href="/ko/docs/Learn/JavaScript/Building_blocks/Build_your_own_function">자신만의 함수 만들기</a></li>
+ <li><a href="/ko/docs/Learn/JavaScript/Building_blocks/Functions">함수 — 코드 재사용</a></li>
+ <li><a href="/ko/docs/Learn/JavaScript/Building_blocks/Build_your_own_function">함수 만들기</a></li>
  <li><a href="/ko/docs/Learn/JavaScript/Building_blocks/Return_values">함수 반환 값</a></li>
  <li><a href="/ko/docs/Learn/JavaScript/Building_blocks/Events">이벤트 입문</a></li>
  <li><strong>이미지 갤러리</strong></li>