diff --git a/2-ui/4-forms-controls/1-form-elements/article.md b/2-ui/4-forms-controls/1-form-elements/article.md
index 261074a1ba..f99bd482c3 100644
--- a/2-ui/4-forms-controls/1-form-elements/article.md
+++ b/2-ui/4-forms-controls/1-form-elements/article.md
@@ -8,19 +8,11 @@
 
 폼은 특수한 컬렉션인 `document.forms`의 구성원입니다.
 
-<<<<<<< HEAD
-`document.forms`는 이름과 순서가 있는 '기명 컬렉션(named collection)'입니다. 개발자는 이 이름이나 순서를 사용해 문서 내의 폼에 접근할 수 있습니다.
+`document.forms`는 이름과 순서가 있는 *'기명 컬렉션(named collection)'* 입니다. 개발자는 이 이름이나 순서를 사용해 문서 내의 폼에 접근할 수 있습니다.
 
 ```js no-beautify
-document.forms.my - 이름이 'my'인 폼
-document.forms[0] - 문서 내의 첫 번째 폼
-=======
-That's a so-called *"named collection"*: it's both named and ordered. We can use both the name or the number in the document to get the form.
-
-```js no-beautify
-document.forms.my; // the form with name="my"
-document.forms[0]; // the first form in the document
->>>>>>> upstream/master
+document.forms.my; // 이름이 'my'인 폼
+document.forms[0]; // 문서 내의 첫 번째 폼
 ```
 
 이름이나 순서를 사용해 원하는 폼을 가져온 다음에는 기명 컬렉션 `form.elements`를 사용해 폼의 요소를 얻을 수 있습니다.
@@ -44,15 +36,9 @@ document.forms[0]; // the first form in the document
 </script>
 ```
 
-<<<<<<< HEAD
-그런데 개발을 하다 보면 이름이 같은 요소 여러 개를 다뤄야 하는 경우가 생기기도 합니다. 라디오 버튼을 다룰 때 이런 상황이 자주 발생하죠.
+그런데 개발을 하다 보면 이름이 같은 요소 여러 개를 다뤄야 하는 경우가 생기기도 합니다. 라디오 버튼이나 체크박스를 다룰 때 이런 상황이 자주 발생하죠.
 
-이때 `form.elements[name]`은 컬렉션이 된다는 사실을 이용할 수 있습니다. 예시를 살펴봅시다.
-=======
-There may be multiple elements with the same name. This is typical with radio buttons and checkboxes.
-
-In that case, `form.elements[name]` is a *collection*. For instance:
->>>>>>> upstream/master
+이때 `form.elements[name]`는 *컬렉션*이 된다는 사실을 이용할 수 있습니다. 예시를 살펴봅시다.
 
 ```html run height=40
 <form>
@@ -133,11 +119,7 @@ alert(ageElems[0]); // [object HTMLInputElement]
 </script>
 ```
 
-<<<<<<< HEAD
 그런데 폼 요소의 이름을 변경하는 일은 드물기 때문에 보통은 이런 특징이 문제가 되지 않습니다.
-=======
-That's usually not a problem, however, because we rarely change names of form elements.
->>>>>>> upstream/master
 
 ````
 
@@ -173,11 +155,7 @@ That's usually not a problem, however, because we rarely change names of form el
 
 ### input과 textarea
 
-<<<<<<< HEAD
-input과 textarea 요소의 값은 `input.value` (string) 또는 `input.checked`(boolean)을 사용해 얻을 수 있습니다.
-=======
-We can access their value as `input.value` (string) or `input.checked` (boolean) for checkboxes and radio buttons.
->>>>>>> upstream/master
+input과 textarea 요소의 값은 `input.value` (string)로 얻을 수 있고, 체크박스와 라디오 버튼의 경우 `input.checked`(boolean)를 사용해 선택 여부를 확인할 수 있습니다.
 
 이렇게 말이죠.
 
@@ -198,33 +176,17 @@ input.checked = true; // 체크박스나 라디오 버튼에서 쓸 수 있습
 
 `<select>` 요소에는 세 가지 중요 프로퍼티가 있습니다.
 
