recursal/MDN huggingface dataset:
교차 사이트 요청 위조 (CSRF)
===================

**교차 사이트 요청 위조**(Cross-Site Request Forgery, CSRF)는 신뢰할 수 있는 사용자를 사칭해 웹 사이트에 원하지 않는 명령을 보내는 공격입니다.

예를 들면, 다른 곳으로 이동하려 하는 링크 뒤 URL에 악성 매개변수를 포함하는 식으로 할 수 있습니다.


```html
<img src="https://www.example.com/index.php?action=delete&id=123" />
```


`https://www.example.com`에 수정할 수 있는 권한이 있는 사용자의 경우, `<img>` 요소는 자신이 `https://www.example.com`에 없더라도, 눈치채지 못한 상태로 `https://www.example.com`에서 작업을 실행합니다.

CSRF를 방지하는 방법에는 RESTful API 구현, 보안 토큰 추가 등 여러가지 방법이 있습니다.

같이 보기
-----

* 위키백과의 교차 사이트 요청 위조
* 예방 조치
미디어 (Media)
===========

\*\*미디어(media)\*\*라는 용어는 웹에서 사용될 때 혼동을 줄 수 있는데, 문맥에 따라 다른 의미를 가질 수 있기 때문입니다.

미디어 (Media) (CSS)
종속 스타일 시트 (Cascading Style Sheets,CSS)의 맥락에서, \*\*미디어(media)\*\*라는 용어는 rendering engine에 의해 문서가 그려질 대상을 나타냅니다.
미디어 (Media) (시청각 자료, Audio-visual presentation)
**미디어(media)** (더 정확히는 **멀티미디어(multimedia)**)라는 용어는 오디오, 비디오 또는 음악, 녹음된 연설, 영화, TV 프로그램 또는 일정 기간 동안 제공되는 기타 모든 형태의 콘텐츠와 같은 시청각 결합 자료를 말합니다.
같이 보기
-----

* 위키백과의 미디어
Baseline
========

**기준**이라는 용어는 상황에 따라 여러 가지 의미를 가질 수 있습니다. 다음을 참조하세요.

기준 (호환성)
**Baseline**은 널리 지원되는 웹 플랫폼 기능을 식별합니다. 웹 개발자는 기본 기능이 최신 브라우저에서 작동할 것으로 기대할 수 있습니다.
기준선 (타이포그래피)
**기준선**은 유럽 및 서아시아 타이포그래피에서 글꼴의 문자가 놓이는 가상의 선을 의미하는 용어입니다.
같이 보기
-----

* 위키백과의 Baseline
암호 해독 (Cryptanalysis)
=====================

**암호 해독**은 코드와 암호체계를 해독하는 방법을 연구하는 암호화의 한 분야입니다.
 암호 해독은 특히 무차별 대입 검색보다 더 효율적인 방법으로 암호를 해독하는 기술을 만듭니다. 빈도 분석 및 우연 지수 등의 전통적인 방법 외에도, 암호 해독에는 선형 분석 또는 차분 분석과 같이 고급 암호를 해독할 수 있는 최신 방법이 포함됩니다.

같이 보기
-----

* 위키백과의 암호분석
OpenSSL
=======

OpenSSL은 TLS 와 SSL의 오픈소스 구현체입니다.

같이 보기
-----

* 위키백과의 OpenSSL
* 공식 웹사이트
HTML
====

**HTML**(Hypertext Markup Language)은 웹페이지의 구조를 지정하는 기술적인 언어입니다.

간략한 역사
------

1990년, 팀 버너스리는 Web의 비전 중 하나로서 하이퍼텍스트라는 개념을 정의하고, 그 이듬해에 SGML에 기초한 마크업을 통해 구체화했습니다. IETF는 1993년에 HTML을 공식 지정했으며, 1995년 몇 차례 초안을 거쳐 2.0 버전을 발표했습니다. 1994년, 팀 버너스리는 웹의 발전을 위해 W3C를 설립했습니다. W3C는 1996년부터 HTML 작업을 시작하고, 1년 후 HTML 3.2 권고안을 발표했습니다. HTML 4.0은 1999년에 발표됐으며 2000년에 ISO 표준이 됐습니다.

이 때, W3C는 HTML을 버리고 XHTML을 채택하려 했습니다. 이 움직임은, 2004년, WHATWG라는 독립 단체가 만들어지는 계기가 됩니다. WHATWG 덕분에 HTML5 작업이 계속 됐고, 두 단체는 2008년 첫 초안을, 2014년 최종 표준안을 발표합니다. "HTML5"라는 용어는 HTML Living Standard의 일부인 최신 웹 기술을 가리키는 유행어일 뿐입니다.

개념과 문법
------

HTML 문서는 요소로 구조화한 일반 텍스트 문서입니다. 요소는 한 쌍의 태그로 열고 닫으며, 각각의 태그는 부등호(`<>`)로 감쌉니다. `<img>`처럼 텍스트를 감싸지 못하는 "빈 태그"도 있습니다.

브라우저가 요소를 해석하는 방법에 영향을 미치는 추가 정보를 제공하는 특성로 HTML 태그를 확장할 수 있습니다.

![Detail of the structure of an HTML element](/ko/docs/Glossary/HTML/anatomy-of-an-html-element.png)

HTML은 보통 `.htm`이나 `.html` 확장자로 저장해 웹 서버로 제공하며, 아무 브라우저로 렌더링할 수 있습니다.

같이 보기
-----

* 위키백과 HTML
* HTML 자습서
* The web course on codecademy.com
* MDN의 HTML 문서
* HTML 명세
Polyfill
========

폴리필은 기본적으로 지원하지 않는 이전 브라우저에서 최신 기능을 제공하는 데 필요한 코드 (일반적으로 웹의 JavaScript)입니다.

예를 들어, 폴리필은 독점 IE 필터를 사용하여 IE7에서 `text-shadow` (en-US)의 기능을 모방하거나, JavaScript를 사용해 스타일을 적절하게 동적으로 조정함으로써 rem 단위 또는 미디어쿼리를 모방하거나, 또는 추가적으로 필요한 부분에 사용될 수 있습니다.

