initial commit

18 files changed, 2201 insertions, 0 deletions

diff --git a/files/ko/webapi/alarm/index.html b/files/ko/webapi/alarm/index.html
new file mode 100644
index 0000000000..16c18d9bce
--- /dev/null
+++ b/files/ko/webapi/alarm/index.html
@@ -0,0 +1,181 @@
+---
+title: Alarm API
+slug: WebAPI/Alarm
+translation_of: Archive/B2G_OS/API/Alarm_API
+---
+<p>{{ SeeCompatTable() }}</p>
+<h2 id="개요">개요</h2>
+<p>Alarm API는 스케줄 알림, 또는 어플리케이션이 동작할 특정 시간을 설정한다. 알람 같은 어플리케이션 -시계, 달력, 자동 업데이트 등-은 특정 시간의 동작을 활성화해주는 <span style="line-height: inherit;">Alarm API가 필요하다.</span></p>
+<p>알람은 시스템 메시지 API를 통해 어플리케이션으로 전달된다. 알람 메시지에 허가된 어플리케이션은 알람을 사용할 수 있다.</p>
+<p>알람은 {{domxref("MozAlarmsManager")}} 인터페이스의 인스턴스 객체인 <span style="line-height: inherit;">{{domxref("window.navigator.mozAlarms")}} 로 설정한다.</span></p>
+<p> </p>
+<h2 id="example" name="example">알람 일정 설정하기 </h2>
+<p>알람을 사용할 때는 시간 설정 부터 시작한다. 표준 시간대(타임존) 기준으로 두가지의 알람이 있지만 공통적으로 {{domxref("MozAlarmsManager.add")}} 메소드를 사용한다.</p>
+<div class="note">
+  <p><strong>Note:</strong>  알람이 특정 어플리케이션에 타겟팅 되지 않았다면 시스템은 알람을 기다리는 모든 어플리케이션에 신호를 전달할 것이다.</p>
+</div>
+<h3 id="표준_시간대를_무시하는_알람">표준 시간대를 무시하는 알람</h3>
+<p>이 알람은 기기의 로컬 시간대에 맞춰 전송된다. 사용자가 시간대를 변경하면, 알람은 새로운 시간대에 맞춰 전송될 것이다. 예를 들면, 파리의 사용자가 CET <span style="line-height: inherit;">(</span><em>Central European Time</em><span style="line-height: inherit;">) 기준으로 오후 12시에 알람을 설정하다가 샌프란시스코로 이동하면 PDT </span><span style="line-height: inherit;">(</span><em>Pacific Daylight Time</em><span style="line-height: inherit;">) 기준의 오후 12시에 알람을 받는다.</span></p>
+<pre class="brush: js">// 알람 일정
+var myDate  = new Date("May 15, 2012 16:20:00");
+
+// 알람이 울릴 때 사용할 임의의 데이터
+
+var data    = {
+  foo: "bar"
+}
+
+// 표준시간대를 무시하도록 "ignoreTimezone" 설정
+var request = navigator.mozAlarms.add(myDate, "ignoreTimezone", data);
+
+request.onsuccess = function () {
+  console.log("The alarm has been scheduled");
+};
+
+request.onerror = function () {
+  console.log("An error occurred: " + this.error.name);
+};
+</pre>
+<h3 id="표준_시간대_기준의_알람">표준 시간대 기준의 알람</h3>
+<p>이 알람은 알람 일정을 정한 당시의 표준 시간에 맞춰 알람 신호가 전송된다. 사용자가 시간대를 변경하더라도 표준 시간대에 맞춰 알람이 울릴 것이다. 예를 들면, 파리의 사용자가 CET 기준 오후 12시에 설정하고 샌프란시스코로 이동한다면 PDT 기준 오전 3시에 알람이 울릴 것이다.</p>
+<pre class="brush: js">// 알람 일정
+var myDate  = new Date("May 15, 2012 16:20:00");
+
+// 알람이 울릴 때 사용할 임의의 데이터
+var data    = {
+  foo: "bar"
+}
+
+// 표준 시간대를 반영한 알람을 사용하도록 "honorTimezone" 설정
+var request = navigator.mozAlarms.add(myDate, "honorTimezone", data);
+
+request.onsuccess = function () {
+  console.log("The alarm has been scheduled");
+};
+
+request.onerror = function () {
+  console.log("An error occurred: " + this.error.name);
+};
+</pre>
+<h2 id="알람_관리">알람 관리 </h2>
+<p>알람을 한번 생성하면 계속 관리할 수 있다.</p>
+<p>{{domxref("MozAlarmsManager.getAll")}} 메소드는 현재 설정된 모든 알람 리스트를 반환한다. 이 리스트는 {{Anch("mozAlarm")}} 객체의 배열이다.</p>
+<h3 id="mozAlarm">mozAlarm</h3>
+<p>{{page("/en-US/docs/Web/API/MozAlarmsManager.getAll","mozAlarm")}}</p>
+<pre class="brush: js">var request = navigator.mozAlarms.getAll();
+
+request.onsuccess = function () {
+  this.result.forEach(function (alarm) {
+    console.log('Id: ' + alarm.id);
+    console.log('date: ' + alarm.date);
+    console.log('respectTimezone: ' + alarm.respectTimezone);
+    console.log('data: ' + JSON.stringify(alarm.data));
+  });
+};
+
+request.onerror = function () {
+  console.log("An error occurred: " + this.error.name);
+};
+</pre>
+<p>{{domxref("MozAlarmsManager.remove")}} : 알람 설정 해제</p>
+<pre class="brush: js">var alarmId;
+
+// 알람 설정 &amp; request 변수에 알람 id 저장
+var request = navigator.mozAlarms.add(new Date("May 15, 2012 16:20:00"), "honorTimezone");
+
+request.onsuccess = function () {
+  alarmId = this.result.id;
+}
+
+// ...
+
+// 알람 해제
+if (alarmId) {
+  navigator.mozAlarms.remove(alarmId);
+}
+</pre>
+<h2 id="알람_다루기">알람 다루기 </h2>
+<p>시스템이 알람 신호를 전송할 때는 모든 어플리케이션에서 받아 쓸 수 있다. 어플리케이션에서 알람을 사용하려면 알람 핸들러의 권한을 추가해야 한다. 이는, 시스템 메시징 API의 두 단계를 거치면 된다.: </p>
+<p>1, <a href="/en-US/docs/Apps/Manifest#messages" title="/en-US/docs/Apps/Manifest#messages">application manifest</a> 의 message property에 <code>alarm property를 추가하고 알람 신호를 받아서 사용할 콜백 함수가 등록된 문서의 URL 경로를 입력한다.</code></p>
+<pre class="brush: js">"messages": [
+  { "alarm": "/index.html" }
+]</pre>
+<p>2. 어플리케이션에 <code>alarm</code> message에 대한 콜백 함수를 추가한다. {{domxref("window.navigator.mozSetMessageHandler","navigator.mozSetMessageHandler")}} 메소드를 사용한다. 이 콜백 함수는 알람 관련 데이터가 포함된 {{Anch("mozAlarm")}} 객체에 접근할 수 있다.</p>
+<pre class="brush: js">navigator.mozSetMessageHandler("alarm", function (mozAlarm) {
+  alert("alarm fired: " + JSON.stringify(mozAlarm.data));
+});
+</pre>
+<p>어플리케이션이 시스템 레벨에서 아직 동작하지 않은 알람의 유무를 파악하고 싶다면 {{domxref("window.navigator.mozHasPendingMessage","navigator.mozHasPendingMessage")}} 메소드의 value를 "<code>alarm"으로 설정하면 된다.</code></p>
+<pre class="brush: js">navigator.mozHasPendingMessage("alarm");
+</pre>
+<h2 id="명세">명세 </h2>
+<table class="standard-table">
+  <thead>
+    <tr>
+      <th scope="col">Specification</th>
+      <th scope="col">Status</th>
+      <th scope="col">Comment</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td>{{SpecName('Alarm API')}}</td>
+      <td>{{Spec2('Alarm API')}}</td>
+      <td>Initial specification.</td>
+    </tr>
+  </tbody>
+</table>
+<h2 id="브라우저_호환">브라우저 호환</h2>
+<p>{{ CompatibilityTable() }}</p>
+<div id="compat-desktop">
+  <table class="compat-table">
+    <tbody>
+      <tr>
+        <th>Feature</th>
+        <th>Chrome</th>
+        <th>Firefox (Gecko)</th>
+        <th>Internet Explorer</th>
+        <th>Opera</th>
+        <th>Safari</th>
+      </tr>
+      <tr>
+        <td>Basic support</td>
+        <td>{{ CompatUnknown()}}</td>
+        <td>{{CompatGeckoDesktop("16")}} {{ property_prefix("moz") }}</td>
+        <td>{{ CompatNo() }}</td>
+        <td>{{ CompatNo() }}</td>
+        <td>{{ CompatNo() }}</td>
+      </tr>
+    </tbody>
+  </table>
+</div>
+<div id="compat-mobile">
+  <table class="compat-table">
+    <tbody>
+      <tr>
+        <th>Feature</th>
+        <th>Android</th>
+        <th>Chrome for Android</th>
+        <th>Firefox Mobile (Gecko)</th>
+        <th>IE Mobile</th>
+        <th>Opera Mobile</th>
+        <th>Safari Mobile</th>
+      </tr>
+      <tr>
+        <td>Basic support</td>
+        <td>{{ CompatUnknown() }}</td>
+        <td>{{ CompatNo() }}</td>
+        <td>{{CompatGeckoMobile("10")}} {{ property_prefix("moz") }}</td>
+        <td>{{ CompatNo() }}</td>
+        <td>{{ CompatNo() }}</td>
+        <td>{{ CompatNo() }}</td>
+      </tr>
+    </tbody>
+  </table>
+</div>
+<h2 id="관련">관련 </h2>
+<ul>
+  <li>{{domxref("window.navigator.mozAlarms","navigator.mozAlarms")}}</li>
+  <li>{{domxref("MozAlarmsManager")}}</li>
+  <li>{{domxref("window.navigator.mozSetMessageHandler")}}</li>
+</ul>
diff --git a/files/ko/webapi/battery_status/index.html b/files/ko/webapi/battery_status/index.html
new file mode 100644
index 0000000000..12347b0f20
--- /dev/null
+++ b/files/ko/webapi/battery_status/index.html
@@ -0,0 +1,75 @@
+---
+title: Battery Status API
+slug: WebAPI/Battery_Status
+tags:
+  - API
+  - Apps
+  - Battery API
+  - Battery Status API
+  - Obsolete
+  - 가이드
+  - 개요
+  - 모바일
+  - 배터리
+  - 어플리케이션
+translation_of: Web/API/Battery_Status_API
+---
+<div>{{DefaultAPISidebar("Battery API")}}{{Obsolete_Header}}</div>
+
+<p><strong>Battery API </strong>만큼이나 자주 언급되는 <strong>Battery Status API</strong>는 시스템의 배터리 충전 상태에 대한 정보를 제공하고, 배터리 상태에 따라 발생하는 이벤트를 다룰 수 있도록 해 줍니다. 배터리가 얼마남지 않은 상황에서, 앱에서 배터리의 소모를 줄인다거나 배터리가 방전되기 전에 데이터를 저장하거나 하는 것들이 가능합니다.</p>
+
+<p>Battery Status API 는 {{domxref("window.navigator.battery")}} 를 제공 합니다. 이는 {{domxref("BatteryManager")}} 객체이며 배터리 상태를 감시하고 전달받아 처리할 수 있는 이벤트를 가지고 있습니다.</p>
+
+<h2 id="예제">예제</h2>
+
+<p>아래 예제에서는 배터리가 충전중인 상태 (전원 케이블을 연결하여 충전 중인지) 와 배터리 수준의 변화를 감시합니다. 각각 {{event("chargingchange")}} 와 {{event("levelchange")}} 이벤트가 발생하면 완료 됩니다.</p>
+
+<pre class="brush: js notranslate">var battery = navigator.battery || navigator.mozBattery || navigator.webkitBattery;
+
+function updateBatteryStatus() {
+  console.log("Battery status: " + battery.level * 100 + " %");
+
+  if (battery.charging) {
+    console.log("Battery is charging");
+  }
+}
+
+battery.addEventListener("chargingchange", updateBatteryStatus);
+battery.addEventListener("levelchange", updateBatteryStatus);
+updateBatteryStatus();
+</pre>
+
+<p>명세서의 예제도 <strong><a href="http://dev.w3.org/2009/dap/system-info/battery-status.html#introduction" title="http://dev.w3.org/2009/dap/system-info/battery-status.html#introduction">확인</a></strong>해보세요.</p>
+
+<h2 id="사양">사양</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName("Battery API")}}</td>
+   <td>{{Spec2("Battery API")}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="브라우저_호환성">브라우저 호환성</h2>
+
+<div class="hidden">이 페이지의 호환성 표는 구조화된 데이터에서 생성됩니다. 만약 데이터의 기여하고 싶다면, <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>를 확인하고 pull 요청을 우리에게 보내세요.</div>
+
+<p>{{Compat("api.BatteryManager")}}</p>
+
+<h2 id="더보기">더보기</h2>
+
+<ul>
+ <li><a class="external" href="http://hacks.mozilla.org/2012/02/using-the-battery-api-part-of-webapi/">Hacks blog post - Using the Battery API</a></li>
+ <li>{{domxref("BatteryManager")}}</li>
+ <li>{{domxref("window.navigator.battery","navigator.battery")}}</li>
+</ul>
diff --git a/files/ko/webapi/contacts/index.html b/files/ko/webapi/contacts/index.html
new file mode 100644
index 0000000000..277b5fb146
--- /dev/null
+++ b/files/ko/webapi/contacts/index.html
@@ -0,0 +1,210 @@
+---
+title: Contacts
+slug: WebAPI/Contacts
+translation_of: Archive/B2G_OS/API/Contacts_API
+---
+<section class="Quick_links" id="Quick_Links">
+<ol>
+ <li><strong><a href="/en-US/docs/Web/API/Contacts_API">Contacts API</a></strong></li>
+ <li data-default-state="open"><a href="#"><strong>Interfaces</strong></a>
+  <ol>
+   <li><a href="/en-US/docs/Web/API/ContactManager"><code>ContactManager</code></a></li>
+   <li><a href="/en-US/docs/Web/API/MozContact"><code>MozContact</code></a></li>
+   <li><a href="/en-US/docs/Web/API/MozContactChangeEvent"><code>MozContactChangeEvent</code></a></li>
+  </ol>
+ </li>
+ <li data-default-state="open"><a href="#"><strong>Properties</strong></a>
+  <ol>
+   <li><a href="/en-US/docs/Web/API/Navigator/mozContacts"><code>Navigator.mozContacts</code></a></li>
+  </ol>
+ </li>
+ <li data-default-state="open"><a href="#"><strong>Events</strong></a>
+  <ol>
+   <li><a href="/en-US/docs/Web/Events/success"><code>success</code></a></li>
+   <li><a href="/en-US/docs/Web/Events/error"><code>error</code></a></li>
+   <li><a href="/en-US/docs/Web/Events/contactchange"><code>contactchange</code></a></li>
+  </ol>
+ </li>
+</ol>
+</section>
+
+<div class="overheadIndicator nonStandard nonStandardHeader">
+<p><strong>Non-standard</strong><br>
+ This feature is not on a current W3C standards track, but it is supported on the Firefox OS platform. Although implementations may change in the future and it is not supported widely across browsers, it is suitable for use in code dedicated to Firefox OS apps.</p>
+</div>
+
+<div class="warning">
+<p style="text-align: center;">This API is available on <a href="/en-US/docs/Mozilla/Firefox_OS">Firefox OS</a> for <a href="/en-US/docs/Mozilla/Firefox_OS/Security/Application_security#App_Types">privileged or certified applications</a> only.</p>
+</div>
+
+<h2 id="요약">요약</h2>
+
+<p>주소록 API는 사용자 시스템의 주소록을 관리할 수 있는 간단한 인터페이스를 제공합니다. 주소록 API의 전형적인 사용 예는 주소록을 관리하는 어플리케이션을 제작하는 일입니다.</p>
+
+<div class="note">
+<p><strong>주의:</strong> 사용자의 연락처와 같은 개인 정보는 민감한 자료이기 때문에 권한 앱이나 인증입만이 이 API에 직접 접근할 수 있습니다. 다른 어플리케이션은 <a href="/ko/docs/WebAPI/Web_Activities" title="/ko/docs/WebAPI/Web_Activities">Web Activities</a>를 사용해서 연락처에 접근하는 작업을 수행하게 하는 일을 권장합니다.</p>
+</div>
+
+<h2 id="연락처_관리">연락처 관리</h2>
+
+<p>시스템의 주소록에 저장된 연락처는 {{domxref("window.navigator.mozContacts","navigator.mozContacts")}} 속성을 통해서 접근할 수 있습니다. 이 속성은 {{domxref("ContactManager")}} 인터페이스의 인스턴스입니다.</p>
+
+<h3 id="연락처_추가">연락처 추가</h3>
+
+<p>시스템의 주소록에 새로운 항목을 추가하는 일은 두가지 단계를 거칩니다:</p>
+
+<ol>
+ <li>필요한 속성이 담긴 새로운 {{domxref("mozContact")}} 객체와 필드 인스턴스를 만듭니다. {{domxref("mozContact")}} 인터페이스는 추가할 연락처의 모든 가능한 속성을 정의하고 있습니다. 이 속성들은 대부분 아래에 나온 예외를 제외하고 vCard 4.0 명세의 내용과 거의 비슷합니다:
+  <ul>
+   <li>vCard N 속성은 다음 5개의 속성으로 나눠졌습니다: {{domxref("mozContact.familyName","familyName")}}, {{domxref("mozContact.givenName","givenName")}}, {{domxref("mozContact.additionalName","additionalName")}}, {{domxref("mozContact.honorificPrefix","honorificPrefix")}}, {{domxref("mozContact.honorificSuffix","honorificSuffix")}}</li>
+   <li>vCard FN 속성은 {{domxref("mozContact.name","name")}}으로 이름이 변경되었습니다.</li>
+   <li>vCard GENDER 속성은 다음 2개의 속성으로 나눠졌습니다: {{domxref("mozContact.sex","sex")}}, {{domxref("mozContact.genderIdentity","genderIdentity")}}</li>
+  </ul>
+ </li>
+ <li>연락처 객체를 첫번째 파라메터로 해서 {{domxref("ContactManager.save()")}} 메서드를 사용합니다. 이 메서드는 {{domxref("DOMRequest")}}를 반환해서 성공 여부를 확인할 수 있게 해줍니다.</li>
+</ol>
+
+<pre class="brush: js">var person = new mozContact();
+person.givenName  = ["John"];
+person.familyName = ["Doe"];
+person.nickName   = ["No kidding"];
+
+var saving = navigator.mozContacts.save(person);
+
+saving.onsuccess = function() {
+  console.log('new contact saved');
+  // This update the person as it is stored
+  // It includes its internal unique ID
+  // Note that saving.result is null here
+};
+
+saving.onerror = function(err) {
+  console.error(err);
+};
+</pre>
+
+<h3 id="연락처_찾기">연락처 찾기</h3>
+
+<p>시스템의 주소록에서 연락처를 가져오는 두개의 메서드가 있습니다:</p>
+
+<ul>
+ <li>특정 목록을 가져오기 위해서는 {{domxref("ContactManager.find()")}}를 사용합니다.</li>
+ <li>모든 연락처를 가져오기 위해서는 {{domxref("ContactManager.getAll()")}}를 사용합니다.</li>
+</ul>
+
+<p>두 메서드는 필터와 정렬 옵션을 정의하는 객체를 파라메터로 사용합니다. {{domxref("ContactManager.getAll")}}은 정렬 옵션만을 사용합니다. 이 옵션은 다음과 같습니다:</p>
+
+<ul>
+ <li><code>sortBy</code>: 검색 결과가 정렬될 필드를 나타내는 문자열입니다. 현재는 givenName과 familyName 만 지원합니다.</li>
+ <li><code>sortOrder</code>: 결과의 정렬 순서를 나타내는 문자열입니다. <code>descending</code>과 <code>ascending</code>을 사용할 수 있습니다.</li>
+</ul>
+
+<p>필터 옵션은 다음과 같습니다:</p>
+
+<ul>
+ <li><code>filterBy</code>: 필터가 적용될 필드를 나타내는 문자열의 배열입니다.</li>
+ <li><code>filterValue</code>: 대조할 값을 나타냅니다.</li>
+ <li><code>filterOp</code>: 사용할 필터 비교 연산입니다. 가능한 값으로는 equals, startsWith, match가 있습니다. 후자는 특정 전화번호를 나타냅니다.</li>
+ <li><code>filterLimit</code>: {{domxref("ContactManager.find()","find")}} 메서드로 가져올 연락처의 갯수입니다.</li>
+</ul>
+
+<p>{{domxref("ContactManager.find","find")}}는 {{domxref("DOMRequest")}} 객체를 반환하고 {{domxref("ContactManager.getAll","getAll")}}는 {{domxref("DOMCursor")}} 객체를 반환해서 검색의 성공 실패 여부를 확인할 수 있습니다.</p>
+
+<p>검색이 성공적으로 완료되면 검색 결과는 {{domxref("DOMRequest.result")}} 속성을 통해서 사용할 수 있고 {{domxref("ContactManager.find","find")}}의 경우에는 {{domxref("mozContact")}} 객체의 배열이, {{domxref("ContactManager.getAll","getAll")}}의 경우에는 하나의 {{domxref("mozContact")}} 객체가 반환됩니다. {{domxref("ContactManager.getAll","getAll")}}에서 다음 결과를 사용하려면 커서의 <code>continue()</code> 메서드를 사용합니다.</p>
+
+<pre class="brush: js">var options = {
+  filterValue : "John",
+  filterBy    : ["givenName","name","nickName"],
+  filterOp    : "contains",
+  filterLimit : 1,
+  sortBy      : "familyName"
+  sortOrder   : "ascending"
+}
+
+var search = navigator.mozContacts.find(options);
+
+search.onsuccess = function() {
+  if (search.result.length === 1) {
+    var person = search.result[0];
+    console.log("Found:" + person.givenName[0] + " " + person.familyName[0]);
+  } else {
+    console.log("Sorry, there is no such contact.")
+  }
+}
+
+search.onerror = function() {
+  console.warn("Uh! Something goes wrong, no result found!");
+}
+
+var allContacts = navigator.mozContacts.getAll({sortBy: "familyName", sortOrder: "descending"});
+
+allContacts.onsuccess = function(event) {
+  var cursor = event.target;
+  if (cursor.result) {
+    console.log("Found: " + cursor.result.givenName[0] + " " + cursor.result.familyName[0]);
+    cursor.continue();
+  } else {
+    console.log("No more contacts");
+  }
+}
+
+allContacts.onerror = function() {
+  console.warn("Something went terribly wrong! :(");
+}
+</pre>
+
+<h3 id="연락처_수정">연락처 수정</h3>
+
+<p>{{domxref("ContactManager.find()","find()")}}나 {{domxref("ContactManager.getAll()","getAll()")}}(또는 새 연락처를 {{domxref("ContactManager.save()","save()")}}로 성공적으로 저장한 후)로 연락처를 가져오면 이 연락처에는 몇가지 메타데이터가 붙습니다:</p>
+
+<ul>
+ <li>{{domxref("mozContact.id")}}로 사용할 수 있는 유일한 ID 값</li>
+ <li>마지막으로 연락처가 수정된 시각을 나타내는 {{domxref("mozContact.updated")}}의 <a href="/ko/docs/JavaScript/Reference/Global_Objects/Date" title="/ko/docs/JavaScript/Reference/Global_Objects/Date">Date</a> 객체</li>
+</ul>
+
+<p>연락처를 수정하기 위해서는 속성값을 변경한 다음에 {{domxref("ContactManager.save()","save()")}} 메서드를 사용해서 저장하면 됩니다.</p>
+
+<div class="note">
+<p><strong>주의:</strong> 연락처가 추가되거나 수정, 삭제되면 {{event("contactchange")}} 이벤트가 발생하고 이를 통해 시스템 주소록의 변경사항을 추적할 수 있습니다. 이 이벤트는 {{domxref("ContactManager.oncontactchange")}} 속성을 이용해서 다룰 수 있습니다.</p>
+</div>
+
+<h3 id="연락처_삭제">연락처 삭제</h3>
+
+<p>{{domxref("ContactManager.remove()")}} 메서드를 사용해서 간단하게 전달된 {{domxref("mozContact")}} 객체를 삭제할 수 있습니다.</p>
+
+<p>특수한 경우에는 모든 연락처 정보를 삭제할 수도 있습니다. {{domxref("ContactManager.clear()")}}를 사용하면 됩니다. 이 메서드를 사용할 때에는 특히 주의해야 합니다. 다시 되돌릴 수 있는 방법이 없습니다.</p>
+
+<h2 id="Specifications" name="Specifications">명세</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{ SpecName('Contacts', '', 'Contacts Manager API') }}</td>
+   <td>{{ Spec2('Contacts') }}</td>
+   <td>First Working Draft (unstable)</td>
+  </tr>
+  <tr>
+   <td><a href="http://tools.ietf.org/html/rfc6350" title="http://tools.ietf.org/html/rfc6350">vCard Format Specification</a></td>
+   <td>RFC</td>
+   <td><code>RFC6350</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="브라우저_호환성">브라우저 호환성</h2>
+
+<h2 id="참고_자료">참고 자료</h2>
+
+<ul>
+ <li>{{domxref("window.navigator.mozContacts","navigator.mozContacts")}}</li>
+ <li>{{domxref("mozContact")}}</li>
+ <li>{{domxref("ContactManager")}}</li>
+ <li>{{domxref("MozContactChangeEvent")}}</li>
+</ul>
diff --git a/files/ko/webapi/detecting_device_orientation/index.html b/files/ko/webapi/detecting_device_orientation/index.html
new file mode 100644
index 0000000000..664842f66d
--- /dev/null
+++ b/files/ko/webapi/detecting_device_orientation/index.html
@@ -0,0 +1,273 @@
+---
+title: 기기 방향 감지하기
+slug: WebAPI/Detecting_device_orientation
+translation_of: Web/API/Detecting_device_orientation
+---
+<div>{{SeeCompatTable}}</div>
+
+<h2 id="요약">요약</h2>
+
+<p>웹을 이용 가능한 기기들은 자신들의 방향을 알 수 있게 되었다. 즉, 중력과의 관계에서 자신의 방향의 변화를 나타내는 데이터를 알 수 있다는 뜻이다. 특히, 휴대 전화와 같이 손에 쥐고 쓸 수 있는 기기들은 이 정보를 화면을 수직으로 유지하기 위해 자동으로 회전시키는데 사용할 수 있고, 기기가 회전되어서 폭이 높이보다 길 때는 와이드 스크린으로 표시할 수 있게 된다.</p>
+
+<p>방향 정보를 다루는 두 가지 방법의 JavaScript 이벤트가 있다. 첫 번째는 {{domxref("DeviceOrientationEvent")}}로 가속도계가 기기의 방향의 변화를 감지했을 때 발생한다.  이 방향 이벤트들에 의해 보고되는 데이터를 받아서 처리함으로써, 사용자들이 기기를 움직이여서 생기는 방향과 높이의 변화를 상호 작용적으로 응답할 수 있게 된다.</p>
+
+<p>두 번째 이벤트는 {{domxref("DeviceMotionEvent")}}로 가속도에 변화가 일어났을 때 발생한다. 이 이벤트는 {{domxref("DeviceOrientationEvent")}}와는 방향이 아닌 가속도를 감지하고 있다는 점에서 다르다. 일반적으로{{domxref("DeviceMotionEvent")}}를 감지할 수 있는 센서들은 저장 장치들을 충격으로부터 보호하기 위해 노트북에서 사용되는 센서들을 포함한다. {{domxref("DeviceOrientationEvent")}}는 모바일 기기에서 주로 더 많이 나타난다.</p>
+
+<h2 id="방향_이벤트_처리하기">방향 이벤트 처리하기</h2>
+
+<p>방향의 변화를 받기 위해 여러분이 해야하는 것은 {{ event("deviceorientation") }} 이벤트에 리스너를 등록하는 것 뿐이다:</p>
+
+<pre class="brush: js">window.addEventListener("deviceorientation", handleOrientation, true);
+</pre>
+
+<p>이벤트 리스너를 등록한 후에는 (여기에서는 JavaScript 함수 handleOrientation()), 리스너 함수가 업데이트 된 방향 데이터와 함께 주기적으로 호출된다.</p>
+
+<p>방향 이벤트는 다음 네 개의 값을 가진다:</p>
+
+<ul>
+ <li>{{ domxref("DeviceOrientationEvent.absolute") }}</li>
+ <li>{{ domxref("DeviceOrientationEvent.alpha") }}</li>
+ <li>{{ domxref("DeviceOrientationEvent.beta") }}</li>
+ <li>{{ domxref("DeviceOrientationEvent.gamma") }}</li>
+</ul>
+
+<p>이벤트 핸들러 함수는 보통 다음과 같다:</p>
+
+<pre class="brush: js">function handleOrientation(event) {
+  var absolute = event.absolute;
+  var alpha    = event.alpha;
+  var beta     = event.beta;
+  var gamma    = event.gamma;
+
+  // Do stuff with the new orientation data
+}
+</pre>
+
+<h3 id="방향_값_설명">방향 값 설명</h3>
+
+<p>각 축으로부터 보고된 값은 표준 좌표계 축을 중심으로 회전한 양을 가리킨다. 더 자세한 내용은 <a href="/en-US/DOM/Orientation_and_motion_data_explained" title="Orientation and motion data explained">Orientation and motion data explained</a> 문서에 나와있으며, 다음은 이를 간략하게 요약한 것이다.</p>
+
+<ul>
+ <li>{{ domxref("DeviceOrientationEvent.alpha") }} 값은 0도부터 360도까지 범위의 z축을 중심으로 한 기기의 움직임을 나타낸다.</li>
+ <li>{{ domxref("DeviceOrientationEvent.beta") }} 값은 -180도부터 180도까지 범위의 x축을 줌심으로 한 기기의 움직임을 나타낸다. 이는 기기의 앞뒤 움직임을 나타낸다.</li>
+ <li>{{ domxref("DeviceOrientationEvent.gamma") }} 값은 -90도부터 90도까지 범위의 y축을 중심으로 한 기기의 움직임을 나타낸다. 이는 기기의 좌우 움직임을 나타낸다.</li>
+</ul>
+
+<h3 id="방향_예제">방향 예제</h3>
+
+<p>이 예제는 {{event("deviceorientation")}} 이벤트를 지원하고 방향을 감지할 수 있는 기기에서 실행중인 모든 브라우저에서 작동한다.</p>
+
+<p>자 그럼, 정원에 공이 하나 있다고 상상해보자:</p>
+
+<pre class="brush: html">&lt;div class="garden"&gt;
+  &lt;div class="ball"&gt;&lt;/div&gt;
+&lt;/div&gt;
+
+&lt;pre class="output"&gt;&lt;/pre&gt;
+</pre>
+
+<p>이 정원은 가로 세로 200 픽셀이고(그렇다, 작은 정원이다), 정 중앙에 공이 있다:</p>
+
+<pre class="brush: css">.garden {
+  position: relative;
+  width : 200px;
+  height: 200px;
+  border: 5px solid #CCC;
+  border-radius: 10px;
+}
+
+.ball {
+  position: absolute;
+  top   : 90px;
+  left  : 90px;
+  width : 20px;
+  height: 20px;
+  background: green;
+  border-radius: 100%;
+}
+</pre>
+
+<p>이제, 우리가 기기를 움직이면 공도 따라서 움직일 것이다:</p>
+
+<pre class="brush: js">var ball   = document.querySelector('.ball');
+var garden = document.querySelector('.garden');
+var output = document.querySelector('.output');
+
+var maxX = garden.clientWidth  - ball.clientWidth;
+var maxY = garden.clientHeight - ball.clientHeight;
+
+function handleOrientation(event) {
+  var x = event.beta;  // In degree in the range [-180,180]
+  var y = event.gamma; // In degree in the range [-90,90]
+
+  output.innerHTML  = "beta : " + x + "\n";
+  output.innerHTML += "gamma: " + y + "\n";
+
+  // Because we don't want to have the device upside down
+  // We constrain the x value to the range [-90,90]
+  if (x &gt;  90) { x =  90};
+  if (x &lt; -90) { x = -90};
+
+  // To make computation easier we shift the range of
+  // x and y to [0,180]
+  x += 90;
+  y += 90;
+
+  // 10 is half the size of the ball
+  // It center the positionning point to the center of the ball
+  ball.style.top  = (maxX*x/180 - 10) + "px";
+  ball.style.left = (maxY*y/180 - 10) + "px";
+}
+
+window.addEventListener('deviceorientation', handleOrientation);
+</pre>
+
+<p>여기 실제로 실행해 볼 수 있는 예제이다:</p>
+
+<div>{{ EmbedLiveSample('Orientation_example', '230', '260') }}</div>
+
+<div class="warning">
+<p><strong>경고:</strong> Chrome과 Firefox는 동일한 방식으로 각을 다루지 않습니다. 그래서 어떤 축의 방향은 반대가 됩니다.</p>
+</div>
+
+<h2 id="모션_이벤트_처리하기">모션 이벤트 처리하기</h2>
+
+<p>모션 이벤트는 이벤트 이름이 {{ event("devicemotion") }}으로 다르다는 점을 제외하면, 방향 이벤트를 처리하는 방법과 동일하다.</p>
+
+<pre class="brush: js">window.addEventListener("devicemotion", <em>handleMotion</em>, true);</pre>
+
+<p><em>HandleMotion</em> 함수의 파라미터로 넘겨진 {{ domxref("DeviceMotionEvent") }} 객체에 실제로 변화된 정보들이 담겨져 있다.</p>
+
+<p>모션 이벤트는 다음 네 가지 속성을 가진다:</p>
+
+<ul>
+ <li>{{ domxref("DeviceMotionEvent.acceleration") }}</li>
+ <li>{{ domxref("DeviceMotionEvent.accelerationIncludingGravity") }}</li>
+ <li>{{ domxref("DeviceMotionEvent.rotationRate") }}</li>
+ <li>{{ domxref("DeviceMotionEvent.interval") }}</li>
+</ul>
+
+<h3 id="모션_값_설명">모션 값 설명</h3>
+
+<p>{{ domxref("DeviceMotionEvent") }} 객체는 웹 개발자들에게 기기의 위치와 방향의 변화 속도에 관한 정보를 제공한다. 세 개의 축에 따라 변화한 정보가 제공된다 (자세한 내용은 <a href="/en-US/docs/Web/Guide/DOM/Events/Orientation_and_motion_data_explained" title="/en-US/docs/Web/Guide/DOM/Events/Orientation_and_motion_data_explained">Orientation and motion data explained</a> 문서를 참조).</p>
+
+<p>{{domxref("DeviceMotionEvent.acceleration","acceleration")}}과 {{domxref("DeviceMotionEvent.accelerationIncludingGravity","accelerationIncludingGravity")}}에서, 각 축은 다음에 해당된다:</p>
+
+<ul>
+ <li><code>x</code>: 서쪽에서 동쪽으로 나타나는 축을 의미한다</li>
+ <li><code>y</code>: 남쪽에서 북쪽으로 나타나는 축을 의미한다</li>
+ <li><code>z</code>: 땅에서 수직으로 나타나는 축을 의미한다</li>
+</ul>
+
+<p>{{domxref("DeviceMotionEvent.rotationRate","rotationRate")}}에서, 조금은 다르게, 각 값들은 다음에 해당된다:</p>
+
+<ul>
+ <li><code>alpha</code>: 화면(또는 데스크탑의 키보드)에 수직인 축을 따른 회전율을 의미한다</li>
+ <li><code>beta</code>: 화면(또는 데스크탑의 키보드)의 평면의 왼쪽에서 오른쪽으로 나타나는 축을 따른 회전율을 의미한다</li>
+ <li><code>gamma</code>: 화면(또는 데스크탑의 키보드)의 평면의 아래에서 위쪽으로 나타나는 축을 따른 회전율을 의미한다</li>
+</ul>
+
+<p>마지막으로, {{domxref("DeviceMotionEvent.interval","interval")}}은 기기에서 데이터를 얻을 수 있는 시간 간격(단위는 밀리초)을 의미한다.</p>
+
+<h2 id="스펙">스펙</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('Device Orientation')}}</td>
+   <td>{{Spec2('Device Orientation')}}</td>
+   <td>Initial specification.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="브라우저_호환성">브라우저 호환성</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>{{domxref("DeviceOrientationEvent")}}</td>
+   <td>7.0</td>
+   <td>3.6<sup>[1]</sup><br>
+    6</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("DeviceMotionEvent")}}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>6</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>{{domxref("DeviceOrientationEvent")}}</td>
+   <td>3.0</td>
+   <td>3.6<sup>[1]</sup><br>
+    6</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>4.2</td>
+  </tr>
+  <tr>
+   <td>{{domxref("DeviceMotionEvent")}}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>6</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td><span style="font-size: 12px; line-height: 18px;">4.2</span></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h3 id="Gecko_구현_참고_사항">Gecko 구현 참고 사항</h3>
+
+<ol>
+ <li>Firefox 3.6, 4, 5는 표준인 {{domxref("DeviceOrientationEvent")}} 이벤트가 아닌 <a href="/en-US/DOM/MozOrientation" title="MozOrientation">mozOrientation </a>을 지원한다</li>
+</ol>
+
+<h2 id="참고_자료">참고 자료</h2>
+
+<ul>
+ <li>{{domxref("DeviceOrientationEvent")}}</li>
+ <li>{{domxref("DeviceMotionEvent")}}</li>
+ <li>The legacy <code><a href="/en-US/DOM/MozOrientation" title="en-US/DOM/MozOrientation">MozOrientation</a></code> event.</li>
+ <li><a href="/en-US/docs/Web/Guide/DOM/Events/Orientation_and_motion_data_explained" title="Orientation and motion data explained">Orientation and motion data explained</a></li>
+ <li><a href="/en-US/docs/Web/Guide/DOM/Events/Using_device_orientation_with_3D_transforms" title="Using Deviceorientation In 3D Transforms">Using deviceorientation in 3D Transforms</a></li>
+</ul>
diff --git a/files/ko/webapi/idle/index.html b/files/ko/webapi/idle/index.html
new file mode 100644
index 0000000000..eeb10abccf
--- /dev/null
+++ b/files/ko/webapi/idle/index.html
@@ -0,0 +1,66 @@
+---
+title: Idle API
+slug: WebAPI/Idle
+translation_of: Archive/B2G_OS/API/Idle_API
+---
+<div>
+  {{non-standard_header}} {{B2GOnlyHeader2('certified')}}</div>
+<h2 id="Summary">Summary</h2>
+<p>Idle API 는 사용자가 유휴상태(idle) 상태가 되었음을 앱에 알려주는데 사용됩니다.</p>
+<p>이것은 사용자가 자신의 디바이스에 아무것도 하지 않을 때에 앱이 동작을 취할 수 있게 해줍니다. 가장 많이 사용하는 경우는 배터리를 아끼기 위한 것으로 이 경우 보통 <a href="/en-US/docs/WebAPI/Power_Management">Power Management API</a> 와 함께 사용됩니다.</p>
+<h2 id="유휴_상태의_사용자_관찰하기">유휴 상태의 사용자 관찰하기</h2>
+<p>시스템이 유휴상태일 때 어플리케이션으로 부터 알림을 받기 위해서는 <strong>idle observer</strong>에 꼭 등록을 하여야 한다. idle observer는 세가지 특성을 가지고 있는 오브젝트이다:</p>
+<ul>
+  <li><code>time</code>은 사용자의 마지막 동작 이후부터 유휴 상태라고 여길때까지의 시간(초)을 정의한다.</li>
+  <li><code>onidle</code>은 사용자가 유휴 상태라고 여겨질 때 함수를 호출한다.</li>
+  <li><code>onactive</code>는 사용자가 유휴 상태였다가 활성화 되었을 때 함수를 호출한다.</li>
+</ul>
+<h3 id="예제_사용자가_반응이_없을때_화면을_어둡게_하기">예제: 사용자가 반응이 없을때 화면을 어둡게 하기</h3>
+<p>이 예제에서, 10초 동안 사용자의 반응이 없을 때 유휴 관찰자(=idle observer)는 화면을 50% 밝기로 어둡게 한다 그리고 다시 사용자의 반응이 나타나면 100% 밝기로 돌려 놓는다. 두번째 유휴 관찰자 는 15초 동안 사용자 반응이 없을때 화면을 꺼 버린다.</p>
+<pre class="brush: js">// NOTE: mozPower is part of the Power Management API
+
+var fadeLight = {
+  time: 10, // Ten seconds
+
+  onidle: function () {
+    // The user does not seem active, let's dim the screen down
+    navigator.mozPower.screenBrightness = 0.5;
+  },
+
+  onactive: function () {
+    // Ok, the user is back, let's brighten the screen up
+    navigator.mozPower.screenBrightness = 1;
+  }
+}
+
+var screenOff = {
+  time: 15, // fifteen seconds
+
+  onidle: function () {
+    // Ok, the user had his chance but he's really idle, let's turn the screen off
+    navigator.mozPower.screenEnabled = false;
+  },
+
+  onactive: function () {
+    // Ok, the user is back, let's turn the screen on
+    navigator.mozPower.screenEnabled = true;
+  }
+}
+
+// Register the idle observers
+
+navigator.addIdleObserver(fadeLight);
+navigator.addIdleObserver(screenOff);
+</pre>
+<p>이 코드에는 <code>fadeLight</code> 와 <code>screenOff 라는 두 유휴 관찰자를 정의한뒤</code>, <span style="line-height: inherit;">시스템에 등록하기 위하여 각각 </span><span style="line-height: inherit;">{{domxref("window.navigator.addIdleObserver","navigator.addIdleObserver()")}} 를 한번씩 호출한다. 어플리케이션은 필요한 만큼에 유휴 관찰자를 등록할 수 있다.</span></p>
+<p>만약 어플리케이션에서 사용자의 반응이 없어지는지 더이상 관찰이 필요 없는 경우, 아래 예제 코드의 예처럼 유휴 관찰자를{{domxref("window.navigator.removeIdleObserver","navigator.removeIdleObserver()")}} 메서드를 통해 제거할 수 있다.</p>
+<pre class="brush:js">navigator.removeIdleObserver(fadeLight);
+navigator.removeIdleObserver(screenOff);
+</pre>
+<h2 id="Specification">Specification</h2>
+<p>Not part of any specification yet; however, this API will be discussed at W3C as part of the <a href="http://www.w3.org/2012/sysapps/" rel="external">System Applications Working Group</a>.</p>
+<h2 id="See_also">See also</h2>
+<ul>
+  <li>{{domxref("window.navigator.addIdleObserver","navigator.addIdleObserver()")}}</li>
+  <li>{{domxref("window.navigator.removeIdleObserver","navigator.removeIdleObserver()")}}</li>
+</ul>
diff --git a/files/ko/webapi/index.html b/files/ko/webapi/index.html
new file mode 100644
index 0000000000..bdc56dcb49
--- /dev/null
+++ b/files/ko/webapi/index.html
@@ -0,0 +1,138 @@
+---
+title: WebAPI
+slug: WebAPI
+tags:
+  - Apps
+  - DOM
+  - Firefox OS
+  - Mobile
+  - NeedsTranslation
+  - TopicStub
+translation_of: Web/API
+---
+<p><strong>WebAPI</strong>는 웹 앱과 웹 콘텐츠가 기기의 하드웨어에 접근(배터리 상태나 기기의 진동 하드웨어 등)하고 기기의 데이터 저장소에 접근(달력이나 주소록 목록 등)할 수 있도록 해주는 기기 호환과 접근 API의 모음을 나타내는 단어입니다. 이러한 API를 추가함으로써 오늘날 웹이 할 수 있는 일과 과거에 특정 플랫폼에서만 가능했던 일들이 확장되기를 희망합니다.</p>
+
+<div class="note">
+<p><strong>Note:</strong> More of this documentation has been written than it looks like; links are not all added yet. We're actively working on improving this and expect to see things much better over the next couple of weeks. See the <a href="/ko/docs/WebAPI/Doc_status" title="WebAPI/Doc_status">WebAPI doc status page</a>, where we're tracking work on WebAPI docs.</p>
+</div>
+
+<div class="row topicpage-table">
+<div class="section">
+<h2 class="Documentation" id="Communication_APIs" name="Communication_APIs">Communication APIs</h2>
+
+<dl>
+ <dt><a href="/ko/docs/WebAPI/Network_Information" title="WebAPI/Network_Information">Network Information API</a></dt>
+ <dd>현재 네트워크 연결에 대한 연결 속도와 같은 기본 정보를 알려줍니다.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/ko/docs/WebAPI/WebBluetooth" title="WebAPI/WebBluetooth">Bluetooth</a></dt>
+ <dd>WebBluetooth API는 기기의 Bluetooth에 로우레벨 접근을 할 수 있게 해 줍니다.</dd>
+ <dt><a href="/ko/docs/WebAPI/Mobile_Connection" title="WebAPI/Mobile_Connection">Mobile Connection API</a> {{NonStandardBadge}}</dt>
+ <dd>Exposes information about the device's cellular connectivity, such as signal strength, operator information, and so forth.</dd>
+ <dt><a href="/ko/docs/WebAPI/Network_Stats" title="WebAPI/Network_Stats">Network Stats API</a></dt>
+ <dd>Monitors data usage and exposes this data to privileged applications.</dd>
+ <dt><a href="/ko/docs/WebAPI/WebTelephony" title="WebAPI/WebTelephony">Telephony</a> {{NonStandardBadge}}</dt>
+ <dd>Lets apps place and answer phone calls and use the built-in telephony user interface.</dd>
+ <dt><a href="/ko/docs/WebAPI/WebSMS" title="WebAPI/WebSMS">WebSMS </a>{{NonStandardBadge}}</dt>
+ <dd>앱들이 SMS 문자 메시지를 주고 받게 하고, 장치에 저장된 메시지들을 접근하고 관리 하도록 해줍니다.</dd>
+ <dt><a href="/ko/docs/WebAPI/WiFi_Information" title="WebAPI/WiFi_Information">WiFi Information API</a> {{NonStandardBadge}}</dt>
+ <dd>A privileged API which provides information about signal strength, the name of the current network, available WiFi networks, and so forth.</dd>
+</dl>
+
+<h2 class="Documentation" id="Hardware_access_APIs" name="Hardware_access_APIs">Hardware access APIs</h2>
+
+<dl>
+ <dt><a href="/ko/docs/WebAPI/Using_Light_Events">Ambient Light Sensor API</a></dt>
+ <dd>광센서에 접근할 수 있게 해서 앱이 기기 주변의 밝기를 감지할 수 있게 해 줍니다.</dd>
+ <dt><a href="/ko/docs/WebAPI/Battery_Status" title="WebAPI/Battery_Status">Battery Status API</a></dt>
+ <dd>배터리의 충전 정보 및 현재 기기가 충전 중인지 여부에 대한 정보를 제공 합니다.</dd>
+ <dt><a href="/ko/docs/WebAPI/Using_geolocation" title="Using_geolocation">Geolocation API</a></dt>
+ <dd>Provides information about the device's physical location.</dd>
+ <dt><a href="/ko/docs/WebAPI/Pointer_Lock" title="API/Pointer_Lock_API">Pointer Lock API</a></dt>
+ <dd>Lets apps lock access to the mouse and gain access to movement deltas rather than absolute coordinates; this is great for gaming.</dd>
+ <dt><a href="/ko/docs/WebAPI/Proximity" title="WebAPI/Proximity">Proximity API</a></dt>
+ <dd>Lets you detect proximity of the device to a nearby object, such as the user's face.</dd>
+ <dt><a href="/ko/docs/WebAPI/Detecting_device_orientation" title="WebAPI/Detecting_device_orientation">Device Orientation API</a></dt>
+ <dd>기기의 방향 변화를 감지하여 알려줍니다.</dd>
+ <dt><a href="/ko/docs/WebAPI/Managing_screen_orientation" title="WebAPI/Detecting_device_orientation">Screen Orientation API</a></dt>
+ <dd>화면의 방향 변화를 감지하여 알려줍니다. 앱이 어떤 방향을 선호하는지 지정하는데에도 사용 할 수 있습니다.</dd>
+ <dt><a href="/ko/docs/WebAPI/Vibration" title="WebAPI/WebBluetooth">Vibration API</a></dt>
+ <dd>Lets apps control the device's vibration hardware for things such as haptic feedback in games. This is <strong>not</strong> intended for things such as notification vibrations. See the <a href="/ko/docs/WebAPI/Alarm" title="WebAPI/Alarm">Alarm API</a> for that.</dd>
+ <dt><a href="/ko/docs/WebAPI/Camera" title="WebAPI/Camera">Camera API</a> {{NonStandardBadge}}</dt>
+ <dd>Allows apps to take photographs and/or record video using the device's built-in camera.</dd>
+ <dt><a href="/ko/docs/WebAPI/Power_Management" title="WebAPI/Power_Management">Power Management API </a>{{NonStandardBadge}}</dt>
+ <dd>Lets apps turn on and off the screen, CPU, device power, and so forth. Also provides support for listening for and inspecting resource lock events.</dd>
+</dl>
+
+<p><span class="alllinks"><a href="/ko/docs/tag/WebAPI" title="tag/CSS">View All...</a></span></p>
+</div>
+
+<div class="section">
+<h2 class="Documentation" id="Data_management_APIs" name="Data_management_APIs">Data management APIs</h2>
+
+<dl>
+</dl>
+
+<dl>
+ <dt><a href="/ko/docs/WebAPI/FileHandle_API" title="WebAPI/FileHandle_API">FileHandle API</a></dt>
+ <dd>Provides support for writable files with locking support.</dd>
+ <dt><a href="/ko/docs/IndexedDB" title="IndexedDB">IndexedDB</a></dt>
+ <dd>고성능 검색을 지원하는 클라이언트측의 구조화된 데이터 저장소입니다.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/ko/docs/WebAPI/Settings" title="WebAPI/Settings">Settings API</a> {{NonStandardBadge}}</dt>
+ <dd>Lets apps examine and change system-wide configuration options that are permanently stored on the device.</dd>
+</dl>
+
+<h2 class="Documentation" id="Other_APIs" name="Other_APIs">Other APIs</h2>
+
+<dl>
+ <dt><a href="/ko/docs/WebAPI/Alarm" title="WebAPI/Alarm">Alarm API</a></dt>
+ <dd>Lets apps schedule notifications. Also provides support for automatically launching an app at a specific time.</dd>
+ <dt><a href="/ko/docs/WebAPI/Simple_Push" title="WebAPI/Push_Notifications">Simple Push API</a></dt>
+ <dd>Lets the platform send notification messages to specific applications.</dd>
+ <dt><a href="/ko/docs/WebAPI/Using_Web_Notifications" title="/ko/docs/WebAPI/Using_Web_Notifications">Web Notifications</a></dt>
+ <dd>Lets applications send notifications displayed at the system level.</dd>
+ <dt><a href="/ko/docs/Apps" title="Apps">Apps API</a> {{NonStandardBadge}}</dt>
+ <dd>The Open WebApps API provides support for installing and managing Web apps. In addition, support is provided to let apps determine payment information.</dd>
+ <dt><a href="/ko/docs/WebAPI/Web_Activities" title="WebAPI/Web_Activities">Web Activities</a> {{NonStandardBadge}}</dt>
+ <dd>Lets an app delegate an activity to another app; for example, an app might ask another app to select (or create) and return a photo. Typically the user is able to configure what apps are used for which activities.</dd>
+ <dt><a href="/ko/docs/Apps/Publishing/In-app_payments" title="Apps/Publishing/In-app_payments">WebPayment API</a> {{NonStandardBadge}}</dt>
+ <dd>Lets Web content initiate payments and refunds for virtual goods.</dd>
+ <dt><a href="/ko/docs/DOM/Using_the_Browser_API" title="DOM/Using_the_Browser_API"><strong>Browser API</strong></a> {{NonStandardBadge}}</dt>
+ <dd>Provides support for building a Web browser completely using Web technologies (in essence, a browser within a browser).</dd>
+</dl>
+
+<dl>
+ <dt><a href="/ko/docs/WebAPI/Idle" title="WebAPI/Device_Storage_API">Idle API</a></dt>
+ <dd>Lets apps receive notifications when the user is not actively using the device.</dd>
+ <dt><a href="/ko/docs/WebAPI/Permissions" title="WebAPI/Permissions">Permissions API</a> {{NonStandardBadge}}</dt>
+ <dd>Manages app permissions in a centralized location. Used by the Settings app.</dd>
+ <dt><a href="/ko/docs/WebAPI/Time_and_Clock" title="WebAPI/Time_and_Clock">Time/Clock API</a> {{NonStandardBadge}}</dt>
+ <dd>현재 시각을 설정할 수 있게 해 줍니다. 시간대는 <a href="/ko/docs/WebAPI/Settings" title="WebAPI/Settings">Settings API</a>를 이용해서 설정할 수 있습니다.</dd>
+</dl>
+
+<h2 class="Community" id="Community" name="Community">WebAPI community</h2>
+
+<p>If you need help with these APIs, there are several ways you can talk to other developers making use of them.</p>
+
+<ul>
+ <li>Consult the WebAPI forum: {{DiscussionList("dev-webapi", "mozilla.dev.webapi")}}</li>
+ <li>Visit the WebAPI IRC channel: <a href="irc://irc.mozilla.org/webapi" title="irc://irc.mozilla.org/webapi">#webapi</a></li>
+</ul>
+
+<p><span class="alllinks"><a href="http://www.catb.org/~esr/faqs/smart-questions.html" title="http://www.catb.org/~esr/faqs/smart-questions.html">Don't forget about the <em>netiquette</em>...</a></span></p>
+
+<h2 class="Related_Topics" id="Related_Topics" name="Related_Topics">Related Topics</h2>
+
+<ul>
+ <li>The <a href="/ko/docs/Document_Object_Model_(DOM)" title="Document Object Model (DOM)">Document Object Model (DOM)</a> is the representation of an HTML document as a tree.</li>
+ <li><a href="/ko/docs/JavaScript" title="JavaScript">JavaScript</a> - Scripting language for the Web.</li>
+ <li><a href="/ko/docs/WebAPI/Doc_status" title="WebAPI/Doc_status">Doc status</a>: A list of WebAPI topics and their documentation status.</li>
+</ul>
+</div>
+</div>
+
+<p> </p>
diff --git a/files/ko/webapi/managing_screen_orientation/index.html b/files/ko/webapi/managing_screen_orientation/index.html
new file mode 100644
index 0000000000..934384d0bf
--- /dev/null
+++ b/files/ko/webapi/managing_screen_orientation/index.html
@@ -0,0 +1,136 @@
+---
+title: Managing screen orientation
+slug: WebAPI/Managing_screen_orientation
+translation_of: Web/API/CSS_Object_Model/Managing_screen_orientation
+---
+<p>{{SeeCompatTable}}</p>
+<h2 id="Summary">Summary</h2>
+<p>Screen orientation 은 <a href="/en-US/docs/WebAPI/Detecting_device_orientation" title="/en-US/docs/WebAPI/Detecting_device_orientation">device orientation</a> 과는 조금 다르다. 비록 장치가 방향을 감지 못하더라도 화면은 언제나 방향을 가지고 있다. 그리고 만약 장치가 방향을 알 수 있더라도 웹 어플리케이션의 인터페이스를 유지하거나 적응하기 위해 화면의 방향을 조정하는 능력을 갖는게 좋다.</p>
+<p>화면의 방향을 다루기 위한 여러 방법이 있는데, CSS 와 JavaScript 이다. 첫 번째는 <a href="/en-US/docs/CSS/Media_queries#orientation" title="en-US/CSS/Media queries#orientation">orientation media query</a> 이다. 이것은 내용이 CSS를 사용해서 레이아웃을 조정하게 하는데,  브라우저 창이 가로 모드 (너비가 높이보다 큼) 또는 세로모드 (높이가 너비보다 큼) 여부에 달려 있다.</p>
+<p>두번째 방법은 JavaScript Screen orientation API 인데 이것은 화면의 현재 방향을 구하고 잠그는데 사용할 수 있다.</p>
+<h2 id="Adjusting_layout_based_on_the_orientation">Adjusting layout based on the orientation</h2>
+<p>방향 변환에서 가장 흔한 케이스 중 하나는 장치의 방향에 따라 내용의 레이아웃을 조정 하는 것이다. 예를 들자면, 당신은 버튼바를 장치 화면의 가장 긴 크기로 펼치고 싶어 할 수 있는데, media query를 이용해서 쉽고 자동으로 할 수 있다.</p>
+<p>다음의 HTML code 예제를 보자</p>
+<pre class="brush: html">&lt;ul id="toolbar"&gt;
+  &lt;li&gt;A&lt;/li&gt;
+  &lt;li&gt;B&lt;/li&gt;
+  &lt;li&gt;C&lt;/li&gt;
+&lt;/ul&gt;
+
+&lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis lacinia nisi nec sem viverra vitae fringilla nulla ultricies. In ac est dolor, quis tincidunt leo. Cras commodo quam non tortor consectetur eget rutrum dolor ultricies. Ut interdum tristique dapibus. Nullam quis malesuada est.&lt;/p&gt;
+</pre>
+<p>CSS 는 화면 방향에 따라 <span style="line-height: inherit;">특정 스타일을 을 </span><span style="line-height: inherit;">다루기 위해 orientation media query 에 의존한다</span></p>
+<pre class="brush: css">/* First let's define some common styles */
+
+html, body {
+  width : 100%;
+  height: 100%;
+}
+
+body {
+  border: 1px solid black;
+
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+p {
+  font   : 1em sans-serif;
+  margin : 0;
+  padding: .5em;
+}
+
+ul {
+  list-style: none;
+
+  font   : 1em monospace;
+  margin : 0;
+  padding: .5em;
+
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+
+  background: black;
+}
+
+li {
+  display: inline-block;
+  margin : 0;
+  padding: 0.5em;
+  background: white;
+}
+</pre>
+<p>Once we have some common styles we can start defining a special case for the orientation</p>
+<pre class="brush: css">/* For portrait, we want the tool bar on top */
+
+@media screen and (orientation: portrait) {
+  #toolbar {
+    width: 100%;
+  }
+}
+
+/* For landscape, we want the tool bar stick on the left */
+
+@media screen and (orientation: landscape) {
+  #toolbar {
+    position: fixed;
+    width: 2.65em;
+    height: 100%;
+  }
+
+  p {
+    margin-left: 2em;
+  }
+
+  li + li {
+    margin-top: .5em;
+  }
+}
+</pre>
+<p>실행 결과를 보자</p>
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Portrait</th>
+   <th scope="col">Landscape</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{ EmbedLiveSample('Adjusting_layout_based_on_the_orientation', 180, 350) }}</td>
+   <td>{{ EmbedLiveSample('Adjusting_layout_based_on_the_orientation', 350, 180) }}</td>
+  </tr>
+ </tbody>
+</table>
+<div class="note">
+ <p><strong>Note:</strong> orientation media query 는 실제로 브라우저 창 (또는 iframe) 의 방향에 따라 적용한다. 장치의 방향이 아니다.</p>
+</div>
+<h2 id="Locking_the_screen_orientation">Locking the screen orientation</h2>
+<div class="warning">
+ <p><strong>Warning:</strong> 이 API 는 실험적이며 현재 <a href="/en-US/docs/Mozilla/Firefox_OS" title="/en-US/docs/Mozilla/Firefox_OS">Firefox OS</a> 와 <a href="/en-US/docs/Mozilla/Firefox_for_Android" title="/en-US/docs/Mozilla/Firefox_for_Android">Firefox for Android</a> 에서 <code>moz</code> 접두사를 이용하여 사용할 수 있다.</p>
+</div>
+<p>몇몇 장치들은 (주로 모바일 장치) 사용자가 언제나 화면을 읽을 수 있게 장치의 방향에 따라 동적으로 화면의 방향을 변화시킬 수 있다. 만약 이러한 행위가 텍스트 컨텐츠에 적합하다면, 이러한 변화 때문에 고통 받을 수 있는 켄텐츠도 있다. 예를 들어, 장치의 방향에 따른 게임들은 이러한 방향전환 때문에 혼란스러울 수 있다.</p>
+<p>Screen Orientation API 는 정확히 그러한 변화를 방지하기 위해 만들어졌다.</p>
+<h3 id="Listening_orientation_change">Listening orientation change</h3>
+<p>{{event("orientationchange")}} 이벤트는 장치가 화면의 방향을 변환할 때와 <span style="line-height: inherit;">방향이  {{domxref("window.screen.orientation","screen.orientation")}} 속성과 함께 읽혀질 때 </span><span style="line-height: inherit;">마다 불려 진다.  </span></p>
+<pre class="brush: js">screen.addEventListener("orientationchange", function () {
+  console.log("The orientation of the screen is: " + screen.orientation);
+});
+</pre>
+<h3 id="Preventing_orientation_change">Preventing orientation change</h3>
+<p>모든 웹 어플리케이션은 필요에 따라 스크린을 잠굴 수 있다. 화면은 {{domxref("window.screen.lockOrientation","screen.lockOrientation()")}} 함수를 사용하여 잠그고 {{domxref("window.screen.unlockOrientation","screen.unlockOrientation()")}}. 함수로 잠금 해제 한다.</p>
+<p>{{domxref("window.screen.lockOrientation","screen.lockOrientation()")}} 는 적용 할 잠금의 종류를 정의하는 문자열 <span style="line-height: inherit;"> (또는 일련의 문자열) </span><span style="line-height: inherit;">을 수용한다. 수용하는 값들: </span><code style="font-size: 14px; line-height: inherit;">portrait-primary</code><span style="line-height: inherit;">, </span><code style="font-size: 14px; line-height: inherit;">portrait-secondary</code><span style="line-height: inherit;">, </span><code style="font-size: 14px; line-height: inherit;">landscape-primary</code><span style="line-height: inherit;">, </span><code style="font-size: 14px; line-height: inherit;">landscape-secondary</code><span style="line-height: inherit;">, </span><code style="font-size: 14px; line-height: inherit;">portrait</code><span style="line-height: inherit;">, </span><code style="font-size: 14px; line-height: inherit;">landscape</code><span style="line-height: inherit;"> (각각의 값들에 대해 좀 더 알려면  {{domxref("window.screen.lockOrientation","lockOrientation")}}  를 보라).</span></p>
+<pre class="brush: js">screen.lockOrientation('landscape');</pre>
+<div class="note">
+ <p><strong>Note:</strong> 화면 잠금은 웹 어플리케이션에 따라 다르다. 어플레케이션 A이 가로모드로 잠겨 있고 어플레케이션 B가 세로모드로 잠겨 있을 때, 어플리케이션을 A 에서 B 로 또는 B 에서 A 로 전환하면 {{event("orientationchange")}} 를 호출하지 않는다. 왜냐하면 각 어플리케이션은 각자의 방향을 유지 하기 때문이다.</p>
+ <p>그러나, 만약 잠금요구를 만족하기 위해 방향이 바뀌어야한다면 화면잠금은 {{event("orientationchange")}} 이벤트를 호출 할 수 있다.</p>
+</div>
+<h2 id="See_also">See also</h2>
+<ul>
+ <li>{{domxref("window.screen.orientation","screen.orientation")}}</li>
+ <li>{{domxref("window.screen.lockOrientation()","screen.lockOrientation()")}}</li>
+ <li>{{domxref("window.screen.unlockOrientation()","screen.unlockOrientation()")}}</li>
+ <li>{{domxref("window.screen.onorientationchange","screen.onorientationchange")}}</li>
+ <li><a href="/en-US/docs/CSS/Media_queries#orientation" title="en-US/CSS/Media queries#orientation">The orientation media query</a></li>
+ <li><a class="external" href="http://hacks.mozilla.org/2009/06/media-queries/" title="http://hacks.mozilla.org/2009/06/media-queries/">A short introduction to media queries in Firefox 3.5</a></li>
+</ul>
diff --git a/files/ko/webapi/network_information/index.html b/files/ko/webapi/network_information/index.html
new file mode 100644
index 0000000000..9526bd2d5f
--- /dev/null
+++ b/files/ko/webapi/network_information/index.html
@@ -0,0 +1,46 @@
+---
+title: Network Information API
+slug: WebAPI/Network_Information
+translation_of: Web/API/Network_Information_API
+---
+<p>{{ SeeCompatTable() }}</p>
+<p>네트워크 정보 API는 사용자 기기의 현재 대역폭이나 과금이 되는 연결인지와 같은 시스템의 연결 정보를 알려줍니다. 이를 이용해서 사용자에게 높은 용량의 콘텐츠를 제공할지 낮은 용량의 콘텐츠를 제공할지 사용자의 연결 상태에 따라서 제공할 수 있습니다. 전체 API는 DOM에 추가된 단일한 객체로 구성되어 있습니다: {{domxref("window.navigator.connection")}}.</p>
+<h2 id="연결상태_변경_감지">연결상태 변경 감지</h2>
+<p>이 예제는 사용자의 연결상태 변화를 감시합니다. 사용자가 비싼 망에서 싼 망으로 이동할 때 사용자가 추가적인 비용을 지불하지 않게 하기 위해서 전송량을 감소시키는 등과 같은 행동을 할 수 있게 앱이 경고를 하는 일과 비슷합니다.</p>
+<pre class="brush: js">var connection = navigator.connection || navigator.mozConnection || navigator.webkitConnection;
+
+function updateConnectionStatus() {
+  alert("Connection bandwidth: " + connection.bandwidth + " MB/s");
+  if (connection.metered) {
+    alert("The connection is metered!");
+  }
+}
+
+connection.addEventListener("change", updateConnectionStatus);
+updateConnectionStatus();
+</pre>
+<h2 id="Specifications" name="Specifications">명세</h2>
+<table class="standard-table">
+  <thead>
+    <tr>
+      <th scope="col">Specification</th>
+      <th scope="col">Status</th>
+      <th scope="col">Comment</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td>{{ SpecName('Network Information', '', 'Network Information API') }}</td>
+      <td>{{ Spec2('Network Information') }}</td>
+      <td>Initial specification</td>
+    </tr>
+  </tbody>
+</table>
+<h2 id="브라우저_호환성">브라우저 호환성</h2>
+<p>{{Page('/en-US/docs/Web/API/window.navigator.connection','Browser compatibility')}}</p>
+<h2 id="관련_내용">관련 내용</h2>
+<ul>
+  <li>{{ spec("http://dvcs.w3.org/hg/dap/raw-file/tip/network-api/Overview.html", "Network Information API Specification", "ED") }}</li>
+  <li><a href="/en/Online_and_offline_events" title="en/Online_and_offline_events">Online and offline events</a></li>
+  <li>{{domxref("window.navigator.connection")}}</li>
+</ul>
diff --git a/files/ko/webapi/power_management/index.html b/files/ko/webapi/power_management/index.html
new file mode 100644
index 0000000000..b96447b466
--- /dev/null
+++ b/files/ko/webapi/power_management/index.html
@@ -0,0 +1,102 @@
+---
+title: Power Management
+slug: WebAPI/Power_Management
+translation_of: Archive/B2G_OS/API/Power_Management_API
+---
+<p>{{ non-standard_header() }}</p>
+<p>{{ B2GOnlyHeader2('certified') }}</p>
+<h2 id="요약">요약</h2>
+<p>전력 관리 API는 기기의 전력 소모를 관리하는 도구를 제공합니다.</p>
+<h2 id="전력_관리">전력 관리</h2>
+<p>전력 관리는 과도한 연산이나 화면을 다시그리는 등과 같은 실제 전력과는 조금 다릅니다. 이 모든 것이 다 전력 관리에 들어가게 됩니다. 하지만 전력 관리 API는 직접적인 전력 소모(화면, CPU 등)에 보다 집중합니다. 전력 관리에 대한 주요 인터페이스는 {{domxref("PowerManager")}} 인터페이스의 인스턴스인 {{domxref("window.navigator.mozPower","navigator.mozPower")}}를 통해서 접근합니다.</p>
+<h3 id="기본_전력_처리">기본 전력 처리</h3>
+<p>{{domxref("PowerManager")}} 인터페이스는 기본 전력 처리 인터페이스를 제공합니다.</p>
+<h4 id="전역_전력_처리">전역 전력 처리</h4>
+<p>{{domxref("PowerManager.powerOff()","powerOff()")}} 메서드를 사용해서 아주 쉽게 기기의 전원을 끌 수 있고 {{domxref("PowerManager.reboot()","reboot()")}} 메서드를 통해서는 재부팅도 할 수 있습니다.</p>
+<pre class="brush: js">navigator.mozPower.powerOff();</pre>
+<h4 id="화면_전력_처리">화면 전력 처리</h4>
+<p>화면은 읽기/쓰기 속성인 {{domxref("PowerManager.screenEnabled","screenEnabled")}}를 이용해서 켜고 끌 수 있습니다. 또한 화면의 밝기도 변경할 수 있습니다. 읽기/쓰기 속성인 {{domxref("PowerManager.screenBrightness","screenBrightness")}}를 이용해서 변경할 수 있고 0(아주 어두움)에서 1(최대 밝기)까지의 값을 이용해서 화면의 백라이트 밝기를 설정할 수 있습니다.</p>
+<pre class="brush: js">// It doesn't make sense to change the brightness if the screen is off
+if (navigator.mozPower.screenEnabled) {
+  navigator.mozPower.screenBrightness = 0.5;
+}</pre>
+<h4 id="CPU_전력_처리">CPU 전력 처리</h4>
+<p>CPU를 직접 끄는 일은 가능하지 않지만 화면이 꺼져 있을 때에는 CPU가 꺼져도 되는지 아닌지를 알릴 수 있습니다. 이는 {{domxref("PowerManager.cpuSleepAllowed","cpuSleepAllowed")}}를 이용해서 설정할 수 있습니다. 이는 기기의 CPU가 화면이 꺼지거나(<code>true</code>) 켜져 있을(<code>false</code>) 때 잠자기 모드로 들어갈 수 있는지를 결정합니다; 화면이 켜져있다면 정지모드로 들어가지 않게 합니다.</p>
+<h3 id="향상된_전력_처리">향상된 전력 처리</h3>
+<p>전력 관리는 전력을 다루는 어플리케이션이 다른 어플리케이션의 요청에 대해 알림을 받을 수 있다면 더 잘 다뤄질 수 있습니다. 예를 들어서 사용자가 동영상을 보고 있다면 몇 초 후에 화면을 자동으로 끄지 않는 것이 더 좋을 수 있습니다.</p>
+<h4 id="잠금_해제_요청">잠금 해제 요청</h4>
+<p>어떤 어플리케이션이든 잠금 해체를 요청할 수 있습니다. 잠금 해제는 기기의 자원이 꺼지지 않도록 요청하는 방법입니다. 잠금 해체는 {{domxref("window.navigator.requestWakeLock","navigator.requestWakeLock()")}} 메서드를 통해서 요청됩니다.</p>
+<p>잠금 해제는 다양한 이유로 사용할 수 없게 되는 특정 자원에 대한 요청입니다. 예를 들어서 모바일 기기의 전력 관리 기능은 전력 소모를 줄이기 위해서 어느정도 사용을 안하고 있으면 화면을 끕니다. 그 자원을 사용하는 어플리케이션은 자원이 꺼지기 전에 자원의 잠금 상태를 확인합니다. 예를 들어서 페이지는 화면 보호기가 나타나거나 화면이 꺼지는 것을 막기 위해서 <code>screen</code>에 대한 잠금을 막을 수 있습니다.</p>
+<p>기본 설정으로 Firefox OS는 <code>screen</code>과 <code>cpu</code>, <code>wifi</code> 자원에 대한 잠금 허용을 합니다. 하지만 자원을 다루는 어떤 어플리케이션도 자원의 이름을 설정하고 잠금에 대한 정책을 정할 수 있습니다. 예를 들어서 자원 관리 기능은 현재 보이지 않는 어플리케이션이 <code>screen</code>에 대한 설정한 잠금 해제를 무시할 수 있습니다.</p>
+<pre class="brush: js">var lock = navigator.requestWakeLock('screen');</pre>
+<p>{{domxref("window.navigator.requestWakeLock","requestWakeLock")}} 메서드는 잠금을 할 자원의 이름을 나타내는 <code>topic</code> 속성을 가지고 있는 객체를 반환합니다. <code>unlock()</code> 메서드는 잠금을 수동으로 반환하는데 사용합니다. 어플리케이션이 종료(대기 상태가 아닌 실제 종료)된다면 자동으로 모든 잠금 요청이 해제됩니다.</p>
+<h4 id="잠금_해제_다루기">잠금 해제 다루기</h4>
+<p>잠금을 관리할 수 있는 인증된 애플리케이션은 잠금 상태가 변경되게 되면 알림을 받습니다. 실제로 전력을 관리하고자 하는 모든 애플리케이션은 <code>screen</code>과 <code>cpu</code>의 잠금 상태를 추적하고 있어야 합니다. 이는 {{domxref("PowerManager.addWakeLockListener()")}} 메서드를 통해 이루어집니다({{domxref("PowerManager.removeWakeLockListener()","")}} 메서드를 이용해서 잠금 요청에 대한 추적을 멈출 수 있습니다).</p>
+<p>{{domxref("PowerManager.addWakeLockListener()","addWakeLockListener")}} 메서드에는 두개의 파라메터를 전달 받는 콜백함수를 전달해야 합니다: 첫번째 문자열은 다룰 자원(여기서는 <code>screen</code>이나 <code>cpu</code>)을 나타내고 두번째 문자열은 잠금 상태를 나타냅니다.</p>
+<p>잠김은 세가지 상태가 있습니다:</p>
+<dl>
+  <dt>
+    <code>unlocked</code></dt>
+  <dd>
+    주어진 자원에 대해 잠금 해제를 할 수 없습니다.</dd>
+  <dt>
+    <code>locked-foreground</code></dt>
+  <dd>
+    최소한 하나의 어플리케이션이 잠금 해제를 제어 할 수 있고 그 어플리케이션은 보이는 상태입니다..</dd>
+  <dt>
+    <code>locked-background</code></dt>
+  <dd>
+    최소한 하나의 어플리케이션이 잠금 해제를 제어하지만 모든 애플리케이션이 보이지 않는 상태입니다.</dd>
+</dl>
+<pre class="brush: js">// This is used to keep track of the last change on the lock state
+var screenTimeout;
+
+// A reference to the Power Manager
+var power = window.navigator.mozPower;
+
+// Here are the actions to handle based on the lock state
+var powerAction = {
+
+  // If there is no lock at all, we will suspend the device:
+  // * Turn the screen off
+  // * Allow the cpu to shut down
+  unlocked: function suspendDevice() {
+    power.cpuSleepAllowed = true;
+    power.screenEnabled   = false;
+  },
+
+  // If there is a lock but the applications requesting it
+  // are all in the background, we just turn the screen off
+  'locked-background': function shutOffOnlyScreen() {
+    power.cpuSleepAllowed = false;
+    power.screenEnabled   = false;
+  },
+
+  // At last, if there is an active application that requests a lock,
+  // actually there is nothing to do. That's the whole point.
+}
+
+function screenLockListener(topic, state) {
+  // If the lock is not about the screen, there is nothing to do.
+  if ('screen' !== topic) return;
+
+  // Each time the lock changes state, we stop any pending power management operations
+  window.clearTimeout(screenTimeout);
+
+  // If there is an action defined for the given state
+  if (powerAction[state]) {
+    // We delay that action by 3s
+    screenTimeout = window.setTimeout(powerAction[state], 3000);
+  }
+}
+
+// We make sure our power management application is listening for any change on locks.
+power.addWakeLockListener(screenLockListener);</pre>
+<h2 id="Specification" name="Specification">명세</h2>
+<p>관련된 명세가 없습니다.</p>
+<h2 id="관련_내용">관련 내용</h2>
+<ul>
+  <li>{{ domxref("window.navigator.mozPower","navigator.mozPower") }}</li>
+  <li>{{ domxref("PowerManager") }}</li>
+  <li>{{ domxref("window.navigator.requestWakeLock()","navigator.requestWakeLock()") }}</li>
+</ul>
diff --git a/files/ko/webapi/proximity/index.html b/files/ko/webapi/proximity/index.html
new file mode 100644
index 0000000000..ad1687ddd2
--- /dev/null
+++ b/files/ko/webapi/proximity/index.html
@@ -0,0 +1,119 @@
+---
+title: Proximity
+slug: WebAPI/Proximity
+translation_of: Web/API/Proximity_Events
+---
+<p>{{ SeeCompatTable }}</p>
+<h2 id="Summary">Summary</h2>
+<p>근접 이벤트는 사용자가 디바이스에 가까이 갔을때를 알 수 있는 간단한 벙법이다.</p>
+<p>예를 들어,  사용자가 전화가 걸려왔을 때 디바이스에 귀를 가까이 하면, 근접 이벤트들은 스마트폰의 화면이 꺼지게 하여 이러한 변화에 대응할 수 있게 해준다.</p>
+<div class="note">
+  <p><strong>Note:</strong> 당연히 이 API는 근접 센서를 가진 장치를 필요로 하며, 이 근접 센서는 대게 모바일 다비이스들에서만 이용 가능하다. 근접 센서가 없는 장치들에서는 근접 이벤트들을 지원할 수는 있을 지 몰라도 해당 이벤트들은 절대 발생하지 않을 것이다.</p>
+</div>
+<h2 id="Proximity_Events">Proximity Events</h2>
+<p>다비이스 근접 센서가 장치와 대상 사이의 변화를 감지했을 때, 센서는 그  변화를 브라우저에게 알린다. 브라우저는 그 알림을 받으면 그 변화에 대해 {{domxref("DeviceProximityEvent")}} 이벤트를 발생시킨다. 그리고 더 대략적인 변화(more rough change)를 알리기 위해  {{domxref("UserProximityEvent")}} 이벤트를 발생시킨다.</p>
+<p>window object 레벨에서  {{domxref("EventTarget.addEventListener","addEventListener")}} 메소드 ({{event("deviceproximity")}} 또는 {{event("userproximity")}} 이벤트명) 를 이용하여 근접 이벤트를 전달받을 수 있다. 또한 {{domxref("window.ondeviceproximity")}} 또는 {{domxref("window.onuserproximity")}} 프로퍼티에 이벤트 핸들러를 붙이는 방법으로도 이벤트를 전달받을 수 있다.</p>
+<p>일단 이벤트가 전달되면, 그 이벤트 오브젝트는 다음과 같은 여러 종류의 정보에 접근할 수 있게 해준다:</p>
+<ul>
+  <li> {{domxref("DeviceProximityEvent")}} 이벤트는 {{domxref("DeviceProximityEvent.value","value")}} 프로퍼티를 통해 디바이스와 대상 사이의 거리에 정확히 매치되는 값을 제공한다. 또한 이 이벤트는 장치가 감지할 수 있는 가장 가까운 거리, 가장 먼거리에 대한 정보를 {{domxref("DeviceProximityEvent.min","min")}} 와  {{domxref("DeviceProximityEvent.max","max")}} 프로퍼티 값을 통해 제공한다.</li>
+  <li>{{domxref("UserProximityEvent")}} 이벤트는 거리에 대한 대략적인 추정치를 boolean 형태로 제공한다. 대상과 디바이스가 가까운면   {{domxref("UserProximityEvent.near")}} 프로퍼티 값은 true 가 되고, 대상과의 거리가 멀다면 그 값은 false가 된다.</li>
+</ul>
+<h2 id="Example">Example</h2>
+<pre class="brush: js">window.addEventListener('userproximity', function(event) {
+  if (event.near) {
+    // let's power off the screen
+    navigator.mozPower.screenEnabled = false;
+  } else {
+    // Otherwise, let's power on the screen
+    navigator.mozPower.screenEnabled = true;
+  }
+});</pre>
+<h2 id="Specifications" name="Specifications">Specifications</h2>
+<table class="standard-table">
+  <thead>
+    <tr>
+      <th scope="col">Specification</th>
+      <th scope="col">Status</th>
+      <th scope="col">Comment</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td>{{ SpecName('Proximity Events', '', 'Proximity Events') }}</td>
+      <td>{{ Spec2('Proximity Events') }}</td>
+      <td>Initial specification</td>
+    </tr>
+  </tbody>
+</table>
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+<p>{{ CompatibilityTable() }}</p>
+<div id="compat-desktop">
+  <table class="compat-table">
+    <tbody>
+      <tr>
+        <th>Feature</th>
+        <th>Chrome</th>
+        <th>Firefox (Gecko)</th>
+        <th>Internet Explorer</th>
+        <th>Opera</th>
+        <th>Safari</th>
+      </tr>
+      <tr>
+        <td>{{domxref("DeviceProximityEvent")}}</td>
+        <td>{{CompatNo()}}</td>
+        <td>{{CompatVersionUnknown()}}</td>
+        <td>{{CompatNo()}}</td>
+        <td>{{CompatNo()}}</td>
+        <td>{{CompatNo()}}</td>
+      </tr>
+      <tr>
+        <td>{{domxref("UserProximityEvent")}}</td>
+        <td>{{CompatNo()}}</td>
+        <td>{{CompatVersionUnknown()}}</td>
+        <td>{{CompatNo()}}</td>
+        <td>{{CompatNo()}}</td>
+        <td>{{CompatNo()}}</td>
+      </tr>
+    </tbody>
+  </table>
+</div>
+<div id="compat-mobile">
+  <table class="compat-table">
+    <tbody>
+      <tr>
+        <th>Feature</th>
+        <th>Android</th>
+        <th>Chrome for Android</th>
+        <th>Firefox Mobile (Gecko)</th>
+        <th>IE Mobile</th>
+        <th>Opera Mobile</th>
+        <th>Safari Mobile</th>
+      </tr>
+      <tr>
+        <td>{{domxref("DeviceProximityEvent")}}</td>
+        <td>{{CompatNo()}}</td>
+        <td>{{CompatNo()}}</td>
+        <td>{{ CompatGeckoMobile("15.0") }}</td>
+        <td>{{CompatNo()}}</td>
+        <td>{{CompatNo()}}</td>
+        <td>{{CompatNo()}}</td>
+      </tr>
+      <tr>
+        <td>{{domxref("UserProximityEvent")}}</td>
+        <td>{{CompatNo()}}</td>
+        <td>{{CompatNo()}}</td>
+        <td>{{CompatVersionUnknown()}}</td>
+        <td>{{CompatNo()}}</td>
+        <td>{{CompatNo()}}</td>
+        <td>{{CompatNo()}}</td>
+      </tr>
+    </tbody>
+  </table>
+</div>
+<h2 id="See_also">See also</h2>
+<ul>
+  <li>{{domxref("DeviceProximityEvent")}}</li>
+  <li>{{domxref("UserProximityEvent")}}</li>
+  <li>{{event("deviceproximity")}}</li>
+  <li>{{event("userproximity")}}</li>
+</ul>
diff --git a/files/ko/webapi/simple_push/index.html b/files/ko/webapi/simple_push/index.html
new file mode 100644
index 0000000000..0ff0fe3602
--- /dev/null
+++ b/files/ko/webapi/simple_push/index.html
@@ -0,0 +1,92 @@
+---
+title: Simple Push
+slug: WebAPI/Simple_Push
+translation_of: Archive/B2G_OS/API/Simple_Push_API
+---
+<p>{{ draft() }}{{ SeeCompatTable() }}</p>
+<p><a href="https://wiki.mozilla.org/WebAPI/SimplePush" title="https://wiki.mozilla.org/WebAPI/SimplePush">Simple Push API</a>, 다른 이름으로 푸시 알림 API는 알림을 받으면 앱이 깨어나는 기능을 제공한다. 앱은 서버와 공유할 수 있는 URI를 요청할 수 있는데, 다시 말해 앱에 전달될 버전 번호를 보낼 수 있다는 뜻이다. 이 기능은 동기화 메카니즘으로 사용될 수도 있고, 서드 파티 서버에서 최신 데이터를 가져오기 위해 쓸 수도 있다.</p>
+<p>심플푸시 API는 {{domxref("PushManager")}} 객체인 <code>push 속성을 가지고</code> {{domxref("window.navigator")}} 객체를 확장하고, 푸시 상태를 감지하기 위해 받을 수 있는 새 이벤트를 더한다.</p>
+<h2 id="예제">예제</h2>
+<p>이 예제는 푸시의 전체 설정을 다룬다. 다음 단계를 따라하자.</p>
+<ol>
+  <li>앱의 매니페스트 파일에 <code>push</code>를 허용하는 상태로 더한다.</li>
+  <li>endpoint를 요청하기 위해 <code>push.register()</code>를 호출한다.</li>
+  <li>endpoint를 서버에 보낸다.</li>
+  <li>앱 내부의 푸시 알림을 위한 메시지 핸들러를 더한다.</li>
+  <li>서버에서 알림을 보낸다..</li>
+</ol>
+<h3 id="매니페스트_파일_변경">매니페스트 파일 변경</h3>
+<p>매니페스트 파일에서 두 가지를 수정한다.</p>
+<ol>
+  <li><a href="/docs/Web/Apps/Manifest#messages" title="https://developer.mozilla.org/en-US/docs/Web/Apps/Manifest?redirectlocale=en-US&amp;redirectslug=Apps%2FManifest#messages"><code>messages</code> field</a> - <code>push와</code> <code>push-register</code> 메시지를 더한다.</li>
+  <li><a href="/docs/Web/Apps/Manifest#permissions" title="https://developer.mozilla.org/en-US/docs/Web/Apps/Manifest?redirectlocale=en-US&amp;redirectslug=Apps%2FManifest#permissions"><code>permissions</code> field</a> - 푸시 알림을 받기 원하는 앱에 더한다.</li>
+</ol>
+<pre><span class="s2">"messages"</span><span class="o">:</span> <span class="cp">[</span>
+   <span class="p">{</span> <span class="s2">"push"</span><span class="p">:</span> <span class="s2">"/index.html"</span><span class="p">},</span>
+   <span class="p">{</span> <span class="s2">"push-register"</span><span class="p">:</span> <span class="s2">"/index.html"</span><span class="p">}</span>
+<span class="cp">]</span><span class="o">,</span>
+<span class="s2">"permissions"</span><span class="o">:</span> <span class="p">{</span>
+  <span class="s2">"push"</span><span class="o">:</span> <span class="err">{
+    </span>"description": "Required for be updated with new goals in soccer matchs",<span class="err">
+</span><span class="p">  }</span>
+<span class="err">}</span></pre>
+<h3 id="endpoint_요청을_위한_domxref(PushManager.register)_호출">endpoint 요청을 위한 {{domxref("PushManager.register")}} 호출</h3>
+<p>이 코드는 endpoint를 요청할 시간인지 결정할 때 호출해야 한다. 예를 들어 사용자가 로그인 할 때나 축구 경기를 관전하기 시작할 때를 들 수 있다.</p>
+<pre><span class="k">if</span> <span class="p">(</span><span class="nx">navigator</span><span class="p">.</span><span class="nx">push</span><span class="p">)</span> <span class="p">{</span>
+  <span class="kd">var</span> <span class="nx">req</span> <span class="o">=</span> <span class="nx">navigator</span><span class="p">.</span><span class="nx">push</span><span class="p">.</span><span class="nx">register</span><span class="p">();</span>
+
+  <span class="nx">req</span><span class="p">.</span><span class="brush: js">onsuccess</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
+    <span class="kd">var</span> <span class="nx">endpoint</span> <span class="o">=</span> <span class="nx">req</span><span class="p">.</span><span class="nx">result</span><span class="p">;</span>
+      <span class="nx">debug</span><span class="p">(</span><span class="s2">"New endpoint: "</span> <span class="o">+</span> <span class="nx">endpoint</span> <span class="p">);</span>
+    <span class="p">}</span>
+
+   <span class="nx">req</span><span class="p">.</span><span class="nx">onerror</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
+     <span class="nx">debug</span><span class="p">(</span><span class="s2">"Error getting a new endpoint: "</span> <span class="o">+</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">stringify</span><span class="p">(</span><span class="nx">e</span><span class="p">));</span>
+   <span class="p">}</span>
+<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
+  <span class="c1">// No push on the DOM</span>
+<span class="p">}</span></pre>
+<h3 id="endpoint를_서버에_보내기">endpoint를 서버에 보내기</h3>
+<p>endpoint를 갖게 되면, 어플리케이션 서버에 보내야 한다. 한 가지 방법만 있는 건 아닌데, 선호하는 방법으로 할 수 있으므로, 예를 들어 이메일을 보내거나 <code>POST</code>, <code>PUT</code>이나 <code>GET</code> 방식을 사용할 수도 있다. 추천하는 방법은 어플리케이션에서 사용자 데이터와 함께 endpoint를 저장하는 방식으로, 쿠키, 사용자 이름같이 endpoint와 사용자 쌍을 식별하는데 사용할 수 있다면 무엇이든 좋다.</p>
+<p>하지만 서버에 보낸다면, 다음의 좋은 사례를 따르기를 권한다.</p>
+<ol>
+  <li>XMLHttpRequest로 보낸다.</li>
+  <li>항상 HTTPS를 사용한다. 누군가 endpoint를 가로채면, 앱에 알림을 보낼 수 있다.</li>
+  <li>쿠키와 같이, endpoint에 사용자(또는 어플리케이션 설치)와 맞춰볼 수 있는 무언가를 사용한다.</li>
+</ol>
+<h3 id="메시지_핸들러_더하기">메시지 핸들러 더하기</h3>
+<p>endpoint를 설정하면, 앱이 푸시 메시지를 들을 준비가 된다. <code>index.html</code> 파일이나 <code>main.js 스크립트에 등록할 수 있는데</code>, 스크립트만 있다면 특정<code> push-message.html 파일이 될 수도 있다.</code> 이 방식은 <code>push 메시지를 받고 앱이 종료하는 경우 유용한데,</code>HTML/자바스크립트 코드의 작은 부분만 로드한 상태로 앱이 완전히 열릴지 혹은 백그라운드에서 어떤 작업을 할지 결정할 수 있기 때문이다.</p>
+<pre><span class="k">if</span> <span class="p">(</span><span class="nb">window</span><span class="p">.</span><span class="nx">navigator</span><span class="p">.</span><span class="nx">mozSetMessageHandler</span><span class="p">)</span> <span class="p">{</span>
+  <span class="nb">window</span><span class="p">.</span><span class="nx">navigator</span><span class="p">.</span><span class="nx">mozSetMessageHandler</span><span class="p">(</span><span class="s1">'push'</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
+    <span class="nx">debug</span><span class="p">(</span><span class="s1">'My endpoint is '</span> <span class="o">+</span> <span class="nx">e</span><span class="p">.</span><span class="nx">pushEndpoint</span><span class="p">);</span>
+    <span class="nx">debug</span><span class="p">(</span><span class="s1">'My new version is '</span> <span class="o">+</span>  <span class="nx">e</span><span class="p">.</span><span class="nx">version</span><span class="p">);</span>
+    <span class="c1">//Remember that you can handle here if you have more than</span>
+    <span class="c1">//one pushEndpoint</span>
+    <span class="k">if</span> <span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">pushEndpoint</span> <span class="o">===</span> <span class="nx">emailEndpoint</span><span class="p">)</span> <span class="p">{</span>
+      <span class="nx">emailHandler</span><span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">version</span><span class="p">);</span>
+    <span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">pushEndpoint</span> <span class="o">===</span> <span class="nx">imEndpoint</span><span class="p">)</span> <span class="p">{</span>
+      <span class="nx">imHandler</span><span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">version</span><span class="p">);</span>
+    <span class="p">}</span>
+  <span class="p">});</span>
+<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
+  <span class="c1">// No message handler</span>
+<span class="p">}</span></pre>
+<h3 id="알림_보내기">알림 보내기</h3>
+<p>서버에 <code>endpoint</code>를 가지면, 알림을 보내는 작업은 body에 <code>version=&lt;version&gt;</code>를 가지고 endpoint에 <code>HTTP PUT</code> 요청을 보내는 일만큼 쉽다. 다음과 같이 URL을 갖는 endpoint를 가정하자.</p>
+<p><code>https://push.src.openwebdevice.com/v1/notify/abcdef01234567890abcdefabcdef01234567890abcdef</code></p>
+<p>그리고 버전은 5이다.</p>
+<p><code>version=5</code></p>
+<p>컬로 다음 명령을 내리자.</p>
+<p><code>curl -X PUT -d "version=5" https://push.src.openwebdevice.com/v1/notify/abcdef01234567890abcdefabcdef01234567890abcdef</code></p>
+<p>서버가 올바르게 동작하면, <code>200 Status (OK)</code>와 <code>{}</code>인 body를 응답으로 받게 된다. 그렇지 않으면, 오류를 설명하는 유효한 JSON 객체를 받게 된다.</p>
+<p>버전은 정수이고 증가한다는 점을 기억하자. 어플리케이션은 새로운 버전이 서버나 단말기에 저장된 버전보다 낮으면 알림을 <em>받지 않는다</em>.</p>
+<h2 id="Specifications">Specifications</h2>
+<p>{{page("/en-US/docs/Web/API/PushManager","Specifications")}}</p>
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+<p>{{page("/en-US/docs/Web/API/PushManager","Browser_compatibility")}}</p>
+<h2 id="See_also">See also</h2>
+<ul>
+  <li>{{domxref("PushManager")}}</li>
+  <li>{{domxref("window.navigator.push","navigator.push")}}</li>
+  <li><a href="https://github.com/frsela/pushJSlibrary" title="https://github.com/frsela/pushJSlibrary">pushJSLibrary, a push shim for browsers that do not implement the API</a></li>
+</ul>
diff --git a/files/ko/webapi/time_and_clock/index.html b/files/ko/webapi/time_and_clock/index.html
new file mode 100644
index 0000000000..808dbc7ffc
--- /dev/null
+++ b/files/ko/webapi/time_and_clock/index.html
@@ -0,0 +1,29 @@
+---
+title: 시간과 시계
+slug: WebAPI/Time_and_Clock
+translation_of: Archive/B2G_OS/API/Time_and_Clock_API
+---
+<p>{{ non-standard_header() }}</p>
+<p>{{ B2GOnlyHeader2('certified') }}</p>
+<h2 id="요약">요약</h2>
+<p>Time/Clock API로 시스템 시간을 쉽게 바꿀 수 있습니다.</p>
+<h2 id="개요">개요</h2>
+<p><span style="line-height: inherit;">이 API는 {{domxref("window.navigator.mozTime","navigator.mozTime")}} </span><span style="line-height: inherit;">을 통해 리턴되는, {{domxref("MozTimeManager")}} </span><span style="line-height: inherit;">객체를 통해 접근할 수 있습니다. 해당 객체는 하나의 {{domxref("MozTimeManager.set()","set()")}} </span><span style="line-height: inherit;">메서드를 가지고 있습니다.</span></p>
+<p><span style="line-height: inherit;">{{domxref("MozTimeManager.set()","set()")}} 메서드는 시스템 시간을 변경하는데 이용됩니다. 파라미터로는 숫자(=Number) 객체 또는 Date 객체가 사용됩니다. 만약 숫자 객체가 사용된다면 해당 숫자는 UTC 1970년 1월 1일 부터의 밀리초를 의미합니다.</span></p>
+<p>시간이 변경될 때마다 이벤트가 발생하게 됩니다. 이 이벤트는 window 객체에서 {{domxref("EventTarget.addEventListener","addEventListener")}}  메서드 를 통해(이벤트명은  {{event("moztimechange")}}) 처리하거나, 또는 {{domxref("window.onmoztimechange")}} 속성에 이벤트 핸들러를 연결함으로써 처리할 수 있습니다.</p>
+<div class="note">
+  <p><strong>주:</strong> 기기의 시간대는 <a href="https://developer.mozilla.org/en-US/docs/WebAPI/Settings" title="https://developer.mozilla.org/en-US/docs/WebAPI/Settings">Settings API</a>로 바꿔야 합니다.</p>
+</div>
+<h2 id="예시">예시</h2>
+<pre class="brush: js">function setTime(time) {
+  navigator.mozTime.set(time);
+}
+
+window.addEventListener('moztimechange', function () {
+  console.log('시간이 바뀜');
+});
+
+setTime(new Date());
+</pre>
+<h2 id="표준">표준</h2>
+<p>어느 표준에도 들어있지 않음</p>
diff --git a/files/ko/webapi/using_geolocation/index.html b/files/ko/webapi/using_geolocation/index.html
new file mode 100644
index 0000000000..e5f9913376
--- /dev/null
+++ b/files/ko/webapi/using_geolocation/index.html
@@ -0,0 +1,165 @@
+---
+title: Geolocation API 사용하기
+slug: WebAPI/Using_geolocation
+tags:
+  - Geolocation API
+  - Guide
+  - Intermediate
+translation_of: Web/API/Geolocation_API/Using_the_Geolocation_API
+---
+<p>{{securecontext_header}}{{APIRef("Geolocation API")}}<br>
+ <strong>Geolocation API</strong>는 사용자의 현재 위치를 가져오는 API로, 지도에 사용자 위치를 표시하는 등 다양한 용도로 사용할 수 있습니다. 이 안내서는 Geolocation API의 기초적 사용법을 설명합니다.</p>
+
+<h2 id="geolocation_객체"><code>geolocation</code> 객체</h2>
+
+<p><a href="/ko/docs/Web/API/Geolocation_API">Geolocation API</a>는 {{domxref("navigator.geolocation")}} 객체를 통해 사용할 수 있습니다.</p>
+
+<p><code>geolocation</code> 객체가 존재하는 경우 위치 정보 서비스를 지원하는 것입니다. 존재 여부는 다음과 같이 알아낼 수 있습니다.</p>
+
+<pre class="brush: js">if('geolocation' in navigator) {
+  /* 위치정보 사용 가능 */
+} else {
+  /* 위치정보 사용 불가능 */
+}
+</pre>
+
+<h3 id="현재_위치_가져오기">현재 위치 가져오기</h3>
+
+<p>{{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}} 메서드를 호출해서 사용자의 현재 위치를 얻을 수 있습니다. <code>getCurrentPosition()</code>은 사용자의 위치를 탐지하는 비동기 요청을 초기화하고, 위치 관련 하드웨어에 최신 정보를 요청합니다. 위치를 알아낸 후에는 지정한 콜백 함수를 호출합니다. 선택적으로, 이 과정 중 오류가 발생하면 호출할 오류 콜백을 두 번째 매개변수로 지정할 수도 있습니다. 세 번째 매개변수 역시 선택 항목이며, 위치 정보의 최대 수명, 요청의 최대 대기시간, 고정밀 위치정보 여부 등의 옵션을 담은 객체입니다.</p>
+
+<div class="note">
+<p><strong>참고:</strong> {{domxref("Geolocation.getCurrentPosition", "getCurrentPosition()")}}의 기본값에서는 최대한 빠르게 낮은 정밀도의 응답을 반환합니다. 정확하지 않더라도 빠른 정보가 필요한 상황에서 유용합니다. 예를 들어, GPS 기능을 가진 장비는 보정 과정에 수 분이 걸릴 수도 있으므로 IP 위치와 WiFi 등 정확하지 않은 출처에 기반한 위치 정보를 반환할 수 있습니다.</p>
+</div>
+
+<pre class="brush: js">navigator.geolocation.getCurrentPosition((position) =&gt; {
+  doSomething(position.coords.latitude, position.coords.longitude);
+});</pre>
+
+<p>위의 예제는 사용자 위치가 확인되면 <code>doSomething()</code> 함수를 실행합니다.</p>
+
+<h3 id="현재_위치_추적하기">현재 위치 추적하기</h3>
+
+<p>장치가 이동했거나 더 정확한 정보를 사용할 수 있어서 위치 정보가 바뀐 경우 호출할 콜백 함수를 {{domxref("Geolocation.watchPosition","watchPosition()")}} 메서드로 설정할 수 있으며, {{domxref("Geolocation.getCurrentPosition","getCurrentPosition()")}}과 같은 매개변수를 받습니다. 콜백은 계속해서 호출될 수 있으므로, 브라우저가 사용자의 이동 시, 또는 고정밀 위치 기술을 사용할 수 있는 시점에 새로운 위치 정보를 제공할 수 있습니다. <code>getCurrentPosition()</code>과 마찬가지로 선택 사항인 오류 콜백 역시 여러 번 호출할 수 있습니다.</p>
+
+<div class="note">
+<p><strong>참고:</strong> {{domxref("Geolocation.getCurrentPosition", "getCurrentPosition()")}}을 먼저 호출하지 않고도 {{domxref("Geolocation.watchPosition", "watchPosition()")}}을 사용할 수 있습니다.</p>
+</div>
+
+<pre class="brush: js">const watchID = navigator.geolocation.watchPosition((position) =&gt; {
+  doSomething(position.coords.latitude, position.coords.longitude);
+});</pre>
+
+<p>{{domxref("Geolocation.watchPosition","watchPosition()")}} 메서드는 위치 추적 요청의 고유 식별자를 나타내는 숫자값을 반환합니다. 해당 식별자를 {{domxref("Geolocation.clearWatch","clearWatch()")}} 메서드에 전달해서 추적을 종료할 수 있습니다.</p>
+
+<pre class="brush: js">navigator.geolocation.clearWatch(watchID);
+</pre>
+
+<h3 id="응답_미세_조정">응답 미세 조정</h3>
+
+<p>{{domxref("Geolocation.getCurrentPosition","getCurrentPosition()")}}과 {{domxref("Geolocation.watchPosition","watchPosition()")}} 둘 다 성공 콜백, 실패 콜백 외에도 <a href="/ko/docs/Web/API/PositionOptions"><code>PositionOptions</code></a> 객체를 받을 수 있습니다.</p>
+
+<p><code>PositionsOptions</code> 객체를 사용하면 고정밀도 활성화 여부, 위치 정보의 캐시 수명(수명이 끝나기 전까지는 이전에 반환한 위치 정보를 저장해뒀다가, 같은 요청을 또 받을 경우 그대로 반환합니다), 그리고 위치 정보 요청의 응답을 대기할 최대 대기시간을 지정할 수 있습니다.</p>
+
+<p>옵션 객체를 사용한 {{domxref("Geolocation.watchPosition","watchPosition")}}의 호출 예시는 다음과 같습니다.</p>
+
+<pre class="brush: js">function success(position) {
+  doSomething(position.coords.latitude, position.coords.longitude);
+}
+
+function error() {
+  alert('Sorry, no position available.');
+}
+
+const options = {
+  enableHighAccuracy: true,
+  maximumAge: 30000,
+  timeout: 27000
+};
+
+const watchID = navigator.geolocation.watchPosition(success, error, options);</pre>
+
+<h2 id="위치_표현">위치 표현</h2>
+
+<p>사용자의 위치는 {{domxref("GeolocationPosition")}} 객체를 담은 {{domxref("GeolocationCoordinates")}} 객체를 사용하여 표현합니다.</p>
+
+<p><code>GeolocationPosition</code>은 단 두 가지만 가집니다. 하나는 <code>GeolocationCoordinates</code> 인스턴스를 가진 <code>coords</code> 속성이고, 다른 하나는 위치 정보의 기록 시점을 나타내는 {{domxref("DOMTimeStamp")}} 인스턴스입니다.</p>
+
+<p>GeolocationCoordinates 인스턴스는 다수의 속성을 갖지만, 그 중 가장 많이 쓰게 될 항목은 지도의 지점을 가리킬 때 사용할 <code>latitude</code>와 <code>longitude</code>입니다. 따라서 대부분의 <code>Geolocation</code> 성공 콜백은 아래와 같이 꽤 간단한 형태입니다.</p>
+
+<pre class="brush: js">function success(position) {
+  const latitude  = position.coords.latitude;
+  const longitude = position.coords.longitude;
+
+  // Do something with your latitude and longitude
+}</pre>
+
+<p>그러나 <code>GeolocationCoordinates</code> 객체에서 고도, 속도, 장치의 방향, 위경도와 고도의 정확도 등 다른 다양한 정보도 가져올 수 있습니다.</p>
+
+<h2 id="오류_처리">오류 처리</h2>
+
+<p><code>getCurrentPosition()</code> 또는 <code>watchPosition()</code>에 오류 콜백을 제공한 경우, 콜백은 첫 번째 매개변수로 <a href="/ko/docs/Web/API/GeolocationPositionError"><code>GeolocationPositionError</code></a> 객체를 받습니다. 해당 객체는 오류의 유형을 나타내는 <code>code</code> 속성과, 사람이 읽을 수 있는 형태로 오류 코드의 뜻을 설명한 <code>message</code> 속성을 갖습니다.</p>
+
+<p>다음 형태로 사용할 수 있습니다.</p>
+
+<pre class="brush: js">function errorCallback(error) {
+  alert(`ERROR(${error.code}): ${error.message}`);
+};</pre>
+
+<h2 id="예제">예제</h2>
+
+<p>다음 예제는 Geolocation API를 사용해 사용자의 위경도를 가져옵니다. 성공한 경우, 사용자의 위치를 가리키는 <code>openstreetmap.org</code> 링크를 생성해 하이퍼링크에 할당합니다.</p>
+
+<div class="hidden">
+<pre class="brush: css">body {
+  padding: 20px;
+  background-color:#ffffc9
+}
+
+button {
+  margin: .5rem 0;
+}</pre>
+</div>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html">&lt;button id = "find-me"&gt;Show my location&lt;/button&gt;&lt;br/&gt;
+&lt;p id = "status"&gt;&lt;/p&gt;
+&lt;a id = "map-link" target="_blank"&gt;&lt;/a&gt;</pre>
+
+<h3 id="JavaScript">JavaScript</h3>
+
+<pre class="brush: js">function geoFindMe() {
+
+  const status = document.querySelector('#status');
+  const mapLink = document.querySelector('#map-link');
+
+  mapLink.href = '';
+  mapLink.textContent = '';
+
+  function success(position) {
+    const latitude  = position.coords.latitude;
+    const longitude = position.coords.longitude;
+
+    status.textContent = '';
+    mapLink.href = `https://www.openstreetmap.org/#map=18/${latitude}/${longitude}`;
+    mapLink.textContent = `Latitude: ${latitude} °, Longitude: ${longitude} °`;
+  }
+
+  function error() {
+    status.textContent = 'Unable to retrieve your location';
+  }
+
+  if(!navigator.geolocation) {
+    status.textContent = 'Geolocation is not supported by your browser';
+  } else {
+    status.textContent = 'Locating…';
+    navigator.geolocation.getCurrentPosition(success, error);
+  }
+
+}
+
+document.querySelector('#find-me').addEventListener('click', geoFindMe);</pre>
+
+<h3 id="결과">결과</h3>
+
+<p>{{EmbedLiveSample('예제', 350, 150)}}</p>
diff --git a/files/ko/webapi/using_light_events/index.html b/files/ko/webapi/using_light_events/index.html
new file mode 100644
index 0000000000..b033d4f80d
--- /dev/null
+++ b/files/ko/webapi/using_light_events/index.html
@@ -0,0 +1,64 @@
+---
+title: Using Light Events
+slug: WebAPI/Using_Light_Events
+tags:
+  - Ambient Light
+translation_of: Web/API/Ambient_Light_Events
+---
+<div>{{DefaultAPISidebar("Ambient Light Events")}}{{SeeCompatTable}}</div>
+
+<p>주변의 빛을 감지하는 이벤트를 활용해서 웹페이지나 어플리케이션이 주변 빛의 세기를 감지할 수 있습니다. 사용자 인터페이스의 색상 대비나 사진의 노출을 변경하는 용도로 사용할 수 있습니다.</p>
+
+<h2 id="빛_이벤트">빛 이벤트</h2>
+
+<p>기기의 빛 센서가 빛의 변화를 감지하면 브라우저에 변화를 전달합니다. 브라우저가 이러한 알림을 받으면 정확한 빛의 세기를 알려주는 {{domxref("DeviceLightEvent")}} 이벤트를 발생시킵니다.</p>
+
+<p>이 이벤트는 {{domxref("EventTarget.addEventListener","addEventListener")}} 메서드 ({{event("devicelight")}} 이벤트 이름 사용)를 사용하거나 {{domxref("window.ondevicelight")}} 속성에 이벤트 핸들러를 사용함으로서 <code>window</code> 객체 수준에서 캡춰됩니다.</p>
+
+<p>캡춰가 되면 이벤트 객체의 {{domxref("DeviceLightEvent.value")}} 속성을 통해서 럭스(lux) 단위의 빛의 세기를 사용할 수 있습니다.</p>
+
+<h2 id="예제">예제</h2>
+
+<pre class="brush: js">window.addEventListener('devicelight', function(event) {
+  var html = document.getElementsByTagName('html')[0];
+
+  if (event.value &lt; 50) {
+    html.classList.add('darklight');
+    html.classList.remove('brightlight');
+  } else {
+    html.classList.add('brightlight');
+    html.classList.remove('darklight');
+  }
+});</pre>
+
+<h2 id="Specifications" name="Specifications">명세</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{ SpecName('AmbientLight', '', 'Ambient Light Events') }}</td>
+   <td>{{ Spec2('AmbientLight') }}</td>
+   <td>Initial specification</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="브라우저_호환성">브라우저 호환성</h2>
+
+
+
+<p>{{Compat("api.DeviceLightEvent")}}</p>
+
+<h2 id="같이_보기">같이 보기</h2>
+
+<ul>
+ <li>{{domxref("DeviceLightEvent")}}</li>
+ <li>{{event("devicelight")}}</li>
+</ul>
diff --git a/files/ko/webapi/using_web_notifications/index.html b/files/ko/webapi/using_web_notifications/index.html
new file mode 100644
index 0000000000..351361d2af
--- /dev/null
+++ b/files/ko/webapi/using_web_notifications/index.html
@@ -0,0 +1,265 @@
+---
+title: 알림 API 사용하기
+slug: WebAPI/Using_Web_Notifications
+translation_of: Web/API/Notifications_API/Using_the_Notifications_API
+---
+<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p>
+
+<p>웹 페이지나 앱에서 <a href="/ko/docs/Web/API/Notifications_API">알림(Notifications) API</a>를 사용하면 페이지 외부에 표시되는 알림을 보낼 수 있습니다. 이것은 시스템 레벨에서 처리되는 것으로 애플리케이션이 유휴 상태거나 백그라운드에 있더라도 웹 앱이 사용자에게 정보를 보낼 수 있습니다. 이 글에서는 여러분의 앱에서 이 API를 사용하기 위한 기초를 알아봅니다.</p>
+
+<p>일반적으로 시스템 알림은 운영 체계의 표준 알림 메커니즘을 말합니다. 예를 들어 일반적인 데스크톱 시스템이나 모바일 장치의 브로드캐스트 알림을 생각해봅시다.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/10959/android-notification.png" style="display: block; height: 184px; margin: 0px auto; width: 300px;"></p>
+
+<p>물론 시스템 알림 시스템은 플랫폼 및 브라우저에 따라 다양하지만 괜찮습니다. 알림 API는 범용적으로 작성돼서 대부분의 시스템 알림 시스템과 호환됩니다.</p>
+
+<h2 id="예시">예시</h2>
+
+<p>웹 알림의 대표적인 사용 사례는 웹 기반 메일이나 IRC 애플리케이션입니다. 새 메시지가 도착하면 사용자가 다른 애플리케이션으로 다른 일을 하더라도 사용자에게 알릴 필요가 있습니다. 요즘은 <a href="https://slack.com/">Slack</a> 등 이러한 사례를 많이 찾아볼 수 있습니다.</p>
+
+<p>우리는 웹 알림을 사용하는 방법을 좀더 잘 알 수 있도록 실제적인 예시 — 할 일 목록 앱 —를 작성했습니다. 데이터는 로컬에서 <a href="/ko/docs/Web/API/IndexedDB_API">IndexedDB</a>로 저장하고 사용자 알림은 할 일 기한이 됐을 때 시스템 알림을 사용합니다. <a href="https://github.com/mdn/to-do-notifications/tree/gh-pages">할 일 목록 코드를 다운로드하거나</a>, <a href="https://mdn.github.io/to-do-notifications/">앱의 라이브 실행을 보세요</a>.</p>
+
+<h2 id="권한_요청하기">권한 요청하기</h2>
+
+<p><span style="line-height: inherit;">앱이 알림을 보내려면 먼저 사용자가 애플리케이션에 해당 권한을 허용해줘야 합니다. 이는 API가 웹페이지 외부와 상호작용할 때 통상적인  요구 사항입니다. 최소 한번은 사용자가 해당 애플리케이션이 알림을 표시할 수 있는 권한을 허용해줄 필요가 있으며 이로써 사용자는 어떤 앱/사이트가 알림을 보일 수 있는지 제어할 수 있습니다.</span></p>
+
+<p><span style="line-height: inherit;">과거에 푸시 알림에 대한 악용 때문에 웹 브라우저와 개발자는 그런 문제를 완화할 수 있는 전략을 구현하게 되었습니다. 알림을 발생시키려면 사용자 제스처(예: 단추 클릭)에 대한 응답으로만 가능합니다. 이것은 모범적인 방식일 뿐 아니라 </span>— 사용자에게 미동의 알림으로 스팸을 보내면 안됩니다 — 실제로도 전향적인 브라우저는 사용자 제스처에 대한 응답으로 촉발되지 않은 알림은 명시적으로 불허합니다. 파이어폭스는 이미 72 버전부터 이렇게 하고 있으며 사파리도 하고 있습니다.</p>
+
+<p>또한 크롬과 파이어폭스에서는 사이트가 보안 콘텍스트(즉, HTTPS)가 아니면 알림을 아예 요청할 수 없으며 크로스 오리진 {{htmlelement("iframe")}}으로부터의 알림 권한은 요청할 수 없게 되었습니다. </p>
+
+<h3 id="현재_권한_상태_확인하기">현재 권한 상태 확인하기</h3>
+
+<p><span style="line-height: inherit;">권한을 이미 가지고 있는지 확인하려면 </span>{{domxref("Notification.permission")}} 읽기 전용 속성의 값을 확인하면 됩니다. 다음 세 가지 값이 있을 수 있습니다.</p>
+
+<dl>
+ <dt><code>default</code></dt>
+ <dd>사용자에게 아직 권한을 요구하지 않았으며 따라서 알림을 표시하지 않습니다.</dd>
+ <dt><code>granted</code></dt>
+ <dd>사용자에게 알림 표시 권한을 요구했으며 사용자는 권한을 허용했습니다.</dd>
+ <dt><code>denied</code></dt>
+ <dd>사용자가 명시적으로 알림 표시 권한을 거부했습니다.</dd>
+</dl>
+
+<h3 id="권한_획득하기">권한 획득하기</h3>
+
+<p>아직 알림 표시 권한이 허용되지 않았다면 애플리케이션은 {{domxref("Notification.requestPermission()")}} 메서드를 사용하여 사용자에게 권한을 요청할 필요가 있습니다. 간단하게는 아래와 같이 넣습니다.</p>
+
+<pre>Notification.requestPermission().then(function(result) {
+  console.log(result);
+});</pre>
+
+<p>여기서는 프로미스 방식의 메서드 버전을 사용합니다. 과거 버전을 지원하려면 아래와 같이 과거의 콜백 버전을 사용해야 할 수 있습니다.</p>
+
+<pre>Notification.requestPermission();</pre>
+
+<p>콜백 버전은 콜백 함수를 옵셔널하게 받을 수 있으며 사용자가 표시 권한 요청에 응답한 후에 호출됩니다.</p>
+
+<h3 id="예시_2">예시</h3>
+
+<p>우리가 만드는 할 일 데모에서는 "알림 허용" 단추를 둬서 누르면 앱의 알림 권한을 요청합니다.</p>
+
+<pre>&lt;button id="enable"&gt;알림 허용&lt;/button&gt;</pre>
+
+<p>누르면 다음 <code>askNotificationPermission()</code> 함수를 호출합니다.</p>
+
+<pre>function askNotificationPermission() {
+  // 권한을 실제로 요구하는 함수
+  function handlePermission(permission) {
+    // 사용자의 응답에 관계 없이 크롬이 정보를 저장할 수 있도록 함
+    if(!('permission' in Notification)) {
+      Notification.permission = permission;
+    }
+
+    // 사용자 응답에 따라 단추를 보이거나 숨기도록 설정
+    if(Notification.permission === 'denied' || Notification.permission === 'default') {
+      notificationBtn.style.display = 'block';
+    } else {
+      notificationBtn.style.display = 'none';
+    }
+  }
+
+  // 브라우저가 알림을 지원하는지 확인
+  if (!('Notification' in window)) {
+    console.log("이 브라우저는 알림을 지원하지 않습니다.");
+  } else {
+    if(checkNotificationPromise()) {
+      Notification.requestPermission()
+      .then((permission) =&gt; {
+        handlePermission(permission);
+      })
+    } else {
+      Notification.requestPermission(function(permission) {
+        handlePermission(permission);
+      });
+    }
+  }
+}</pre>
+
+<p>두 번째 메인 블록을 먼저 보면 알림이 지원되는지 확인하는 것을 알 수 있습니다. 지원하는 경우 그에 따라 <code>Notification.requestPermission()</code>의 프로미스 기반 버전이 지원되는지 보는 확인을 실행합니다. 맞다면 프로미스 기반 버전을 실행하고(사파리 외에는 전부 지원됨) 아니라면 과거의 콜백 기반 버전을 실행합니다(사파리에서 지원).</p>
+
+<p>코드 중복을 피하기 위해 뒷 처리 수행 코드를 <code>handlePermission()</code> 함수에 넣었는데 이 함수가 코드에서 첫 번째 메인 블록입니다. 그 안에서는 <code>Notification.permission</code> 값을 명시적으로 설정하고(크롬의 일부 과거 버전에서는 이게 자동으로 안됩니다) 사용자가 권한 대화창에서 선택한 결과에 따라 단추를 보이거나 숨깁니다. 권한이 이미 허용됐는지 보여주려는 것은 아니고 사용자가 권한을 거부한 경우 나중에 다시 선택할 수 있도록 해주는 것입니다.</p>
+
+<p><strong>참고:</strong> 크롬 37 버전 전에는 <code>load</code> 이벤트 핸들러에서 {{domxref("Notification.requestPermission()")}}을 호출할 수 없었습니다(<a href="https://code.google.com/p/chromium/issues/detail?id=274284" title="https://code.google.com/p/chromium/issues/detail?id=274284">이슈 274284</a> 참고).</p>
+
+<h3 id="requestPermission_프로미스_기능_알아내기">requestPermission() 프로미스 기능 알아내기</h3>
+
+<p>위에서 우리는 브라우저가 <code>Notification.requestPermission()</code>의 프로미스 버전을 지원하는지 확인해야 한다고 했습니다. 아래와 같이 했습니다.</p>
+
+<pre>function checkNotificationPromise() {
+    try {
+      Notification.requestPermission().then();
+    } catch(e) {
+      return false;
+    }
+
+    return true;
+  }</pre>
+
+<p>기본적으로 <code>requestPermission()</code>에 <code>.then()</code> 메서드가 있는지 알아보는 것입니다. 맞다면 계속 진행하고 <code>true</code>를 반환합니다. 실패라면 <code>catch() {}</code> 블록에서 <code>false</code>를 반환합니다.</p>
+
+<h2 id="알림_만들기">알림 만들기 </h2>
+
+<p>알림 만들기는 쉬워서 {{domxref("Notification")}} 생성자만 사용하면 됩니다. 이 생성자는 알림에 표시할 제목과 {{domxref("Notification.icon","icon")}}이나 텍스트 {{domxref("Notification.body","body")}} 같은 알림 조작 옵션 몇 가지를 받도록 돼 있습니다.</p>
+
+<p>예를 들어 할일 목록 예시에서 아래 코드로 필요시 알림을 만듭니다(<code>createNotification()</code> 함수에서 찾을 수 있음).</p>
+
+<pre>var img = '/to-do-notifications/img/icon-128.png';
+var text = '아! "' + title + '" 작업 기한이 만료됐습니다.';
+var notification = new Notification('할 일 목록', { body: text, icon: img });
+</pre>
+
+<h2 id="알림_닫기">알림 닫기</h2>
+
+<p>파이어폭스와 사파리는 알림을 자동으로 금방(약 4초) 닫습니다. 이것은 운영 체계 수준에서도 발생합니다. 그런데 크롬 같은 다른 브라우저는 그렇지 않습니다. 모든 브라우저에서 알림이 닫히게 하려면 {{domxref("WindowTimers.setTimeout","setTimeout()")}} 함수에서 {{domxref("Notification.close")}} 함수를 호출하여 알림을 4초 후에 닫으면 됩니다. <code><a href="/ko/docs/Web/JavaScript/Reference/Global_Objects/Function/bind">bind()</a></code>를 사용하여 <code>close()</code> 호출이 알림에 연동되게 하는 것도 해줘야 합니다.</p>
+
+<pre>setTimeout(notification.close.bind(notification), 4000);</pre>
+
+<div class="note">
+<p><strong>참고</strong>: "close" 이벤트를 받았을 때 알림을 닫은 것이 사용자인지는 보장할 수 없습니다. 이것은 규격과도 일치합니다. 규격에서는 "알림이 닫힐 때 그것이 기반 알림 플랫폼에 의한 것이든지 사용자에 의한 것이든지 닫기 절차가 실행돼야 한다."고 기술하고 있습니다.</p>
+</div>
+
+<h2 id="알림_이벤트">알림 이벤트</h2>
+
+<p><span style="line-height: inherit;">{{domxref("Notification")}} 인스턴스에 촉발되는 이벤트는 다음 네 가지입니다.</span></p>
+
+<dl>
+ <dt><code>click</code></dt>
+ <dd>사용자가 알림을 클릭하면 촉발됩니다.</dd>
+ <dt><code>close</code></dt>
+ <dd>알림이 닫힌 후 촉발됩니다.</dd>
+ <dt><code>error</code></dt>
+ <dd>알림에 문제가 있을 경우 촉발되며 대개 어떤 이유에 의해 알림을 표시할 수 없는 경우입니다.</dd>
+ <dt><code>show</code></dt>
+ <dd>알림이 사용자에게 표시되면 촉발됩니다.</dd>
+</dl>
+
+<p>이 이벤트들은 {{domxref("Notification.onclick","onclick")}}, {{domxref("Notification.onclose","onclose")}}, {{domxref("Notification.onerror","onerror")}}, {{domxref("Notification.onshow","onshow")}} 핸들러로 추적할 수 있습니다. <span style="line-height: inherit;">{{domxref("Notification")}}이 {{domxref("EventTarget")}}을 상속하기 때문에 </span>{{domxref("EventTarget.addEventListener","addEventListener()")}} 메서드를 사용할 수 있습니다.</p>
+
+<h2 id="기존_알림_대체하기">기존 알림 대체하기</h2>
+
+<p>사용자가 잠깐 사이에 알림을 많이 받는 것은 바람직하지 않습니다. 예를 들어 메신저 애플리케이션이 모든 수신 메시지를 사용자에게 알리는데 그게 아주 많다면요? 사용자가 알림 때문에 대량 스팸을 받지 않도록 알림 대기열(큐)을 수정해서 걸려 있는 알림 하나나 여럿을 새로운 알림 하나로 대체할 수 있습니다.</p>
+
+<p>이를 위해 새 알림에 태그를 붙일 수 있습니다. 알림에 이미 같은 태그가 있고 표시되지 않았다면 새 알림으로 이전 알림을 대체하는 것입니다. 같은 태그의 알림이 이미 표시됐다면 이전 알림을 닫고 새 알림을 표시합니다.</p>
+
+<h3 id="태그_예시">태그 예시</h3>
+
+<p>다음과 같은 간단한 HTML을 봅시다.</p>
+
+<pre class="brush: html">&lt;button&gt;알림 실행!&lt;/button&gt;</pre>
+
+<p>다수의 알림을 아래 방법으로 처리할 수 있습니다.</p>
+
+<pre class="brush: js">window.addEventListener('load', function () {
+  // 처음에는 알림 권한이 있는지 확인함
+  // 없으면 권한 요구
+  if (Notification &amp;&amp; Notification.permission !== "granted") {
+    Notification.requestPermission(function (status) {
+      if (Notification.permission !== status) {
+        Notification.permission = status;
+      }
+    });
+  }
+
+  var button = document.getElementsByTagName('button')[0];
+
+  button.addEventListener('click', function () {
+    // 사용자가 알림을 받는 데 동의한 경우
+    // 알림 10개를 보내본다
+    if (Notification &amp;&amp; Notification.permission === "granted") {
+      var i = 0;
+      // 어떤 브라우저(파이어폭스 등)는 일정 시간 동안 알림이 너무 많은 경우 차단하기 때문에 인터벌 사용.
+      var interval = window.setInterval(function () {
+        // 태그 덕분에 "안녕! 9" 알림만 보여야 함
+        var n = new Notification("안녕! " + i, {tag: '알림너무많음'});
+        if (i++ == 9) {
+          window.clearInterval(interval);
+        }
+      }, 200);
+    }
+
+    // 사용자가 알림을 받을지 말지 답하지 않은 경우
+    // 참고: 크롬 때문에 권한 속성이 설정됐는지 알 수 없으므로
+    // "기본" 값을 확인하는 것은 안전하지 않음
+    else if (Notification &amp;&amp; Notification.permission !== "denied") {
+      Notification.requestPermission(function (status) {
+        // 사용자가 ok한 경우
+        if (status === "granted") {
+          var i = 0;
+          // 어떤 브라우저(파이어폭스 등)는 일정 시간 동안 알림이 너무 많은 경우 차단하기 때문에 인터벌 사용.
+          var interval = window.setInterval(function () {
+            // 태그 덕분에 "안녕! 9" 알림만 보여야 함
+            var n = new Notification("안녕! " + i, {tag: '알림너무많음'});
+            if (i++ == 9) {
+              window.clearInterval(interval);
+            }
+          }, 200);
+        }
+
+        // 그 외의 경우 일반적인 모달 alert로 폴백
+        else {
+          alert("안녕!");
+        }
+      });
+    }
+
+    // 사용자가 알림을 거부한 경우
+    else {
+      // 일반적인 모달 alert로 폴백
+      alert("안녕!");
+    }
+  });
+});</pre>
+
+<p>라이브 결과는 아래에서 보세요.</p>
+
+<p>{{ EmbedLiveSample('Tag_example', '100%', 30) }}</p>
+
+<h2 id="규격">규격</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">규격</th>
+   <th scope="col">상태</th>
+   <th scope="col">비고</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('Web Notifications')}}</td>
+   <td>{{Spec2('Web Notifications')}}</td>
+   <td>현행 표준</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="브라우저_호환성">브라우저 호환성</h2>
+
+<p>{{page("/en-US/Web/API/Notification","Browser compatibility")}}</p>
+
+<h2 id="참고">참고</h2>
+
+<ul>
+ <li><a href="/ko/Apps/Build/User_notifications">사용자 알림 편람</a></li>
+ <li>{{ domxref("Notification") }}</li>
+</ul>
diff --git a/files/ko/webapi/webfm_api/index.html b/files/ko/webapi/webfm_api/index.html
new file mode 100644
index 0000000000..4dcda50760
--- /dev/null
+++ b/files/ko/webapi/webfm_api/index.html
@@ -0,0 +1,132 @@
+---
+title: WebFM API
+slug: WebAPI/WebFM_API
+translation_of: Archive/B2G_OS/API/WebFM_API
+---
+<p>{{ non-standard_header() }}</p>
+<p>{{ B2GOnlyHeader2('installed') }}</p>
+<h2 id="요약">요약</h2>
+<p>WebFM API를 이용하면 FM 라디오를 사용할 수 있습니다. 라디오를 켜고, 끄거나 라디오 방송국을 변경 할 수 있습니다. {{domxref("FMRadio")}} 객체의 {{domxref("window.navigator.mozFMRadio","navigator.mozFMRadio")}} 속성을 통해 사용할 수 있습니다.</p>
+<h2 id="라디오_켜기끄기">라디오 켜기/끄기</h2>
+<p>기본적으로 {{domxref("FMRadio.enable()")}} 메소드로 라디오를 켜고, {{domxref("FMRadio.disable()")}} 메소드로 라디오를 끌 수 있습니다.</p>
+<p>라디오를 켜기 전에 안테나 사용 가능 여부를 체크하는 것이 좋습니다(안테나가 없으면 내장된 라디오가 신호를 받을 수 없습니다). {{domxref("FMRadio.antennaAvailable")}} 속성으로 안테나 사용 가능 여부를 확인할 수 있습니다. 모바일 기기에서는 헤드폰 케이블이 안테나 역할을 하는데, 헤드폰 케이블 연결 상태에 따라 안테나 사용 여부가 변경되면 {{event("antennaavailablechange")}} 이벤트가 발생됩니다.<br>
+  <br>
+  라디오를 켜기 위해서 주파수 번호(MHz 단위)를 {{domxref("FMRadio.enable()")}} 메소드에 넘겨 실행합니다.</p>
+<pre class="brush: js">// The frequency of the radio station
+// to listen express in MHz
+var frequency = 99.1;
+var radio = navigator.mozFMRadio;
+
+if (radio.antennaAvailable) {
+  radio.enable(frenquency);
+} else {
+  alert("You need to plug your headphone");
+}
+
+radio.addEventListener('antennaavailablechange', function () {
+  if (radio.antennaAvailable) {
+    radio.enable(frenquency);
+  } else {
+    radio.disable();
+  }
+})
+</pre>
+<div class="note">
+  <p><strong>Note:</strong> The audio is output through the <code>normal</code> audio channel available on the device.</p>
+</div>
+<h2 id="주파수_변경하기">주파수 변경하기</h2>
+<p>주파수는 직접 또는 자동으로 변경할 수 있습니다. 현재 내장 라디오의 주파수는 {{domxref("FMRadio.frequency")}} 속성으로 알 수 있으며 해당 속성 값은 MHz 단위의 숫자로 표현합니다.</p>
+<h3 id="직접_변경하기">직접 변경하기</h3>
+<p>{{domxref("FMRadio.setFrequency()")}} 메소드는 새로운 주파수를 할당할 때 사용합니다. 설정할 수 있는 주파수는 제한적입니다. 메소드 호출 후 성공 또는 실패 상황을 제어하는 {{domxref("DOMRequest")}} 객체를 반환합니다. 주파수는 다음의 요구사항을 만족해야 합니다.:</p>
+<ul>
+  <li>주파수는 {{domxref("FMRadio.frequencyLowerBound")}}와 {{domxref("FMRadio.frequencyUpperBound")}}에 정의된 범위 내에 있어야 합니다. 이 범위를 벗어나면 에러가 반환됩니다.</li>
+  <li>주파수는 {{domxref("FMRadio.channelWidth")}}에 정의된 값만큼 이동해야 합니다. 그렇지 않으면 주파수는 반올림됩니다. 예를 들어 100MHz가 정상적인 주파수이고 {{domxref("FMRadio.channelWidth","channelWidth")}}가 0.2로 설정된 경우, 100.15 주파수로 설정하더라도 주파수는 100.2로 할당됩니다.</li>
+</ul>
+<pre class="brush: js">var change = radio.setFrequency(frequency);
+
+change.onerror = function () {
+  var min = radio.frequencyLowerBound;
+  var max = radio.frequencyUpperBound;
+  console.warn('The frequency must be within the range [' + min + ',' + max + ']');
+}
+
+change.onsuccess = function () {
+  console.log('The frequency has been set to ' + radio.frequency);
+}
+</pre>
+<h3 id="자동으로_찾기">자동으로 찾기</h3>
+<p>WebFM API를 사용하면 편리하게 라디오 채널을 검색할 수 있습니다. {{domxref("FMRadio.seekUp()")}}(현재 주파수보다 높은 채널 찾기) {{domxref("FMRadio.seekDown()")}} 메소드를 사용합니다. 현재 주파수보다 높거나, 낮은 주파수의 라디오 채널을 찾을 때 사용합니다. 이 메소드들은 호출 후에 성공/실패를 제어할 수 있는 {{domxref("DOMRequest")}} 객체를 반환합니다.<br>
+  <br>
+  이 메소드들은 {{domxref("FMRadio.frequencyLowerBound","frequencyLowerBound")}}나 {{domxref("FMRadio.frequencyUpperBound","frequencyUpperBound")}} 값에 도달할 때까지 반복적으로 더 높거나, 낮은 주파수를 찾습니다. 새로운 라디오 채널을 찾으면 {{event("frequencychange")}} 이벤트가 발생되고 현재 주파수로 변경됩니다.<br>
+  <br>
+  동시에 두 메소드를 실행할 수 없으며(동시에 상위/하위 채널을 찾을 수 없습니다) 동시에 실행할 경우 에러가 반환됩니다. 더 이상 찾을 필요가 없을 때 {{domxref("FMRadio.cancelSeek()")}} 메소드를 호출합니다. 이 메소드 역시 {{domxref("DOMRequest")}} 객체를 반환합니다.</p>
+<pre class="brush: js">var radio   = navigator.mozFMRadio;
+var seeking = false;
+var UP      = document.querySelector("button.up");
+var DOWN    = document.querySelector("button.down");
+
+// When the frequency change, the seek
+// functions automatically stop to seek.
+radio.onfrequencychange = function () {
+  seeking = false;
+}
+
+function seek(direction) {
+  var cancel, search;
+
+  // If the radio is already seeking
+  // we will cancel the current search.
+  if (seeking) {
+    var cancel = radio.cancelSeek();
+    cancel.onsuccess = function () {
+      seeking = false;
+
+      // Once the radio no longer seek,
+      // we can try to seek as expected
+      seek(direction);
+    }
+
+  // Let's seek up
+  } else if (direction === 'up') {
+    // Just to be sure that the radio is turned on
+    if (!radio.enabled) {
+      radio.enable(radio.frequencyLowerBound);
+    }
+    search = radio.seekUp();
+
+  // Let's seek up
+  } else if (direction === 'down' {
+    // Just to be sure that the radio is turned on
+    if (!radio.enabled) {
+      radio.enable(radio.frequencyUpperBound);
+    }
+    search = radio.seekDown();
+  }
+
+  if (search) {
+    search.onsuccess = function () {
+      // Ok, we are seeking now.
+      seeking = true;
+    };
+    search.onerror = function () {
+      // Something goes wrong... ok, let's try again.
+      seek(direction);
+    }
+  }
+}
+
+UP.addEventListener('click', function () {
+  seek('up');
+});
+
+DOWN.addEventListener('click', function () {
+  seek('down');
+});
+</pre>
+<h2 id="표준">표준</h2>
+<p>Not part of any specification.</p>
+<h2 id="참고자료">참고자료</h2>
+<ul>
+  <li>{{domxref("FMRadio")}}</li>
+  <li><a href="https://github.com/mozilla-b2g/gaia/tree/master/apps/fm" title="https://github.com/mozilla-b2g/gaia/tree/master/apps/fm">The FM app on Gaïa</a></li>
+</ul>
diff --git a/files/ko/webapi/websms/index.html b/files/ko/webapi/websms/index.html
new file mode 100644
index 0000000000..9f91f8ff00
--- /dev/null
+++ b/files/ko/webapi/websms/index.html
@@ -0,0 +1,85 @@
+---
+title: WebSMS
+slug: WebAPI/WebSMS
+tags:
+  - Non-standard
+translation_of: Archive/B2G_OS/API/Mobile_Messaging_API
+---
+<p>{{DefaultAPISidebar("Mobile Messaging API")}}</p>
+
+<div class="blockIndicator nonStandard">
+<p><strong>Non-standard</strong><br>
+ This feature is not on a current W3C standards track, but it is supported on the Firefox OS platform. Although implementations may change in the future and it is not supported widely across browsers, it is suitable for use in code dedicated to Firefox OS apps.</p>
+</div>
+
+<div class="blockIndicator warning">
+<p style="text-align: center;">This API is available on <a href="/en-US/docs/Mozilla/Firefox_OS">Firefox OS</a> for <a href="/en-US/docs/Mozilla/Firefox_OS/Security/Application_security#App_Types">internal applications</a> only.</p>
+</div>
+
+<h2 id="요약">요약</h2>
+
+<p>WebSMS는 웹 콘텐츠에서 단문 메시지 서비스 (SMS) 또는 멀티미디어 메시지 서비스 (MMS)의 메시지들을 만들고, 보내고, 받을수 있도록 해주는 API 입니다.</p>
+
+<p>이 API는 {{ domxref("MozSmsManager") }} 객체를 반환하는 {{ domxref("window.navigator.mozSms") }} 또는 {{ domxref("MozMobileMessageManager") }} 객체를 반환하는 {{ domxref("window.navigator.mozMobileMessage") }} 를 사용하여 이용 가능합니다. 자세한 내용은 아래의 인터페이스 전체 목록을 통해 보실 수 있습니다.</p>
+
+<h2 id="DOM_인터페이스">DOM 인터페이스</h2>
+
+<h3 id="SMS_인터페이스">SMS 인터페이스</h3>
+
+<ul>
+ <li>{{ domxref("window.navigator.mozSms") }}</li>
+ <li>{{ domxref("MozSmsManager") }}</li>
+ <li>{{ domxref("MozSmsMessage") }}</li>
+ <li>{{ domxref("MozSmsEvent") }}</li>
+ <li>{{ domxref("MozSmsFilter") }}</li>
+ <li>{{ domxref("MozSmsSegmentInfo") }}</li>
+</ul>
+
+<h3 id="MMS_SMS_인터페이스">MMS, SMS 인터페이스</h3>
+
+<ul>
+ <li>{{ domxref("window.navigator.mozMobileMessage") }}</li>
+ <li>{{ domxref("MozMobileMessageManager")}}</li>
+ <li>{{ domxref("MozMmsMessage") }}</li>
+ <li>{{ domxref("MozMmsEvent") }}</li>
+ <li>{{ domxref("MozMobileMessageThread") }}</li>
+</ul>
+
+<h2 id="예제_코드와_소개">예제 코드와 소개</h2>
+
+<ul>
+ <li><a href="/ko/WebAPI/WebSMS/Introduction_to_WebSMS" title="ko/WebAPI/WebSMS/Introduction_to_WebSMS">WebSMS 소개</a></li>
+</ul>
+
+<h2 id="명세">명세</h2>
+
+<p>이 API는 비 표준 스펙의 구현체입니다. 하지만 W3C의 <a href="http://www.w3.org/2012/sysapps/" title="http://www.w3.org/2012/sysapps/">System Application Working Group</a>에서 논의되고 있습니다.</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('Messaging')}}</td>
+   <td>{{Spec2('Messaging')}}</td>
+   <td>Editor Draft (WIP).</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="설정_이용_가능한_환경">설정 &amp; 이용 가능한 환경</h2>
+
+<div id="compat-mobile"> </div>
+
+<ul>
+ <li>WebSMS는 기본적으로 비활성화 되어있습니다. <code>dom.sms.enabled 설정을 true로 지정하여야 활성화됩니다.</code></li>
+ <li>WebSMS API를 사용하도록 허가된 호스트명들의 화이트 리스트(콤마로 구분)는 반드시 <code>dom.sms.whitelist 설정에 명시되어야 합니다. 이 문자열은 기본적으로 빈 문자열입니다.</code></li>
+ <li>WebSMS는 오직 Firefox OS (B2G) 에 인증된 앱에서만 이용 가능합니다.</li>
+ <li>MMS는 Firefox OS 1.1 부터 이용 가능합니다.고 자료</li>
+ <li><a class="link-https" href="https://wiki.mozilla.org/WebAPI/WebSMS" title="https://wiki.mozilla.org/WebAPI/WebSMS">WebSMS API</a> (설계 문서)</li>
+</ul>
diff --git a/files/ko/webapi/websms/introduction_to_mobile_message_api/introduction_to_websms/index.html b/files/ko/webapi/websms/introduction_to_mobile_message_api/introduction_to_websms/index.html
new file mode 100644
index 0000000000..723f12561a
--- /dev/null
+++ b/files/ko/webapi/websms/introduction_to_mobile_message_api/introduction_to_websms/index.html
@@ -0,0 +1,23 @@
+---
+title: WebSMS 소개
+slug: WebAPI/WebSMS/Introduction_to_Mobile_Message_API/Introduction_to_WebSMS
+translation_of: Archive/B2G_OS/API/Mobile_Messaging_API/Introduction_to_Mobile_Message_API
+---
+<p>휴대전화의 핵심 기능 중 하나는 SMS 메시지 전송과 수신이다. 이 기능은 <a class="link-https" href="https://wiki.mozilla.org/WebAPI/WebSMS">WebSMS API</a>를 사용하여 구현 가능하다. 다음은 구현 방법 예제이다.</p>
+<pre class="brush: js">// SMS object
+var sms = navigator.mozSms;
+
+// Send a message
+sms.send("123456789", "Hello world!");
+
+// Receive a message
+sms.onreceived = function (event) {
+    // Read message
+    console.log(event.message);
+};
+</pre>
+<h2 id="참조_문서">참조 문서</h2>
+<ul>
+  <li><a href="/en/API/WebSMS" title="WebSMS">WebSMS</a></li>
+  <li><a class="link-https" href="https://wiki.mozilla.org/WebAPI/WebSMS">WebSMS API</a> (설계 문서)</li>
+</ul>