-<<<<<<< HEAD
 1. `select.options` -- `<option>` 하위 요소를 담고 있는 컬렉션
-2. `select.value` -- 현재 선택된 `<option>` 값
-3. `select.selectedIndex` -- 현재 선택된 `<option>`의 번호(인덱스)
-=======
-1. `select.options` -- the collection of `<option>` subelements,
-2. `select.value` -- the *value* of the currently selected `<option>`,
-3. `select.selectedIndex` -- the *number* of the currently selected `<option>`.
->>>>>>> upstream/master
+2. `select.value` -- 현재 선택된 `<option>` *값*
+3. `select.selectedIndex` -- 현재 선택된 `<option>`의 *번호(인덱스)*
 
 이 세 프로퍼티를 응용하면 아래와 같은 세 가지 방법으로 `<select>`의 값을 설정할 수 있습니다.
 
-<<<<<<< HEAD
-1. 조건에 맞는 `<option>` 하위 요소를 찾아 `option.selected`속성을 `true`로 설정합니다.
+1. `select.options`등에서 조건에 맞는 `<option>` 요소를 찾아 `option.selected`속성을 `true`로 설정합니다.
 2. `select.value`를 원하는 값으로 설정합니다.
 3. `select.selectedIndex`를 원하는 option 번호로 설정합니다.
 
-세 방법 중 첫 번째 방법이 가장 확실하지만 두 번째나 세 번째 방법이 대체로 더 편리합니다.
-
-예시:
-=======
-1. Find the corresponding `<option>` element (e.g. among `select.options`) and set its `option.selected` to `true`.
-2. If we know a new value: set `select.value` to the new value.
-3. If we know the new option number: set `select.selectedIndex` to that number.
-
-Here is an example of all three methods:
->>>>>>> upstream/master
+세 가지 방법을 모두 사용한 예시를 살펴봅시다.
 
 ```html run
 <select id="select">
@@ -234,30 +196,17 @@ Here is an example of all three methods:
 </select>
 
 <script>
-<<<<<<< HEAD
   // 세 가지 코드의 실행 결과는 모두 같습니다.
   select.options[2].selected = true;
-=======
-  // all three lines do the same thing
-  select.options[2].selected = true; 
->>>>>>> upstream/master
   select.selectedIndex = 2;
   select.value = 'banana';
   // please note: options start from zero, so index 2 means the 3rd option.
 </script>
 ```
 
-<<<<<<< HEAD
-대부분의 다른 폼 조작 요소와 달리 `<select>`는 `multiple` 속성이 있는 경우 option을 다중 선택할 수 있습니다. `multiple` 속성을 쓰는 경우는 아주 드물지만, 쓰게 되다면 첫 번째 방법을 사용해 `<option>` 하위 요소에 있는 `selected` 프로퍼티를 추가·제거해야 합니다. 
-
-선택된 여러 개의 option이 담긴 컬렉션은 다음 예시처럼 `select.options`를 사용해 얻을 수 있습니다. 
-=======
-Unlike most other controls, `<select>` allows to select multiple options at once if it has `multiple` attribute. This attribute is rarely used, though.
+대부분의 다른 폼 조작 요소와 달리 `<select>`는 `multiple` 속성이 있는 경우 option을 다중 선택할 수 있습니다. `multiple` 속성을 쓰는 경우는 아주 드물지만, 쓰게 된다면 첫 번째 방법을 사용해 `<option>` 하위 요소에 있는 `selected` 프로퍼티를 추가·제거해야 합니다.
 