폴리필만을 단독으로 사용하지 않는 이유는 더 나은 기능과 성능 때문입니다. API의 기본 구현은 폴리필보다 더 많은 작업을 수행 할 수 있고 더 빠릅니다. 예를 들어, Object.create 폴리필에는 Object.create 구현에서 가능한 기능만 포함됩니다.

다른 경우에, 폴리필은 브라우저가 다른 방식으로 동일한 기능을 구현하는 문제를 해결하는 데 사용됩니다. 폴리필은 특정 브라우저의 비표준 기능을 사용하여 JavaScript에 기능에 접근할 수 있는 표준 방법을 제공합니다. 오늘날은 매우 드물지만 각 브라우저가 JavaScript를 매우 다르게 구현했던 IE6, Netscape 시절엔 이런 이유로 폴리필을 활용했습니다. JQuery의 첫번째 버전은 폴리필의 초기 예입니다. 폴리필은 본질적으로 JavaScript 개발자에게 모든 브라우저에서 작동하는 단일 공통 API를 제공할 수 있도록 기본적으로 브라우저 별 해결 방법을 모아둔 것입니다. 당시 JavaScript 개발자는 웹 사이트가 모든 장치에서 작동하게 만드는 데 큰 문제를 안고 있었습니다. 그 이유로, 브라우저 간의 불일치가 너무 커서 웹 사이트를 근본적으로 다르게 프로그래밍해야 하고, 사용자 브라우저에 따라 매우 다른 사용자 인터페이스를 가져야 했기 때문입니다. 따라서 JavaScript 개발자는 모든 브라우저에서 거의 일관되게 작동하는 극소수의 JavaScript API에만 접근할 수 있었습니다. 오늘날 브라우저 별 구현을 처리하기 위해 폴리필을 사용하는 것은 덜 일반적입니다. 왜냐하면, 최신 브라우저는 대부분 표준 의미 체계에 따라 광범위한 API 세트를 구현하기 때문입니다.

같이 보기
-----

* 폴리필이란 용어를 만든 Remy Sharp의 폴리필이란? 글
Java
====

Java는 컴파일이 되고, 객체 지향적이며, 매우 이식성 높은 프로그래밍 언어입니다.

자바는 정적으로 타이핑되며 C와 유사한 구문을 가지고 있습니다. 이는 쉽게 사용 가능한 기능이 있는 대형 라이브러리인 Java Software Development Kit와 함께 제공됩니다.

프로그램은 Java Virtual Machine(JVM) 내에서 실행되는 독점 바이트 코드와 패키지 형식으로 미리 한 번만 컴파일된다. JVM은 많은 플랫폼에서 사용할 수 있으며, 이를 통해 Java 프로그램은 다시 컴파일하거나 패키징할 필요 없이 거의 모든 곳에서 실행될 수 있다. 이것은 이질적인 환경을 가진 많은 대기업에서 이 언어를 선호하지만, "무거운" 것으로 인식될 수 있습니다.

같이 보기
-----

* 위키피디아의 Java
REST
====

**REST**(Representational State Transfer)는 효율적, 안정적이며 확장가능한 분산시스템을 가져올 수 있는 소프트웨어 아키텍처 디자인 제약의 모음을 나타냅니다.

REST의 기본 개념은 리소스입니다. 리소스의 예로는 잘 인식되고 언어에 상관없이, 안정적이고 표준화된 클라이언트/서버 상호작용을 통해 전송되는 문서를 들 수 있습니다. 서비스가 이러한 제약조건을 준수하면 RESTful로 간주됩니다.

일반적으로 HTTP API는 모든 REST 제약 조건을 반드시 준수하지는 않지만 RESTful API, RESTful 서비스 또는 REST 서비스라고도 합니다. 초보자는 REST API가 표준 웹 라이브러리 및 도구를 사용하여 호출할 수 있는 HTTP 서비스를 의미한다고 가정할 수 있습니다.

같이 보기
-----

* restapitutorial.com
* restcookbook.com
* 위키백과의 REST
* REST Architecture
그리드 트랙 (Grid Tracks)
====================

\*\*그리드 트랙(grid track)\*\*은 인접한 두 격자 선 사이의 공간입니다. `grid-template-columns` 및 `grid-template-rows` (en-US) 속성 또는 약식 `grid` (en-US) 또는 `grid-template` (en-US) 속성을 사용하여 '명시적 그리드'에 정의됩니다. 트랙은 명시적 그리드에서 생성된 트랙 외부에 그리드 요소를 배치하여 '암시적 그리드'에도 생성됩니다.

아래 이미지는 그리드의 첫 번째 행 트랙을 보여줍니다.

![그리드 트랙을 보여주는 다이어그램](/ko/docs/Glossary/Grid_Tracks/1_grid_track.png)

명시적 그리드의 트랙 크기
--------------

`grid-template-columns` 및 `grid-template-rows` (en-US)을 사용하여 그리드 트랙을 정의할 때, 모든 길이 단위를 사용할 수 있습니다. 또한, 그리드 컨테이너에서 사용 가능한 공간의 일부를 나타내는 플렉스 단위인 `fr`도 사용할 수 있습니다.

예제
--

아래 예는 3개의 열 트랙(200픽셀 중 하나, 1fr의 두 번째 트랙, 3fr의 세 번째 트랙)이 있는 그리드를 보여줍니다. 그리드 컨테이너에서, 사용가능한 공간에서 200픽셀을 빼고 남은 공간을 4로 나눕니다. 한 부분은 2번째 열에, 나머지 3 부분은 3번째 열에 제공됩니다.
```

\* {
  box-sizing: border-box;
}

.wrapper {
  border: 2px solid #f76707;
  border-radius: 5px;
  background-color: #fff4e6;
}

.wrapper > div {
  border: 2px solid #ffa94d;
  border-radius: 5px;
  background-color: #ffd8a8;
  padding: 1em;
  color: #d9480f;
}
```



```css
.wrapper {
  display: grid;
  grid-template-columns: 200px 1fr 3fr;
}
```



