From a40d5bc61defef55b0efb899520bb07ddd4c37a9 Mon Sep 17 00:00:00 2001 From: Bora Lee Date: Sun, 17 May 2026 18:13:17 +0900 Subject: [PATCH 1/5] =?UTF-8?q?README.md=20=EC=B6=A9=EB=8F=8C=20=ED=95=B4?= =?UTF-8?q?=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 28 ---------------------------- 1 file changed, 28 deletions(-) diff --git a/README.md b/README.md index 95bc3a775..b35a23ddd 100755 --- a/README.md +++ b/README.md @@ -34,7 +34,6 @@ * 원문에는 없으나 독자의 이해를 돕기 위해 번역자가 추가하는 내용은 문장 중간이나 끝에 `(.....부가설명..... - 옮긴이)` 형태로 부가설명을 추가하도록 합니다. * '적∙의를 보이는 것∙들'에 대한 내용은 될 수 있으면 사용하지 않습니다.([링크](https://m.blog.naver.com/ojhnews/220840570533)) -<<<<<<< HEAD 잘못된 번역, 오타 및 기타 개선사항은 [이슈](https://github.com/javascript-tutorial/ko.javascript.info/issues)로 등록 부탁드립니다. ## 기여자 @@ -44,30 +43,3 @@ by the Modern JavaScript Tutorial Project Owner, Ilya Kantor(@iliakan) 모던 JavaScript 튜토리얼 한국어 프로젝트 오너, 이보라(@Violet-Bora-Lee) -======= -Something's wrong? A topic is missing? Explain it to people, add it as PR 👏 - -**You can edit the text in any editor.** The tutorial uses an enhanced "markdown" format, easy to grasp. And if you want to see how it looks on-site, there's a server to run the tutorial locally at . - -The list of contributors is available at . - -## Structure - -Every chapter, article, or task has its folder. - -The folder is named like `N-url`, where `N` is a number for the sorting purposes and `URL` is the URL part with the title of the material. - -The type of the material is defined by the file inside the folder: - - - `index.md` stands for a chapter - - `article.md` stands for an article - - `task.md` stands for a task (solution must be provided in `solution.md` file as well) - -Each of these files starts from the `# Main header`. - -It's very easy to add something new. - ---- -♥ -Ilya Kantor @iliakan ->>>>>>> upstream/master From 06c848fdf855e104d11b361de090c34b6bb78945 Mon Sep 17 00:00:00 2001 From: Bora Lee Date: Sun, 17 May 2026 18:21:43 +0900 Subject: [PATCH 2/5] =?UTF-8?q?=EB=B2=A0=EC=A7=80=EC=96=B4=EA=B3=A1?= =?UTF-8?q?=EC=84=A0=20=EC=B6=A9=EB=8F=8C=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- 7-animation/1-bezier-curve/article.md | 16 ++++------------ 1 file changed, 4 insertions(+), 12 deletions(-) diff --git a/7-animation/1-bezier-curve/article.md b/7-animation/1-bezier-curve/article.md index 4308b1086..a8887a06f 100644 --- a/7-animation/1-bezier-curve/article.md +++ b/7-animation/1-bezier-curve/article.md @@ -4,17 +4,13 @@ 곡선 자체는 매우 단순하기 때문에 한 번 공을 들여 공부해 두면 벡터 그래픽스나 고급 애니메이션을 다룰 때 도움이 됩니다. -<<<<<<< HEAD -## 조절점 -======= -```smart header="Some theory, please" -This article provides a theoretical, but very needed insight into what Bezier curves are, while [the next one](info:css-animations#bezier-curve) shows how we can use them for CSS animations. +```smart header="잠시 이론을 다룹니다" +이 글은 이론 중심이지만 베지어 곡선이 무엇인지에 대한 꼭 필요한 통찰을 다룹니다. CSS 애니메이션에 베지어 곡선을 어떻게 활용할 수 있는지는 [다음 글](info:css-animations#bezier-curve)에서 살펴봅니다. -Please take your time to read and understand the concept, it'll serve you well. +시간을 들여 이 글을 천천히 읽고 개념을 이해해 두면 두고두고 도움이 될 것입니다. ``` -## Control points ->>>>>>> upstream/master +## 조절점 [베지어 곡선](https://ko.wikipedia.org/wiki/%EB%B2%A0%EC%A7%80%EC%97%90_%EA%B3%A1%EC%84%A0)은 조절점(control point)을 사용해 정의합니다. @@ -41,11 +37,7 @@ Please take your time to read and understand the concept, it'll serve you well. ![](bezier4-e.svg) ![](bezier3-e.svg) -<<<<<<< HEAD -마지막 특성 덕분에 컴퓨터 그래픽스 분야에서 교차 검사(intersection test) 최적화가 가능합니다. 컨벡스 헐이 교차하지 않는다면 곡선 역시 교차하지 않기 때문입니다. 따라서 컨벡스 헐이 교차하는지 검사하면 아주 빠르게 곡선 역시 '교차하지 않는다'는 결론을 도출해 낼 수 있습니다. 위쪽 그림에서 보는 것과 같이 컨벡스 헐은 삼각형, 사각형 같은 상대적으로 단순한 형태를 띠므로 곡선의 교차 여부보다 컨벡스 헐 교차 여부를 검사하는 게 훨씬 쉽습니다. -======= Because of that last property, in computer graphics it's possible to optimize intersection tests. If convex hulls do not intersect, then curves do not either. So checking for the convex hulls intersection first can give a very fast "no intersection" result. Checking the intersection of convex hulls is much easier, because they are rectangles, triangles and so on (see the picture above), much simpler figures than the curve. ->>>>>>> upstream/master **조절점을 움직이면 베지어 곡선은 직관적으로 봤을 때 아주 당연한 방식으로 다시 그려집니다.** From d1766467429553da2b6cb314cf0e4c23c3cd8219 Mon Sep 17 00:00:00 2001 From: Bora Lee Date: Sun, 17 May 2026 18:30:37 +0900 Subject: [PATCH 3/5] =?UTF-8?q?=EC=9B=B9=20=EC=BB=B4=ED=8F=AC=EB=84=8C?= =?UTF-8?q?=ED=8A=B8=20=EC=B6=A9=EB=8F=8C=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- 8-web-components/1-webcomponents-intro/article.md | 10 ++-------- 1 file changed, 2 insertions(+), 8 deletions(-) diff --git a/8-web-components/1-webcomponents-intro/article.md b/8-web-components/1-webcomponents-intro/article.md index c8080ed96..3c9e651c4 100644 --- a/8-web-components/1-webcomponents-intro/article.md +++ b/8-web-components/1-webcomponents-intro/article.md @@ -26,15 +26,9 @@ 그리고 우주정거장은 인간이 우주에서 날고, 살아있을 수 있게 해줍니다. -<<<<<<< HEAD -어떻게 이렇게 복잡한 장치가 만들어졌을까요? +어떻게 이렇게 복잡한 구조물이 만들어졌을까요? -개발을 안정적이고 확장 가능한 수준으로 만들기 위해 또는 그에 가깝게 만들기 위해 어떤 원칙을 빌려올 수 있을까요? -======= -How are such complex devices created? - -Which principles could we borrow to make our development same-level reliable and scalable? Or, at least, close to it? ->>>>>>> upstream/master +소프트웨어 개발을 우주정거장처럼 안정적이고 확장 가능한 수준으로, 혹은 그에 가깝게 만들기 위해 우주정거장 개발에 사용된 어떤 원칙을 빌려올 수 있을까요? ## 컴포넌트 아키텍처 From 6057d59ff642c729893ae615a7d152fef0b051f0 Mon Sep 17 00:00:00 2001 From: Bora Lee Date: Sun, 17 May 2026 18:33:52 +0900 Subject: [PATCH 4/5] =?UTF-8?q?=ED=8C=A8=ED=84=B4=EA=B3=BC=20=ED=94=8C?= =?UTF-8?q?=EB=9E=98=EA=B7=B8=20=EC=B6=A9=EB=8F=8C=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../01-regexp-introduction/article.md | 10 +--------- 1 file changed, 1 insertion(+), 9 deletions(-) diff --git a/9-regular-expressions/01-regexp-introduction/article.md b/9-regular-expressions/01-regexp-introduction/article.md index ee18b00ac..9d2a18fdf 100644 --- a/9-regular-expressions/01-regexp-introduction/article.md +++ b/9-regular-expressions/01-regexp-introduction/article.md @@ -29,11 +29,7 @@ regexp = /pattern/gmi; // 플래그 g, m, i가 있음(각 플래그에 대해선 두 문법의 중요한 차이점은 `/.../`를 사용하면 문자열 템플릿 리터럴에서 `${...}`를 사용했던 것처럼 중간에 표현식을 넣을 수 없다는 점입니다. 슬래시를 사용한 방법은 완전히 정적입니다. -<<<<<<< HEAD 슬래시를 사용한 짧은 문법은 코드를 작성하는 시점에 패턴을 알고 있을 때 사용합니다. 아마 대다수가 이런 경우에 속할 겁니다. 반면 `new RegExp`를 사용한 긴 문법은 '상황에 따라' 동적으로 생성된 문자열을 가지고 정규 표현식을 만들어야 할 때 주로 사용합니다. 관련 예시를 살펴봅시다. -======= -Slashes are used when we know the regular expression at the code writing time -- and that's the most common situation. While `new RegExp` is more often used when we need to create a regexp "on the fly" from a dynamically generated string. For instance: ->>>>>>> upstream/master ```js let tag = prompt("어떤 태그를 찾고 싶나요?", "h2"); @@ -60,11 +56,7 @@ let regexp = new RegExp(`<${tag}>`); // 프롬프트에서 "h2"라고 대답한 : `pattern:.`이 개행 문자 `\n`도 포함하도록 'dotall' 모드를 활성화합니다. 자세한 내용은 에서 다룰 예정입니다. `pattern:u` -<<<<<<< HEAD -: 유니코드 전체를 지원합니다. 이 플래그를 사용하면 서로게이트 쌍(surrogate pair)을 올바르게 처리할 수 있습니다. 자세한 내용은 에서 다룰 예정입니다. -======= -: Enables full Unicode support. The flag enables correct processing of surrogate pairs. More about that in the chapter . ->>>>>>> upstream/master +: 유니코드 전체를 지원합니다. 이 플래그를 사용하면 서로게이트 쌍(surrogate pair)을 올바르게 처리할 수 있습니다. 자세한 내용은 에서 다룹니다. `pattern:y` : 문자 내 특정 위치에서 검색을 진행하는 'sticky' 모드를 활성화 시킵니다. 자세한 내용은 에서 다룰 예정입니다. From 6c6f9098ea527afe276dc67bc5587502972f16f4 Mon Sep 17 00:00:00 2001 From: Bora Lee Date: Sun, 17 May 2026 18:47:58 +0900 Subject: [PATCH 5/5] =?UTF-8?q?=EB=AC=B8=EC=9E=90=20=ED=81=B4=EB=9E=98?= =?UTF-8?q?=EC=8A=A4=20=EC=B6=A9=EB=8F=8C=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../02-regexp-character-classes/article.md | 37 ++++--------------- 1 file changed, 7 insertions(+), 30 deletions(-) diff --git a/9-regular-expressions/02-regexp-character-classes/article.md b/9-regular-expressions/02-regexp-character-classes/article.md index a8806e67d..5587e0562 100644 --- a/9-regular-expressions/02-regexp-character-classes/article.md +++ b/9-regular-expressions/02-regexp-character-classes/article.md @@ -8,11 +8,7 @@ 가장 먼저 숫자 클래스부터 알아봅시다. 숫자(digit) 클래스는 `pattern:\d`라고 쓰고 '아무 숫자 하나'에 대응합니다. -<<<<<<< HEAD 앞에서 나온 전화번호 예시에서 첫 번째 숫자를 찾아봅시다. -======= -For instance, let's find the first digit in the phone number: ->>>>>>> upstream/master ```js run let str = "+7(903)-123-45-67"; @@ -124,11 +120,7 @@ alert( "CS-4".match(regexp) ); // CS-4 alert( "CS 4".match(regexp) ); // CS 4 (공백도 문자예요.) ``` -<<<<<<< HEAD -점은 아무 문자에나 일치하지만 '문자의 부재'와 일치하지는 않습니다. 반드시 일치하는 문자가 있어야 합니다. -======= -Please note that a dot means "any character", but not the "absence of a character". There must be a character to match it: ->>>>>>> upstream/master +점은 아무 문자 한 개와 일치하지만 '문자의 부재(없음, 빈자리)'와 일치하지는 않습니다. 반드시 일치하는 문자가 있어야 합니다. ```js run alert( "CS4".match(/CS.4/) ); // null, 점과 일치하는 문자가 없기 때문에 일치 결과가 없습니다. @@ -152,17 +144,10 @@ alert( "A\nB".match(/A.B/) ); // null (일치하지 않음) alert( "A\nB".match(/A.B/s) ); // A\nB (일치!) ``` -<<<<<<< HEAD -````warn header="Firefox, IE, Edge에서 지원하지 않음" -에서 지원 여부의 최신 상황을 확인해보세요. 이 글을 작성하는 시점에 `pattern:s` 플래그는 Firefox, IE, Edge에서 아직 지원하지 않습니다. +````warn header="IE에서 지원하지 않음" +`pattern:s` 플래그는 IE에서 지원하지 않습니다. -다행히도 어느 브라우저에서나 쓸 수 있는 대안이 있습니다. `pattern:[\s\S]`같은 정규 표현식을 사용해 '모든 문자'와 일치시킬 수 있습니다. -======= -````warn header="Not supported in IE" -The `pattern:s` flag is not supported in IE. - -Luckily, there's an alternative, that works everywhere. We can use a regexp like `pattern:[\s\S]` to match "any character" (this pattern will be covered in the article ). ->>>>>>> upstream/master +다행히도 어느 브라우저에서나 쓸 수 있는 대안이 있습니다. `pattern:[\s\S]`같은 정규 표현식을 사용하면 '모든 문자'와 일치시킬 수 있습니다. 참고로 자세한 내용은 에서 다룹니다. ```js run alert( "A\nB".match(/A[\s\S]B/) ); // A\nB (일치!) @@ -194,11 +179,7 @@ alert( "1 - 5".match(/\d\s-\s\d/) ); // 1 - 5, 이것도 됩니다. **공백 역시 문자입니다. 다른 문자만큼이나 중요합니다.** -<<<<<<< HEAD -정규 표현식에 공백을 추가하거나 지우면 다르게 작동합니다. -======= -We can't add or remove spaces from a regular expression and expect it to work the same. ->>>>>>> upstream/master +정규 표현식에 공백을 추가하거나 지우고 이전과 같은 동작을 기대하면 안됩니다. 즉, 정규 표현식에서는 모든 문자가 중요합니다. 공백도 마찬가지로요. ```` @@ -217,10 +198,6 @@ We can't add or remove spaces from a regular expression and expect it to work th 하지만 이게 전부가 아닙니다! -<<<<<<< HEAD -자바스크립트에서 문자열에 사용하는 유니코드 인코딩은 문자에 여러 프로퍼티를 제공합니다. 어떤 언어에 속하는 글자인지 또는 글자가 아닌 구두점인지 알려주는 프로퍼티처럼요. -======= -Unicode encoding, used by JavaScript for strings, provides many properties for characters, like: which language the letter belongs to (if it's a letter), is it a punctuation sign, etc. ->>>>>>> upstream/master +자바스크립트에서 문자열에 사용하는 유니코드 인코딩은 문자 관련 여러 프로퍼티를 제공합니다. 어떤 언어에 속하는 문자인지, 이 문자가 구두점인지 알려주는 프로퍼티 등이 제공됩니다. -이런 프로퍼티를 기준으로 문자를 찾을 수도 있습니다. `pattern:u` 플래그를 사용하면 되는데요. 다음 글에서 알아보도록 하죠. +이런 프로퍼티를 사용해 원하는 문자를 찾을 수도 있습니다. `pattern:u` 플래그를 사용하면 되는데, 자세한 내용은 다음 글에서 알아보겠습니다.