-For multiple selected values, use the first way of setting values: add/remove the `selected` property from `<option>` subelements.
-
-Here's an example of how to get selected values from a multi-select:
->>>>>>> upstream/master
+선택된 여러 개의 option이 담긴 컬렉션은 다음 예시처럼 `select.options`를 사용해 얻을 수 있습니다.
 
 ```html run
 <select id="select" *!*multiple*/!*>
@@ -280,51 +229,33 @@ Here's an example of how to get selected values from a multi-select:
 
 ### Option 생성자
 
-<<<<<<< HEAD
-Option 생성자는 잘 사용되지는 않지만 흥미로운 점이 있습니다.
-
-[명세서](https://html.spec.whatwg.org/multipage/forms.html#the-option-element)를 보면 `<option>` 요소를 생성하는 간단하고 멋진 문법을 찾을 수 있죠.
-=======
-In the [specification](https://html.spec.whatwg.org/multipage/forms.html#the-option-element) there's a nice short syntax to create an `<option>` element:
->>>>>>> upstream/master
+[명세서](https://html.spec.whatwg.org/multipage/forms.html#the-option-element)를 보면 `<option>` 요소를 생성하는 간단하고 멋진 문법을 찾을 수 있습니다.
 
 ```js
 option = new Option(text, value, defaultSelected, selected);
 ```
 
-<<<<<<< HEAD
+이 문법은 선택 사항입니다. `document.createElement('option')`를 사용해 요소를 만들고 속성을 직접 설정해도 되지만, 이 문법을 사용하면 더 짧게 쓸 수 있습니다.
+
 매개변수:
-=======
-This syntax is optional. We can use `document.createElement('option')` and set attributes manually. Still, it may be shorter, so here are the parameters:
->>>>>>> upstream/master
 
 - `text` -- option 내부의 텍스트
 - `value` -- option의 값
 - `defaultSelected` -- `true`이면 HTML 속성 `selected`가 생성됨
 - `selected` -- `true`이면 해당 option이 선택됨
 
-<<<<<<< HEAD
-`defaultSelected`와 `selected`의 차이가 무엇인지 헷갈릴 수 있습니다. `defaultSelected`는 `option.getAttribute('selected')`를 사용해 얻을 수 있는 HTML 속성을 설정해 줍니다. 반면 `selected` 는 option의 선택 여부를 결정합니다. 그렇기 때문에 당연히 `selected`가 더 중요한 매개변수이죠. Option 생성자를 사용할 때는 대개 두 매개변수 모두를 `true`나 `false`로 설정합니다.
+`defaultSelected`와 `selected`의 차이가 무엇인지 헷갈릴 수 있습니다. `defaultSelected`는 `option.getAttribute('selected')`를 사용해 얻을 수 있는 HTML 속성을 설정해 줍니다. 반면 `selected` 는 option의 선택 여부를 결정합니다.
 
-예시:
-=======
-The difference between `defaultSelected` and `selected` is that `defaultSelected` sets the HTML-attribute (that we can get using `option.getAttribute('selected')`), while `selected` sets whether the option is selected or not.
-
-In practice, one should usually set _both_ values to `true` or `false`. (Or, simply omit them; both default to `false`.)
+Option 생성자를 사용할 때는 대개 두 매개변수 _모두_ `true`나 `false`로 설정합니다. 둘 다 생략할 수 있고, 이때 기본값은 둘 다 `false`입니다.
 
-For instance, here's a new "unselected" option:
->>>>>>> upstream/master
+예를 들어 '선택되지 않은' 새 option은 다음과 같이 만들 수 있습니다.
 
 ```js
 let option = new Option("Text", "value");
 // <option value="value">Text</option> 가 생성됩니다.
 ```
 
-<<<<<<< HEAD
-이번엔 같은 요소를 선택된 상태로 생성합니다.
-=======
-The same option, but selected:
->>>>>>> upstream/master
+이번엔 같은 요소를 선택된 상태로 생성해 봅시다.
 
 ```js
 let option = new Option("Text", "value", true, true);
@@ -358,15 +289,9 @@ Option을 사용해 만든 요소에는 다음과 같은 프로퍼티가 있습
 `element.form`
 : 요소는 `form` 프로퍼티에서 자신이 속한 폼을 참조합니다.
 
-<<<<<<< HEAD
-각 요소의 값은 `input.value`, `textarea.value`, `select.value` 등으로 접근할 수 있습니다. 체크박스와 라디오 버튼에서는 `input.checked`를 사용할 수 있습니다.
-
-`<select>`에서는 인덱스 `select.selectedIndex`나 option 컬렉션 `select.options`을 통해 값을 구할 수도 있습니다.
-=======
-Value is available as `input.value`, `textarea.value`, `select.value`, etc. (For checkboxes and radio buttons, use `input.checked` to determine whether a value is selected.)
+각 요소의 값은 `input.value`, `textarea.value`, `select.value` 등으로 접근할 수 있습니다. 체크박스와 라디오 버튼에서는 값이 선택되었는지 확인하려면 `input.checked`를 사용합니다.
 