```html
<div class="wrapper">
  <div>One</div>
  <div>Two</div>
  <div>Three</div>
  <div>Four</div>
  <div>Five</div>
</div>
```

암시적 그리드에서의 트랙 크기
----------------

암시적 그리드에서 생성된 트랙은 기본적으로 자동으로 크기가 조절되지만, `grid-auto-rows` (en-US) 및 `grid-auto-columns` (en-US) 속성을 사용해 이러한 트랙의 크기를 정의할 수 있습니다.

같이 보기
-----

* 그리드 레이아웃의 기본 개념
* CSS 그리드 레이아웃 명세서의 그리드 트랙 정의
* 속성 참고서
    + `grid-template-columns`
    + `grid-template-rows` (en-US)
    + `grid` (en-US)
    + `grid-template` (en-US)
Rsync
=====

Rsync는 증분 파일 전송을 제공하는 오픈 소스 파일 동기화 도구입니다. 안전하지 않은 전송과 SSH와 같은 보안 전송을 통해 사용할 수 있습니다. 대부분의 Unix 기반 시스템 (예, macOS와 Linux)과 Windows에서 사용할 수 있습니다. rsync를 사용하는 GUI 기반 도구도 있습니다(예, Acrosync).

기본 명령어는 아래와 같습니다.


```bash
rsync [-options] SOURCE user@x.x.x.x:DESTINATION
```


* `-options`은 대시 뒤에 하나 이상의 문자가 오는 것입니다. 예를 들어, 자세한 오류 메시지의 경우 `-v`, 백업을 만드는 경우 `-b`입니다. rsync man 페이지 ("Options summary"를 검색하세요) 에서 전체 옵션 목록을 확인하세요.
* `SOURCE`는 복사하거나 동기화하려는 로컬 파일 또는 디렉터리의 경로입니다.
* `user@`는 파일을 복사하려는 원격 서버에 있는 사용자의 자격 증명입니다.
* `x.x.x.x`는 원격 서버의 IP 주소입니다.
* `DESTINATION`는 원격 서버에서 디렉터리나 파일을 복사하려는 위치의 경로입니다.

아래와 같이 `-e` 옵션을 사용하여 SSH를 통해 연결할 수도 있습니다.


```bash
rsync [-options] -e "ssh [SSH DETAILS GO HERE]" SOURCE user@x.x.x.x:DESTINATION
```


rsync에 대해 공식 웹사이트 및 위키백과 항목 등 인터넷에 수많은 예제가 있습니다.
WindowProxy
===========

**`WindowProxy`** 객체는 `Window` 객체에 대한 래퍼입니다. 모든 브라우징 컨텍스트에는 `WindowProxy` 객체가 존재합니다. `WindowProxy` 객체에 수행된 모든 작업은 현재 래핑된 기본 `Window` 객체에도 적용됩니다. 따라서, `WindowProxy` 객체와 상호 작용하는 것은 `Window` 객체와 직접 상호작용하는 것과 거의 동일합니다. 브라우징 컨텍스트를 탐색할 때, `WindowProxy`가 래핑하는 `Window` 객체가 변경됩니다.

같이 보기
-----

* HTML 명세서: WindowProxy 부분
* Stack Overflow 질문: WindowProxy 및 Window 객체?
Literal (리터럴)
=============

**리터럴**은 JavaScript에서 값을 나타냅니다. 이는 변수가 아닌 여러분이 문자 그대로 스크립트에 제공한 고정된 값입니다.

* 배열 리터럴
* 불리언 리터럴
* 부동 소수점 리터럴
* 숫자 리터럴
* 객체 리터럴
* 정규식 리터럴
* 문자열 리터럴
예제
--

### 문자열 리터럴

문자열 리터럴은 큰따옴표(`"`) 또는 작은따옴표(`'`)로 묶인 0개 이상의 문자입니다. 문자열은 같은 유형의 따옴표로 구분해야 합니다. 즉, 모두 작은따옴표 이거나 큰따옴표여야 합니다.

다음은 문자열 리터럴의 예제입니다.


```js
"foo";
"bar";
"1234";
"one line \n new line";
"Joyo's cat";
```

### 객체 리터럴

객체 리터럴은 중괄호(`{}`)로 묶인 0개 이상의 객체의 속성 이름과 그와 연관된 값의 쌍의 목록입니다.

다음은 객체 리터럴의 예제입니다. `car` 객체의 첫 번째 요소는 `myCar` 속성을 정의하고, 여기에 새 문자열 "`Toyota`"를 할당합니다. 두 번째 요소인 `getCar` 속성에는 `carTypes('Honda')` 함수 호출의 결과가 즉시 할당됩니다. 세 번째 요소인 `special` 속성은 기존 변수(`sales`)를 사용합니다.


```js
const sales = "BMW";

function carTypes(name) {
  return name === "Honda" ? name : `Sorry, we don't sell ${name}.`;
}

const car = {
  myCar: "Toyota",
  getCar: carTypes("Honda"),
  special: sales,
};

console.log(car.myCar); // Toyota
console.log(car.getCar); // Honda
console.log(car.special); // BMW
```

같이 보기
-----

* Literal (위키백과)
제출 버튼 (Submit button)
=====================

**제출 버튼(submit button)** 은 양식을 제출하는 데 사용할 수 있는 HTML의 요소입니다. 기본 제출 버튼 요소는 아래와 같습니다.

* `<button>` (기본 타입은 `type`은 `"submit"`입니다.)
* `<input type="submit"> (en-US)`
* `<input type="image"> (en-US)`

양식 제출 외에도, 제출 버튼은 양식의 동작과 전송되는 데이터에 영향을 줄 수 있습니다.

양식의 동작을 재정의
-----------

제출 버튼은 다양한 속성을 통해 양식의 제출 동작을 재정의할 수 있습니다.

* `formaction`: 양식의 `action` 속성을 재정의합니다.
* `formenctype`: 양식의 `enctype` 속성을 재정의합니다.
* `formmethod`: 양식의 `method` 속성을 재정의합니다.
* `formnovalidate`: 양식의 `novalidate` 속성을 재정의합니다.
* `formtarget`: 양식의 `target` 속성을 재정의합니다.
양식 데이터 항목
---------

제출 버튼이 `<button>` 또는 `<input type="submit"> (en-US)` 및 `name` 속성이 있는 경우, 양식 데이터 모음에는 `name` 및 `value`에 대한 항목이 포함됩니다.

제출 버튼이 `<input type="image"> (en-US)`인 경우, 양식 데이터 세트에는 사용자가 클릭한 X 및 Y 좌표에 대한 항목이 포함됩니다(예, `x=100&y=200` 또는 `buttonName.x=123&buttonName.y=234`).

같이 보기
-----

* 기본 네이티브 양식 컨트롤
* 양식 데이터 제출하기 (en-US)
인증 기관 (Certificate authority)
=============================

인증 기관 (Certificate authority, CA)은 디지털 인증서와 관련 키에 서명 (en-US)하여 포함된 정보와 키가 정확하다고 주장하는 기관입니다.

웹사이트 디지털 인증서의 경우, 이 정보에는 최소한 디지털 인증서를 요청한 조직의 이름(예, Mozilla Corporation), 해당 사이트 (e.g., mozilla.org) 및 인증 기관이 포함됩니다.

인증 기관은 브라우저가 웹 사이트 ID를 확인하고 SSL(및 HTTPS)을 통해 안전하게 연결할 수 있도록 하는 인터넷 공개키 인프라의 일부입니다.

**참고:** 웹 브라우저에는 '루트 인증서' 목록이 미리 로드되어 있습니다. 브라우저는 이를 사용하여 웹사이트 인증서가 루트 인증서에 "체인 백"되는 인증 기관에 의해 서명되었는지(즉, 루트 인증서 소유자 또는 중간 CA가 신뢰했는지) 확실하게 확인할 수 있습니다. 궁극적으로 이 과정은 인증서에 서명하기 전에 적절한 신원 확인을 수행하는 모든 CA에 의존합니다!

같이 보기
-----

* 위키백과의 인증 기관
* 위키백과의 공개키 인프라
* Mozilla 포함 CA 인증서 목록
SMTP
====

**SMTP**(Simple Mail Transfer Protocol)는 새로운 이메일을 전송할 때 사용하는 프로토콜입니다. POP3 (en-US)나 NNTP처럼, SMTP도 상태 기계 기반 프로토콜입니다.

SMTP는 상대적으로 직관적입니다. 복잡함을 유발하는 주요 원인은 다양한 인증 방법(GSSAPI, CRAM-MD5, NTLM, MSN, AUTH LOGIN, AUTH PLAIN...) 지원, 오류 응답 처리, 인증 실패(서버에서 어떤 방법을 지원한다고 주장했으나 사실 아닐 때 등) 시 처리 등입니다.
가드 (Guard)
==========

가드는 `Fetch 명세`에 정의된 `Headers` (en-US) 객체의 기능입니다. 가드는 `set()` (en-US) 및 `append()` (en-US)와 같은 메서드가 헤더의 내용을 변경할 수 있는지 여부에 영향을 미칩니다. 예를 들어, `immutable` 가드는 헤더를 변경할 수 없음을 의미합니다. 자세한 정보는, Fetch 기본 개념: 가드를 읽어보세요.
String
======

특정한 컴퓨터 프로그래밍 언어에서 문자를 표현하는 데 사용되는, 문자 열 시퀀스이다.

JavaScript에서 String은 원시 값들 중 하나이고 `String`객체는 String primitive를 둘러싼 wrapper다.

더 알아보기
------

### 일반적인 지식

* Wikipedia의 String (computer science)
* JavaScript data types and data structures
공급업체 접두사 (Vendor Prefix)
========================

브라우저 공급자는 개발자가 새로운 아이디어를 실험할 수 있도록 실험적이거나 비표준 CSS 속성과 JavaScript API에 접두사를 추가하곤 했습니다. 이 방법은 이론적으로 표준화 과정에서 실험이 의존성을 가지게 되고 웹 개발자의 코드가 손상되는 것을 방지하는 데 도움이 되었습니다.

웹 개발자는 실험적 성격에도 불구하고 프로덕션 웹 사이트에 접두사 기능을 포함했습니다. 이로 인해 브라우저 공급자가 새로운 기능을 개발하는 동안 호환성을 보장하기가 더욱 어려워졌습니다. 접두사가 붙은 기능을 포함하면 인기 있는 웹사이트를 렌더링하기 위해, 다른 브라우저의 접두사를 추가해야 하는 소규모 브라우저 공급자에도 피해를 주었습니다.

 이제, 브라우저의 실험적 기능은 플래그 뒤에 위치합니다.
 이를 통해 개발자는 브라우저 구성을 변경하여 향후 기능을 테스트할 수 있습니다. 또한, 브라우저는 사용자가 제어하는 플래그 또는 기본 설정 뒤에 실험적 기능을 추가합니다. 더 작은 명세서에 대해 플래그를 추가하면 훨씬 더 빠르게 안정적인 상태에 도달할 수 있습니다.

CSS 접두사
-------

이전 코드 베이스에서 볼 수 있는 가장 일반적인 브라우저 CSS 접두사는 아래와 같습니다.

* `-webkit-` (Chrome, Safari, 최신 버전의 Opera 및 Edge, 거의 모든 iOS 브라우저(iOS용 Firefox), 기본적으로 모든 WebKit 및 Chromium 기반 브라우저)
* `-moz-` (Firefox)
* `-o-` (WebKit 이전의 오래된 Opera 버전)
* `-ms-` (인터넷 익스플로러 및 Chromium 이전 Microsoft Edge)

예제 사용법입니다.


```css
-webkit-transition: all 4s ease;
-moz-transition: all 4s ease;
-ms-transition: all 4s ease;
-o-transition: all 4s ease;
transition: all 4s ease;
```


코드 베이스에서 위 코드를 발견하면 마지막 줄을 제외하고 모두 안전하게 제거할 수 있습니다. 모든 브라우저는 공급자 접두사 없이 전환을 지원합니다.


```css
transition: all 4s ease;
```

API 접두사
-------

역사적으로, 브라우저 공급자는 실험적인 API에도 접두사를 사용해 왔습니다. 전체 인터페이스가 실험적이라면 인터페이스 이름이 접두어로 붙습니다(그러나 내부의 속성이나 메서드는 붙지 않습니다). 실험적인 속성이나 방법이 표준화된 인터페이스에 추가된 경우, 개별 방법이나 속성이 앞에 붙었습니다.

### 인터페이스 접두사

인터페이스 이름의 접두사는 대문사입니다.

* `WebKit` (Chrome, Safari, 최신 버전의 Opera 및 Edge, 거의 모든 iOS 브라우저(iOS용 Firefox), 기본적으로 모든 WebKit 및 Chromium 기반 브라우저)
* `Moz` (Firefox)
* `O` (WebKit 이전의 오래된 Opera 버전)
* `MS` (인터넷 익스플로러 및 Chromium 이전 Microsoft Edge)
### 속성 및 메서드 접두사

속성과 메서드의 접두사는 소문자입니다.

* `webkit` (Chrome, Safari, 최신 버전의 Opera 및 Edge, 거의 모든 iOS 브라우저(iOS용 Firefox), 기본적으로 모든 WebKit 및 Chromium 기반 브라우저)
* `moz` (Firefox)
* `o` (WebKit 이전의 오래된 Opera 버전)
* `ms` (인터넷 익스플로러 및 Chromium 이전 Microsoft Edge)

예제 사용법입니다.


```js
window.requestAnimationFrame =
  window.requestAnimationFrame ||
  window.mozRequestAnimationFrame ||
  window.webkitRequestAnimationFrame ||
  window.oRequestAnimationFrame ||
  window.msRequestAnimationFrame;