-For `<select>`, one can also get the value by the index `select.selectedIndex` or through the options collection `select.options`.
->>>>>>> upstream/master
+`<select>`에서는 인덱스 `select.selectedIndex`나 option 컬렉션 `select.options`를 통해 값을 구할 수도 있습니다.
 
 지금까지는 폼 관련 기본을 다뤘습니다. 이 튜토리얼에서 앞으로 더 많은 예시를 만날 것입니다.
 
diff --git a/2-ui/4-forms-controls/2-focus-blur/4-edit-td-click/task.md b/2-ui/4-forms-controls/2-focus-blur/4-edit-td-click/task.md
index 31f11fcaac..7acfed58a1 100644
--- a/2-ui/4-forms-controls/2-focus-blur/4-edit-td-click/task.md
+++ b/2-ui/4-forms-controls/2-focus-blur/4-edit-td-click/task.md
@@ -6,17 +6,10 @@ importance: 5
 
 셀을 클릭하면 해당 셀을 수정할 수 있게 해주는 테이블을 만들어보세요.
 
-<<<<<<< HEAD
-- 셀 클릭 시 셀 안에 textarea가 나타나면서 셀에 들어 있는 콘텐츠(HTML)를 '수정'할 수 있어야 합니다. 이때 textarea 크기는 기존 cell 크기와 같아야 합니다.
+- 셀 클릭 시 셀 안에 textarea가 나타나면서 셀에 들어 있는 콘텐츠(HTML)를 '수정'할 수 있어야 합니다. 이때 textarea 크기는 기존 cell 크기와 같아야 하며, 전체 배치가 그대로 유지되어야 합니다.
 - 셀 수정 시 셀 아래쪽에 '완료'와 '취소' 버튼이 노출되도록 하고, 각 버튼을 누르면 수정이 종료, 취소될 수 있게 합니다.
 - 한 번에 하나의 셀만 수정할 수 있어야 합니다. `<td>`가 '수정 중'일 때는 다른 셀을 눌러도 클릭 이벤트가 무시되어야 합니다.
 - 테이블엔 더 많은 셀이 추가될 수 있으므로 이벤트 위임을 사용하세요.
-=======
-- On click -- the cell should become "editable" (textarea appears inside), we can change HTML. There should be no resize, all geometry should remain the same.
-- Buttons OK and CANCEL appear below the cell to finish/cancel the editing.
-- Only one cell may be editable at a moment. While a `<td>` is in "edit mode", clicks on other cells are ignored.
-- The table may have many cells. Use event delegation.
->>>>>>> upstream/master
 
 데모:
 
diff --git a/2-ui/4-forms-controls/2-focus-blur/5-keyboard-mouse/task.md b/2-ui/4-forms-controls/2-focus-blur/5-keyboard-mouse/task.md
index d251b49d7c..64578038fc 100644
--- a/2-ui/4-forms-controls/2-focus-blur/5-keyboard-mouse/task.md
+++ b/2-ui/4-forms-controls/2-focus-blur/5-keyboard-mouse/task.md
@@ -8,12 +8,6 @@ importance: 4
 
 [demo src="solution"]
 
-<<<<<<< HEAD
 참고1: `#mouse` 요소 이외의 어느 곳에도 이벤트 핸들러를 달지 마세요.
 
 참고2: HTML과 CSS를 수정하지 마세요. 작성할 자바스크립트는 어떤 요소에서도 동작할 수 있는 범용성이 있어야 합니다.
-=======
-P.S. Don't put event handlers anywhere except the `#mouse` element.
-
-P.P.S. Don't modify HTML/CSS, the approach should be generic and work with any element.
->>>>>>> upstream/master
diff --git a/2-ui/4-forms-controls/2-focus-blur/article.md b/2-ui/4-forms-controls/2-focus-blur/article.md
index 0e25d5ea0f..d3d6571f3a 100644
--- a/2-ui/4-forms-controls/2-focus-blur/article.md
+++ b/2-ui/4-forms-controls/2-focus-blur/article.md
@@ -1,10 +1,6 @@
 # focus와 blur
 