```


코드베이스에서 위 코드를 발견하면, 첫 번째 줄을 제외한 모든 줄을 안전하게 제거할 수 있습니다. 모든 브라우저는 공급자 접두사 및 `window` 없이 `requestAnimationFrame`을 지원합니다.


```js
requestAnimationFrame(callback);
```

같이 보기
-----

* 위키백과의 브라우저 접두사
인터넷 릴레이 챗 (IRC)
===============

\*\*인터넷 릴레이 챗(Internet Relay Chat, IRC)\*\*은 IRC 서버를 통해 메시지를 보내고 받는 IRC 클라이언트와, 인터넷 연결이 필요한 전세계 채팅 시스템입니다.

Jarrko Oikarinen이 1980년대 후반에 설계한, IRC는 TCP를 사용하며 개방형 프로토콜입니다. IRC 서버는 많은 IRC 채널 중 하나에 연결된 모든 사람에게 메시지를 브로드캐스트합니다(각각 자신의 ID가 있음).
인증됨
===

**인증됨**은 애플리케이션, 콘텐츠 또는 데이터 전송이 해당 분야의 전문 지식을 갖춘 전문가에 의해 성공적으로 평가되어 완전성, 보안 및 신뢰성을 가진다는 것을 의미합니다.

암호화 인증에 대한 자세한 내용은, 디지털 인증서를 참조하세요.

같이 보기
-----

* 위키백과의 인증
CIA
===

CIA (기밀성 Confidentiality, 무결성 Integrity, 가용성 Availability) (CIA triad 또는 AIC triad라고 함)는 정보 보안에 대한 조직의 정책을 안내하는 모델입니다.

같이 보기
-----

* 위키백과의 CIA
시도-응답 인증 (Challenge-response authentication)
============================================

보안 프로토콜에서, '시도(challenge)'은 매번 다른 응답을 생성하기 위해 서버가 클라이언트에 전송하는 일부 데이터입니다. 시도-응답 프로토콜은 공격자가 이전 메시지를 듣고 나중에 다시 보내 원본 메시지와 동일한 자격 증명을 얻는 재전송 공격에 맞서 싸우는 한가지 방법입니다.

HTTP 인증 프로토콜는 시도-응답 기반이지만, "Basic" 프로토콜은 실제 시도를 사용하지 않습니다(영역은 항상 동일함).

같이 보기
-----

* 위키 백과의 시도-응답 인증
Trident
=======

Trident(또는 MSHTML)는 인터넷 익스플로러를 구동하는 레이아웃 엔진이었습니다. 'EdgeHTML' 이라는 Trident 복사본이 인터넷 익스플로러의 후속 제품인 Edge에서 Trident를 대체했습니다.

같이 보기
-----

* 위키백과의 Trident 레이아웃 엔진
타입 변환
=====

타입 변환(또는 타입캐스팅)은 데이터를 하나의 데이터 타입에서 다른 데이터 타입으로 전환하는 것을 의미합니다. 암시적 변환은 컴파일러(컴파일 언어의 경우)나 런타임(JavaScript와 같은 스크립트 언어의 경우)이 데이터 타입을 자동으로 변환하는 경우에 이루어집니다. 또한 소스 코드는 변환을 명시적으로 요구할 수도 있습니다.

예를 들어, 표현식 `"foo" + 1`에서 Number `1`은 String으로 암시적 변환이 되고 표현식은 `"foo1"`을 반환합니다. 명령문 `Number("0x11")`에서 문자열 `"0x11"`은 명시적으로 숫자 `17`로 변환됩니다.

같이 보기
-----

* 위키백과 타입 변환
* 용어 사전
    + 타입
    + 형변환
스타일 출처
======

CSS에는 스타일 변경을 위한 소스를 구분하는 세 가지 카테고리가 있습니다. 이 카테고리를 **스타일 출처**라고 합니다. 스타일 출처에는 **사용자 에이전트 출처**, **사용자 출처** 그리고 **작성자 출처**가 있습니다.

사용자 에이전트 출처

사용자 에이전트 출처는 사용자 웹 브라우저의 기본 스타일로 구성된 스타일 출처입니다. 콘텐츠에 적용할 다른 스타일이 없다면, 요소를 렌더링할 동안 사용자 에이전트 출처의 스타일이 사용됩니다.

사용자 출처

사용자 출처는 웹 브라우저 사용자가 추가한 모든 CSS를 포함하는 스타일 출처입니다. 개발자 도구를 사용해서 스타일을 추가하거나 콘텐츠에 사용자 지정 스타일을 자동으로 적용하는 Stylus 또는 Stylish와 같은 브라우저 확장 기능으로 스타일을 추가할 수 있습니다.

작성자 출처

작성자 출처는 문서의 일부인 스타일도 모두 포함하는 스타일 출처입니다. HTML 내의 스타일과 외부 스타일시트 파일의 스타일 모두 해당합니다.

스타일 출처는 `unset` 또는 `revert` 키워드를 사용할 때와 같이 스타일을 삭제할 때 요소에 적용된 스타일의 종속을 어디까지 되돌릴지(또는 역추적할지) 결정하기 위해 사용됩니다.

같이 보기
-----

* CSS Cascading and Inheritance: Cascading Origins
IP Address
==========

**IP 주소**는 IP 네트워크의 각 장치를 고유하게 지정하는 데 사용되는 번호입니다.

"IP"는 주소가 연결된 프로토콜 계층인 "Internet Protocol"을 나타냅니다.

"IP address"는 IPv6이 보다 광범위하게 배포될 때까지 여전히 32비트 IPv4 주소를 가리킨다.

같이 보기
-----

* 위키피디아의 IP 주소
자동 형변환 (Type coercion)
======================

자동 형변환(Type coercion)은 한 데이터 타입에서 다른 데이터 타입(예, 문자열을 숫자로)으로 값을 자동 또는 암시적으로 변환하는 것을 의미합니다. 형 변환은 '자동 형변환(Type coercion)'과 유사합니다. 두 경우 모두 하나의 중요한 차이점을 제외하고, 한 데이터 형식에서 다른 데이터 형식으로 값을 변환하기 때문입니다. 하나의 중요한 차이점은 '자동 형변환'은 암시적이지만, '형 변환'은 암시적이거나 명시적일 수 있습니다.

예제
--


```js
const value1 = "5";
const value2 = 9;
let sum = value1 + value2;