-<<<<<<< HEAD
 사용자가 폼 요소를 클릭하거나 `key:Tab` 키를 눌러 요소로 이동하면 해당 요소가 포커스(focus)됩니다. `autofocus`라는 HTML 속성을 사용해도 요소를 포커스 할 수 있는데 이 속성이 있는 요소는 페이지가 로드된 후 자동으로 포커싱 됩니다. 이 외에도 요소를 포커싱(focusing)할 수 있는 방법은 다양합니다.
-=======
-An element receives the focus when the user either clicks on it or uses the `key:Tab` key on the keyboard. There's also an `autofocus` HTML attribute that puts the focus onto an element by default when a page loads and other means of getting the focus.
->>>>>>> upstream/master
 
 요소를 포커싱한다는 것은 일반적으로 '여기에 데이터를 입력할 준비를 하라'는 것을 의미하기 때문에 요소 포커싱이 이뤄지는 순간엔 요구사항을 충족시키는 초기화 코드를 실행할 수 있습니다.
 
@@ -22,13 +18,8 @@ An element receives the focus when the user either clicks on it or uses the `key
 
 예시에서 각 핸들러는 다음과 같은 역할을 합니다.
 
-<<<<<<< HEAD
 - `blur` 핸들러에선 필드에 이메일이 잘 입력되었는지 확인하고 잘 입력되지 않은 경우엔 에러를 보여줍니다.
 - `focus` 핸들러에선 에러 메시지를 숨깁니다(이메일 재확인은 `blur` 핸들러에서 합니다).
-=======
-- The `blur` handler checks if the field has an email entered, and if not -- shows an error.
-- The `focus` handler hides the error message (on `blur` it will be checked again):
->>>>>>> upstream/master
 
 ```html run autorun height=60
 <style>
@@ -99,35 +90,27 @@ An element receives the focus when the user either clicks on it or uses the `key
 
 여기서 주의해야 할 점은 `onblur`는 요소가 포커스를 잃고 난 *후*에 발생하기 때문에 `onblur` 안에서 `event.preventDefault()`를 호출해 포커스를 잃게 하는걸 '막을 수 없다'라는 사실입니다. 
 
-In practice though, one should think well, before implementing something like this, because we generally *should show errors* to the user, but *should not prevent their progress* in filling our form. They may want to fill other fields first.
+하지만 실제로 이런 기능을 구현하기 전엔 신중하게 생각해야 합니다. 일반적으로 사용자에게 *에러를 표시하는 것*은 필요하지만, 폼 작성을 *방해해서는 안 되기* 때문입니다. 사용자가 다른 항목을 먼저 작성하고 싶을 수도 있습니다.
 
-```warn header="JavaScript-initiated focus loss"
-A focus loss can occur for many reasons.
+```warn header="자바스크립트에 의해 포커스를 잃는 경우"
+포커스를 잃는 데에는 여러 가지 이유가 있습니다.
 
-One of them is when the visitor clicks somewhere else. But also JavaScript itself may cause it, for instance:
+그중 하나는 방문자가 다른 곳을 클릭했을 때입니다. 하지만 자바스크립트 자체도 원인이 될 수 있습니다. 예를 들면 다음과 같습니다.
 
-- An `alert` moves focus to itself, so it causes the focus loss at the element (`blur` event), and when the `alert` is dismissed, the focus comes back (`focus` event).
-- If an element is removed from DOM, then it also causes the focus loss. If it is reinserted later, then the focus doesn't return.
+- `alert`는 포커스를 자기 자신으로 이동시키므로 기존 요소가 포커스를 잃게 만듭니다(`blur` 이벤트). 그리고 `alert`가 닫히면 포커스가 다시 돌아옵니다(`focus` 이벤트).
+- 요소가 DOM에서 제거되는 경우에도 포커스를 잃게 됩니다. 나중에 요소가 다시 삽입되더라도 포커스는 돌아오지 않습니다.
 
-These features sometimes cause `focus/blur` handlers to misbehave -- to trigger when they are not needed.
+이러한 특징 때문에 때때로 `focus/blur` 핸들러가 필요하지 않을 때에도 작동하는 경우가 있습니다.
 
-The best recipe is to be careful when using these events. If we want to track user-initiated focus-loss, then we should avoid causing it ourselves.
+따라서 이런 이벤트를 사용할 때는 주의해야 합니다. 사용자 동작으로 포커스를 잃는 상황을 추적하려면 자바스크립트로 요소가 포커스를 잃게 만드는 일을 피해야 합니다.
 ```
 ## tabindex를 사용해서 모든 요소 포커스 하기
 
-<<<<<<< HEAD
 대다수의 요소는 기본적으로 포커싱을 지원하지 않습니다.
-=======
-By default, many elements do not support focusing.
->>>>>>> upstream/master
 
 포커싱을 지원하지 않는 요소 목록은 브라우저마다 다르긴 하지만 한 가지 확실한 것은 `<button>`, `<input>`, `<select>`, `<a>`와 같이 사용자가 웹 페이지와 상호작용 할 수 있게 도와주는 요소는 `focus`, `blur`를 지원한다는 사실입니다.
 
-<<<<<<< HEAD
 반면 `<div>`, `<span>`, `<table>`같이 무언가를 표시하는 용도로 사용하는 요소들은 포커싱을 지원하지 않습니다. 따라서 이런 요소엔 `elem.focus()` 메서드가 동작하지 않고 `focus`, `blur`이벤트도 트리거 되지 않습니다.
-=======
-On the other hand, elements that exist to format something, such as `<div>`, `<span>`, `<table>` -- are unfocusable by default. The method `elem.focus()` doesn't work on them, and `focus/blur` events are never triggered.
->>>>>>> upstream/master
 
 그럼에도 불구하고 포커스를 하고 싶다면 `tabindex` HTML 속성을 사용하면 됩니다.
 
@@ -137,11 +120,7 @@ On the other hand, elements that exist to format something, such as `<div>`, `<s
 
 포커싱 되는 요소 순서는 다음과 같습니다. `tabindex`가 `1`인 요소부터 시작해 점점 큰 숫자가 매겨진 요소로 이동하고 그다음 `tabindex`가 없는 요소(평범한 `<input>` 요소 등)로 이동합니다.
 
-<<<<<<< HEAD
 `tabindex`가 없는 요소들은 문서 내 순서에 따라 포커스가 이동합니다(기본 순서).
-=======
-Elements without matching `tabindex` are switched in the document source order (the default order).
->>>>>>> upstream/master
 
 그런데 `tabindex`를 사용할 땐 주의해야 할 사항이 있습니다.
 
@@ -154,11 +133,7 @@ Elements without matching `tabindex` are switched in the document source order (
 예시를 살펴봅시다. 첫 번째 항목을 클릭하고 `key:Tab` 키를 눌러보세요.
 
 ```html autorun no-beautify
-<<<<<<< HEAD
 첫 번째 항목을 클릭하고 Tab 키를 눌러보면서 포커스 된 요소 순서를 눈여겨보세요. 참고로 탭을 많이 누르면 예시 밖으로 포커스가 이동하니, 주의하세요.
-=======
-Click the first item and press Tab. Keep track of the order. Please note that many subsequent Tabs can move the focus out of the iframe in the example.
->>>>>>> upstream/master
 <ul>
   <li tabindex="1">일</li>
   <li tabindex="0">영</li>
@@ -242,11 +217,7 @@ Click the first item and press Tab. Keep track of the order. Please note that ma
 
 ## 요약
 
-<<<<<<< HEAD
-`focus`와 `blur` 이벤트는 각각 요소가 포커스를 받을 때, 잃을 때 발생합니다.
-=======
-Events `focus` and `blur` trigger on an element focusing/losing focus.
->>>>>>> upstream/master
+`focus`와 `blur` 이벤트는 각각 요소가 포커스를 받을 때와 잃을 때 발생합니다.
 
 두 이벤트를 사용할 땐 다음을 유의해야 합니다.
 - `focus`와 `blur` 이벤트는 버블링 되지 않습니다. 캡처링이나 `focusin`, `focusout`을 사용하면 이벤트 위임 효과를 볼 수 있습니다.