console.log(sum);
```


위의 예제에서, JavaScript는 숫자의 `9`를 문자열로 자동 형변환 후, 두 값을 함께 연결하여 `59`라는 문자열을 생성합니다. JavaScript는 문자열이나 숫자 중에서 선택할 수 있었고 문자열을 사용하기로 결정했습니다.

컴파일러는 `5`를 숫자로 자동 형변환하고 합의 결과를 `14`로 반환할 수 있었지만 그렇지 않았습니다. 이 결과를 반환하려면, `Number()` 메서드를 사용하여 `5`를 숫자로 명시적으로 변환해야 합니다.


```js
sum = Number(value1) + value2;
```

같이 보기
-----

* 위키백과의 형 변환
* 용어 사전
    + Type
    + Type conversion
UUID
====

**범용 고유 식별자(Universally Unique Identifier, UUID)** 는 해당 타입의 다른 모든 리소스 중에서 리소스를 고유하게 식별하는 데 사용되는 레이블입니다.

 컴퓨터 시스템은 매우 큰 난수를 사용해 로컬에서 UUID를 생성합니다.
 이론적으로 ID는 전역적으로 고유하지 않을 수 있지만, 중복 가능성은 거의 없습니다.
 시스템에 정말로 고유한 ID가 필요한 경우, 중앙 기관에서 이를 할당할 수 있습니다.

 UUID는 정규적으로 `123e4567-e89b-12d3-a456-426614174000` (하이픈으로 구분된 5개의 16진수 문자열) 형식의 36자 문자열로 표시되는 128비트 값입니다.
 계산 방식이 약간 다른 여러 버전이 있습니다. 예를 들어, 시간적 정보를 포함합니다.

공식적인 정의는 RFC4122: 범용 고유 식별자 (Universally Unique Identifier, UUID) URN 네임스페이스에서 찾을 수 있습니다.

같이 보기
-----

* 위키백과의 UUID
* `Crypto.randomUUID()` (en-US)
XHTML
=====

**XHTML**은 역사적으로 XML 구문 규칙을 준수하도록 작성된
 HTML문서를 설명하는 데 사용된 용어입니다.

아래의 예는 HTML 문서와 해당 "XHTML" 문서, 그리고 함께 제공되어야 하는 HTTP `Content-Type` 헤더를 보여줍니다.

### HTML document


```html
<!-- Content-Type: text/html -->

<!doctype html>
<html lang="en-US">
  <head>
    <meta charset="utf-8" />
    <title>HTML</title>
  </head>
  <body>
    <p>저는 HTML 문서입니다</p>
  </body>
</html>
```

### XHTML document


```xml
<!-- Content-Type: application/xhtml+xml -->

<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US">
  <head>
    <title>XHTML</title>
  </head>
  <body>
    <p>저는 XHTML 문서입니다</p>
  </body>
</html>
```


실제로, `Content-Type: application/xhtml+xml` 헤더를 사용하여 웹을 통해 제공되는 "XHTML" 문서는 거의 없습니다. 대신, 문서가 XML 구문 규칙을 따르도록 작성되었더라도 `Content-Type: text/html` 헤더와 함께 제공됩니다. 따라서 브라우저는 XML 파서가 아닌 HTML 파서를 사용하여 해당 문서를 구문 분석합니다.

같이 보기
-----

* HTML
* HTML5
* SVG
* MathML
* XML
2단계 도메인 (Second-level Domain, SLD)
==================================

2단계 도메인 (Second-level Domain, SLD)은 최상위 도메인(TLD) 바로 앞에 있는 도메인 이름의 일부입니다.

예를 들어, `mozilla.org`에서 SLD는 `mozilla`이고 TLD는 `org`입니다.

도메인 이름은 TLD 및 SLD로 제한되지 않습니다. 서버의 다양한 기능에 대한 추가 정보를 제공하거나 동일한 도메인 아래의 영역을 구분하기 위해 추가 하위 도메인을 만들 수 있습니다. 예를 들어, `www`는 도메인이 웹 서버를 가리킨다는 것을 나타내기 위해 일반적으로 사용되는 하위 도메인입니다.

또 다른 예로 `developer.mozilla.org`에서, `developer` 하위 도메인은 하위 도메인에 Mozilla 웹사이트의 개발자 섹션이 포함되어 있음을 지정하는 데 사용됩니다.

같이 보기
-----

* 위키백과의 SLD
* 용어 사전
    + DNS
    + Domain
    + Domain name
    + TLD
W3C
===

월드 와이드 웹 컨소시엄(World Wide Web Consortium, W3C)은 웹 관련 규칙과 프레임워크를 유지 관리하는 국제 기관입니다.

웹 표준을 공동으로 개발하고, 지원 프로그램을 실행하고, 웹에 관해 이야기하기 위한 공개 포럼을 유지하는 350개 이상의 회원 조직으로 구성되어 있습니다. W3C는 업계의 기업들이 동일한 W3C 표준을 구현하도록 조정합니다.

각 표준은 초안(Working Draft, WD), 후보 권고안(Candidate Recommendation, CR), 제안 권고안(Proposed Recommendation, PR) 및 권고안(W3C Recommendation, REC) 4가지의 발전 단계를 거칩니다.

같이 보기
-----

* W3C 웹사이트
* 위키백과의 W3C
Time to interactive (TTI)
=========================

**Time to Interactive(TTI)** 는 마지막 긴 작업 (en-US)이 완료되고 5초의 네트워크 및 메인 스레드가 비활성화된 시점으로 정의된 비표준화된 웹 성능 '진행' 측정항목입니다.

2018년 Web Incubator Community Group에서 제안한 TTI는 페이지나 애플리케이션에 유용한 콘텐츠가 포함되어 있고 메인 스레드가 유휴 상태이며 이벤트 핸들러 등록을 포함해 사용자 상호작용에 자유롭게 응답하는 경우를 설명하는 측정 기준을 제공하기 위한 것입니다.

#### 경고

TTI는 긴 작업 API (en-US)의 정보를 활용하여 파생되어 나온 정보입니다. 일부 성능 모니터링 도구에는 사용할 수 있지만, TTI는 이 글을 쓰는 시점에서는 공식 웹 명세서의 일부가 아닙니다.

같이 보기
-----

* Web Incubator Community Group의 TTI의 정의
* Radimir Bitsov의 Time to Interactive — 인간 중심 지표에 초점
* TTI 추적
문서 타입 정의
========

HTML에서, doctype은 모든 문서의 최상단에서 찾을 수 있는 "`<!DOCTYPE html>`" 필수 서문입니다. doctype은 브라우저가 문서를 렌더링 할 때 "quirks mode" (en-US)로 바뀌지 않도록하는 것이 유일한 목적입니다. "`<!DOCTYPE html>`" doctype은 브라우저가 일부 스펙과 맞지 않는 다른 렌더링 모드를 사용하기 보다는 적절한 스펙을 따르는 최선의 시도를 하도록 합니다.

같이 보기
-----

* HTML 명세서의 DOCTYPE 정의
* Quirks Mode와 Standards Mode (en-US)
* doctype을 리턴하는 JavaScript 함수인 Document.doctype
서버 타이밍 (Server Timing)
======================

서버 타이밍 (Server Timing) 명세서는 서버가 요청-응답 주기의 성능 메트릭을 사용자 에이전트에 전달할 수 있도록 하고, JavaScript 인터페이스를 활용하여 애플리케이션이 이러한 메트릭을 수집, 처리 및 실행하여 애플리케이션 제공을 최적화할 수 있도록 합니다.

같이 보기
-----

* https://www.w3.org/TR/server-timing/
* 리소스 타이밍(Resource Timing)
WebSockets
==========

'WebSocket'은 언제든지 데이터를 교환할 수 있도록 서버와 클라이언트 간의 지속적인 TCP 연결을 허용하는 프로토콜입니다.

어떤 클라이언트나 서버 애플리케이션도 WebSocket을 사용할 수 있지만, 주로 웹 브라우저와 웹 서버를 사용합니다. WebSocket을 통해, 서버는 사전 클라이언트 요청 없이 클라이언트에 데이터를 전달할 수 있으므로 동적 컨텐츠 업데이트가 가능합니다.

같이 보기
-----

* 위키백과의 웹소켓
* MDN의 WebSocket 참조
* WebSocket 클라이언트 애플리케이션 작성
* 웹소켓 서버 작성
루프 (Loop)
=========

\*\*루프 (Loop)\*\*은 특정 조건이 충족될 때까지 반복되는 명령의 나열입니다. 예를 들어, 데이터 요소를 가져와 변경한 다음 카운터가 정한 숫자에 도달했는지 여부와 같이 일부 조건이 확인되었는지 검사하는 프로세스가 있습니다.

루프는 여러 번 명령문을 실행하는 방법 중 하나입니다. 재귀를 사용하여 동일한 효과를 얻을 수 있는데, 특히 모든 데이터가 불변이어서 카운터 변수를 갱신할 수 없는 언어에서 반복을 통해 같은 효과를 얻을 수 있습니다.

같이 보기
-----

* 위키백과의 제어 흐름
* 루프와 반복 안내서
Character
=========

"문자"는 기호(글자, 숫자, 문장 부호) 또는 비출력 "제어"(예: 캐리지 리턴 또는 소프트 하이픈(U+00AD))이다. UTF-8은 가장 보편적인 문자 세트이며 유명한 인간 언어들의 문자를 포함한다.

같이 보기
-----

* Wikipedia의 Character (computing)
* Wikipedia의 Character encoding
* Wikipedia의 ASCII
* Wikipedia의 UTF-8
* Wikipedia의 유니코드
동일 출처 정책 (Same-origin policy)
=============================

**동일 출처 정책 (Same-origin policy)** 은 하나의 출처에서 로드된 문서나 스크립트가 다른 출처의 리소스와 상호작용할 수 있는 방법을 제한하는 중요한 보안 메커니즘입니다.

잠재적으로 악의적인 문서를 격리하여, 가능한 공격 경로를 줄이는 데 도움이 됩니다.

같이 보기
-----

* 동일 출처 정책
* MDN 웹 문서 용어사전:
    + CORS
    + origin
GPU
===

GPU(Graphics Processing Unit)는 CPU(중앙 처리 장치)와 유사한 컴퓨터 부품입니다. 모니터에 그래픽(2D와 3D 모두)을 그리는 것을 전문으로 하는 부품입니다.
전역 환경 (Document environment)
============================

JavaScript 전역 환경이 윈도우나 iframe인 경우에, 이 환경을 '문서 환경(document environment)'이라고 합니다. 전역 환경은 외부 환경이 없는 환경입니다.

같이 보기
-----

* HTML 명세서의 문서 환경
보간법 (Interpolation)
===================

보간법 (Interpolation)은 알려진 값을 기반으로 값을 계산하는 프로세스입니다. 보간법은 애니메이션 프로세스 중에 높이, 너비 등과 같은 속성의 중간 값을 얻는 데 사용됩니다. 그라데이션에서는, 제공된 색상 목록을 기반으로 색상의 중간 값을 정의하는 데 보간법이 사용됩니다. 또한, "보간"이라는 용어는 템플릿 리터럴의 문자열 대체에 대한 설명으로 사용됩니다.

같이 보기
-----

* 위키백과의 보간법
* 위키백과의 문자열 보간법
크로스 사이트 스크립팅 (Cross-site scripting (XSS))
=========================================

크로스 사이트 스크립팅 (XSS)은 공격자가 웹사이트에 악성 클라이언트 사이드 코드를 삽입할 수 있도록 하는 보안 취약점 공격입니다. 이 악성 코드는 피해자에 의해 실행되며 공격자가 접근 제어를 우회하고 사용자로 위장할 수 있게 만들어 줍니다. 오픈 웹 애플리케이션 보안 프로젝트에 따르면, XSS는 2017년에 7번째로 흔한 웹 앱 취약점이었습니다.

웹 앱이 충분한 유효성 검사나 인코딩을 사용하지 않으면 이러한 공격은 성공하게 됩니다. 사용자의 브라우저는 신뢰할 수 없는 악성 스크립트를 탐지할 수 없고, 쿠키, 세션 토큰 또는 기타 민감한 사이트별 정보에 대한 접근 권한을 부여해버리거나 악성 스크립트가 HTML 콘텐츠를 다시 작성할 수 있도록 합니다.

같이 보기
-----

* 공격 유형: 크로스 사이트 스크립팅 (XSS)
* 위키백과의 크로스 사이트 스크립팅
* OWASP의 크로스 사이트 스크립팅
* 크로스 사이트 스크립팅에 대한 다른 글
암호화 기법 (Cryptography)
=====================

**암호화 기법** 또는 암호학은 메시지를 안전하게 인코딩하고 전송하는 방법을 연구하는 과학입니다. 암호학은 안전하지 않은 환경에서 메시지를 인코딩 및 디코딩하는 데 사용되는 알고리즘과 해당 애플리케이션을 설계하고 연구합니다.

암호학은 **데이터 기밀성** 뿐만 아니라 **식별**, **인증**, **부인 방지** 및 **데이터 무결성**도 처리합니다. 따라서 **암호화 시스템**이라는 맥락에서 암호화 방법의 사용법도 연구합니다.

같이 보기
-----

* 위키백과의 암호학
* MDN 웹 문서 용어사전
    + 블록 암호 운용 방식
    + 암호
    + 암호문
    + 암호화 스위트
    + 암호 해독
    + 복호화
    + 암호화
    + 키
    + 평문
    + 공개키 암호화
    + 대칭키 암호화
SIMD
====

SIMD ("seem-dee"로 발음) 는 컴퓨터 구조 분류 중 하나인 단일 명령어/복수 데이터(**Single Instruction/Multiple Data**)의 단축입니다. SIMD는 같은 연산 하나가 결과상 데이터 레벨 병렬화 및 성능 향상이 되는 여러 데이터 요소(point)에 수행될 수 있게 합니다, 가령 3D graphics 및 video 처리, 물리 시뮬레이션 또는 암호화(cryptography) 및 다른 도메인을 위한.

명령어 또는 데이터 집합 내 병렬화 없는 순차 구조의 경우 SISD 참조.

더 알아보기
------

### 일반 지식

* SIMD in JavaScript
* SIMD on Wikipedia
그리드 열 (Grid Column)
===================

\*\*그리드 열(Grid Column)\*\*은 CSS 그리드 레이아웃의 수직 트랙이며 두 수직 그리드 선 사이의 공간입니다. 이것은 `grid-template-columns` 속성이나 약식 `grid` (en-US) 또는 `grid-template` (en-US) 속성으로 정의됩니다.

또한, 요소가 '명시적 그리드'에서 생성된 열 외부에 배치되면 '암시적 그리드'에 열이 생성될 수 있습니다. 이러한 열은 기본적으로 크기가 자동으로 조정되거나, `grid-auto-columns` (en-US) 속성으로 지정된 크기를 가질 수 있습니다.

CSS 그리드 레이아웃에서 정렬 작업을 할 때, 열이 아래로 이어지는 축을 '블록 또는 열 방향의 축'이라고 합니다.

같이 보기
-----

### 속성 참고서

* `grid-template-columns`
* `grid-auto-columns` (en-US)
* `grid` (en-US)
* `grid-template` (en-US)
### 더 읽어보기

* CSS 그리드 레이아웃 안내서: 그리드 레이아웃의 기본 개념
BigInt
======

JavaScript에서, **BigInt**는 임의 정밀도 방식으로 정수를 나타낼 수 있는 숫자 데이터 타입입니다. 다른 프로그래밍 언어에서는 Intergers, Floats, Doubles, Bignums와 같은 다른 숫자 타입들이 존재할 수 있습니다.

같이 보기
-----

* Numeric types 위키피디아
* JavaScript 타입: `BigInt`
* JavaScript 전역 객체 `BigInt`