Merge pull request #5253 from preco21/master

docs: Update Korean docs as Upstream
This commit is contained in:
Cheng Zhao 2016-04-24 13:38:06 +09:00
commit c7754e712d
34 changed files with 333 additions and 129 deletions

View file

@ -1,10 +1,10 @@
# Electron에 기여하기
:+1::tada: 먼저, 이 프로젝트에 기여해주셔서 감사합니다! :tada::+1:
:+1::tada: 먼저, 기여에 관심을 가져주셔서 감사합니다! :tada::+1:
이 프로젝트는 기여자 규약 [행동강령](CODE_OF_CONDUCT.md)을 준수합니다. 따라서 이
이 프로젝트는 기여자 규약 [행동강령](CODE_OF_CONDUCT.md)을 준수합니다. 따라서 이
프로젝트의 개발에 참여하려면 이 규약을 지켜야 합니다. 받아들일 수 없는 행위를 발견했을
경우 atom@github.com로 보고 하십시오.
경우 atom@github.com로 보고하세요.
다음 항목들은 Electron에 기여하는 가이드라인을 제시합니다.
참고로 이 항목들은 그저 가이드라인에 불과하며 규칙이 아닙니다. 따라서 스스로의 적절한
@ -29,8 +29,8 @@
## Pull Request 하기
* 가능한한 스크린샷과 GIF 애니메이션 이미지를 pull request에 추가
* CoffeeScript, JavaScript, C++과 Python등
[참조문서에 정의된 코딩스타일](/docs-translations/ko-KR/development/coding-style.md)을
* JavaScript, C++과 Python등
[참조 문서에 정의된 코딩스타일](/docs-translations/ko-KR/development/coding-style.md)을
준수
* [문서 스타일 가이드](/docs-translations/ko-KR/styleguide.md)에 따라 문서를
[Markdown](https://daringfireball.net/projects/markdown) 형식으로 작성.

View file

@ -1,8 +1,8 @@
[![Electron Logo](http://electron.atom.io/images/electron-logo.svg)](http://electron.atom.io/)
[![Build Status](https://travis-ci.org/atom/electron.svg?branch=master)](https://travis-ci.org/atom/electron)
[![Travis Build Status](https://travis-ci.org/electron/electron.svg?branch=master)](https://travis-ci.org/electron/electron)
[![AppVeyor Build Status](https://ci.appveyor.com/api/projects/status/qtmod45u0cc1ouov/branch/master?svg=true)](https://ci.appveyor.com/project/Atom/electron)
[![devDependency Status](https://david-dm.org/atom/electron/dev-status.svg)](https://david-dm.org/atom/electron#info=devDependencies)
[![devDependency Status](https://david-dm.org/electron/electron/dev-status.svg)](https://david-dm.org/electron/electron#info=devDependencies)
[![Join the Electron Community on Slack](http://atom-slack.herokuapp.com/badge.svg)](http://atom-slack.herokuapp.com/)
### [Electron](https://github.com/electron/electron/) 한국어 참조문서
@ -17,15 +17,15 @@ Cross-Platform 데스크톱 어플리케이션을 개발할 수 있도록 해주
Electron에 대한 중요한 알림을 받고 싶다면 Twitter에서
[@ElectronJS](https://twitter.com/electronjs)를 팔로우 하세요.
이 프로젝트는 기여자 규약 [행동강령](CODE_OF_CONDUCT.md)을 준수합니다. 따라서 이
이 프로젝트는 기여자 규약 [행동강령](CODE_OF_CONDUCT.md)을 준수합니다. 따라서 이
프로젝트의 개발에 참여하려면 이 규약을 지켜야 합니다. 받아들일 수 없는 행위를 발견했을
경우 atom@github.com로 보고 하십시오.
경우 atom@github.com로 보고하세요.
## 다운로드
Linux, Windows, OS X 용으로 미리 빌드된 Electron 바이너리와 디버그 심볼이 준비되어
있습니다. [releases](https://github.com/electron/electron/releases) 페이지에서 받아 볼
수 있습니다.
있습니다. [releases](https://github.com/electron/electron/releases) 페이지에서
받아 볼 수 있습니다.
또한 [`npm`](https://docs.npmjs.com/)을 통해 미리 빌드된 Electron 바이너리를 설치할
수도 있습니다:
@ -44,9 +44,9 @@ npm install electron-prebuilt --save-dev
## 참조 문서
[Docs](https://github.com/electron/electron/tree/master/docs/README.md)에 개발 지침과
API 레퍼런스가 있습니다. Electron을 빌드 하는 방법과 프로젝트에 기여하는법 또한 문서에
포함되어 있으니 참고하시기 바랍니다.
[Docs](https://github.com/electron/electron/tree/master/docs-translations/ko-KR/README.md)에
개발 지침과 API 레퍼런스가 있습니다. Electron을 빌드 하는 방법과 프로젝트에 기여하는법
또한 문서에 포함되어 있으니 참고하시기 바랍니다.
## 참조 문서 (번역)
@ -62,7 +62,7 @@ API 레퍼런스가 있습니다. Electron을 빌드 하는 방법과 프로젝
## 시작하기
[`atom/electron-quick-start`](https://github.com/electron/electron-quick-start)
[`electron/electron-quick-start`](https://github.com/electron/electron-quick-start)
저장소를 클론하여 Electron을 간단히 접해볼 수 있습니다.
## 커뮤니티

View file

@ -69,7 +69,7 @@ Electron에 대해 자주 묻는 질문이 있습니다. 이슈를 생성하기
* [webContents](api/web-contents.md)
* [Tray](api/tray.md)
### 더러 프로세스에서 사용할 수 있는 모듈 (웹 페이지):
### 더러 프로세스에서 사용할 수 있는 모듈 (웹 페이지):
* [desktopCapturer](api/desktop-capturer.md)
* [ipcRenderer](api/ipc-renderer.md)
@ -93,4 +93,5 @@ Electron에 대해 자주 묻는 질문이 있습니다. 이슈를 생성하기
* [빌드 설명서 (OS X)](development/build-instructions-osx.md)
* [빌드 설명서 (Windows)](development/build-instructions-windows.md)
* [빌드 설명서 (Linux)](development/build-instructions-linux.md)
* [디버거에서 디버그 심볼 서버 설정](development/setting-up-symbol-server.md)
* [디버그 설명서 (Windows)](development/debug-instructions-windows.md)
* [디버거 심볼 서버 설정](development/setting-up-symbol-server.md)

View file

@ -521,6 +521,19 @@ if (browserOptions.transparent) {
이 메서드는 시스템이 다크 모드 상태인 경우 `true`를 반환하고 아닐 경우 `false`
반환합니다.
### `app.importCertificate(options, callback)` _LINUX_
* `options` Object
* `certificate` String - pkcs12 파일의 위치.
* `password` String - 인증서의 암호.
* `callback` Function
* `result` Integer - 가져오기의 결과.
pkcs12 형식으로된 인증서를 플랫폼 인증서 저장소로 가져옵니다. `callback`은 가져오기의
결과를 포함하는 `result` 객체를 포함하여 호출됩니다. 값이 `0` 일 경우 성공을 의미하며
다른 값은 모두 Chrominum의 [net_error_list](https://code.google.com/p/chromium/codesearch#chromium/src/net/base/net_error_list.h)에
따라 실패를 의미합니다.
### `app.commandLine.appendSwitch(switch[, value])`
Chrominum의 명령줄에 스위치를 추가합니다. `value`는 추가적인 값을 뜻하며 옵션입니다.

View file

@ -8,7 +8,7 @@
// 메인 프로세스에서
const BrowserWindow = require('electron').BrowserWindow;
// 또는 더러 프로세스에서
// 또는 더러 프로세스에서
const BrowserWindow = require('electron').remote.BrowserWindow;
var win = new BrowserWindow({ width: 800, height: 600, show: false });
@ -159,7 +159,7 @@ win.show();
기본값은 `false`입니다.
* `experimentalCanvasFeatures` Boolean - Chrome의 실험적인 캔버스(canvas) 기능을
활성화합니다. 기본값은 `false`입니다.
* `directWrite` Boolean - Windows에서 폰트 더링을 위해 DirectWrite를
* `directWrite` Boolean - Windows에서 폰트 더링을 위해 DirectWrite를
사용하는지를 지정합니다. 기본값은 `true`입니다.
* `blinkFeatures` String - `CSSVariables,KeyboardEventKey`같은 `,`로 구분된
기능 문자열들의 리스트입니다. 지원하는 전체 기능 문자열들은
@ -670,6 +670,17 @@ var win = new BrowserWindow({ width: 800, height: 600 });
**참고:** 웹 페이지의 제목과 네이티브 윈도우의 제목은 서로 다를 수 있습니다.
### `win.setSheetOffset(offset)` _OS X_
Mac OS X에서 시트를 부착할 위치를 지정합니다. 기본적으로 시트는 윈도우의 프레임 바로
아래의 위치에 부착됩니다. 아마도 이 기능은 보통 다음과 같이 HTML 렌더링된 툴바 밑에
표시하기 위해 사용할 것입니다:
```javascript
var toolbarRect = document.getElementById('toolbar').getBoundingClientRect();
win.setSheetOffset(toolbarRect.height);
```
### `win.flashFrame(flag)`
* `flag` Boolean
@ -900,4 +911,4 @@ Linux 플랫폼에선 Unity 데스크톱 환경만 지원합니다. 그리고
윈도우에서 일어나는 모든 마우스 이벤트를 무시합니다.
[blink-feature-string]: https://code.google.com/p/chromium/codesearch#chromium/src/out/Debug/gen/blink/platform/RuntimeEnabledFeatures.cpp&sq=package:chromium&type=cs&l=527
[blink-feature-string]: https://code.google.com/p/chromium/codesearch#chromium/src/out/Debug/gen/blink/platform/RuntimeEnabledFeatures.cpp&sq=package:chromium&type=cs&l=576

View file

@ -15,10 +15,6 @@ app.on('ready', function() {
});
```
## --client-certificate=`path`
`path`를 클라이언트 인증서로 설정합니다.
## --ignore-connections-limit=`domains`
`domains` 리스트(`,`로 구분)의 연결 제한을 무시합니다.
@ -121,9 +117,9 @@ SSL 암호화를 비활성화할 대상 목록을 지정합니다. (`,`로 구
## --disable-renderer-backgrounding
Chromium이 더러 프로세스의 보이지 않는 페이지의 우선순위를 낮추는 것을 방지합니다.
Chromium이 더러 프로세스의 보이지 않는 페이지의 우선순위를 낮추는 것을 방지합니다.
이 플래그는 전역적이며 모든 더러 프로세스에 적용됩니다. 만약 하나의 윈도우창에만
이 플래그는 전역적이며 모든 더러 프로세스에 적용됩니다. 만약 하나의 윈도우창에만
스로틀링을 비활성화하고 싶다면 [조용한 오디오를 재생하는][play-silent-audio] 핵을 사용할
수 있습니다.

View file

@ -42,7 +42,7 @@ crashReporter.start({
**참고:** OS X에선 Windows와 Linux의 `breakpad`와 달리 새로운 `crashpad`
클라이언트를 사용합니다. 오류 수집 기능을 활성화 시키려면 오류를 수집하고 싶은 메인
프로세스나 더러 프로세스에서 `crashReporter.start` 메서드를 호출하여 `crashpad`
프로세스나 더러 프로세스에서 `crashReporter.start` 메서드를 호출하여 `crashpad`
초기화해야 합니다.
### `crashReporter.getLastCrashReport()`

View file

@ -65,13 +65,14 @@ function getUserMediaError(e) {
`sources``Source` 객체의 배열입니다. 각 `Source`는 캡쳐된 화면과 독립적인
윈도우를 표현합니다. 그리고 다음과 같은 속성을 가지고 있습니다:
* `id` String - `navigator.webkitGetUserMedia` API에서 사용할 수 있는 캡쳐된 윈도우
또는 화면의 id입니다. 포맷은 `window:XX` 또는 `screen:XX`로 표현되며 `XX`
무작위로 생성된 숫자입니다.
* `name` String - 캡쳐된 화면과 윈도우에 대해 묘사된 이름입니다. 만약 소스가
화면이라면, `Entire Screen` 또는 `Screen <index>`가 될 것이고 소스가 윈도우라면,
해당 윈도우의 제목이 반환됩니다.
* `thumbnail` [NativeImage](NativeImage.md) - 섬네일 이미지.
* `thumbnail` [NativeImage](native-image.md) - 섬네일 네이티브 이미지.
**참고:** `source.thumbnail`의 크기는 언제나 `options``thumnbailSize`와 같다고
보장할 수 없습니다. 섬네일의 크기는 화면과 윈도우의 크기에 의존하여 조정됩니다.

View file

@ -12,16 +12,13 @@ const dialog = require('electron').dialog;
console.log(dialog.showOpenDialog({ properties: [ 'openFile', 'openDirectory', 'multiSelections' ]}));
```
대화 상자는 Electron의 메인 스레드에서 열립니다. 만약 더러 프로세스에서 대화 상자
대화 상자는 Electron의 메인 스레드에서 열립니다. 만약 더러 프로세스에서 대화 상자
객체를 사용하고 싶다면, `remote`를 통해 접근하는 방법을 고려해야 합니다:
```javascript
const dialog = require('electron').remote.dialog;
```
**OS X 참고**: 대화 상자를 시트처럼 보여지게 하려면 `browserWindow` 인자에
`BrowserWindow` 객체의 참조를 제공하면 됩니다.
## Methods
`dialog` 모듈은 다음과 같은 메서드를 가지고 있습니다:
@ -116,7 +113,7 @@ const dialog = require('electron').remote.dialog;
대화 상자를 표시합니다. `browserWindow`를 지정하면 대화 상자가 완전히 닫힐 때까지
지정한 창을 사용할 수 없습니다. 완료 시 유저가 선택한 버튼의 인덱스를 반환합니다.
역주: 부정을 표현하는 "아니오", "취소"와 같은 한글 단어는 지원되지 않습니다. 만약
**역주:** 부정을 표현하는 "아니오", "취소"와 같은 한글 단어는 지원되지 않습니다. 만약
OS X 또는 Windows에서 "확인", "취소"와 같은 순서로 버튼을 지정하게 될 때 Alt + f4로
해당 대화 상자를 끄게 되면 "확인"을 누른 것으로 판단되어 버립니다. 이를 해결하려면
"Cancel"을 대신 사용하거나 BrowserWindow API를 사용하여 대화 상자를 직접 구현해야
@ -130,4 +127,15 @@ OS X 또는 Windows에서 "확인", "취소"와 같은 순서로 버튼을 지
에러 메시지를 보여주는 대화 상자를 표시합니다.
이 API는 `app` 모듈의 `ready` 이벤트가 발생하기 전에 사용할 수 있습니다. 이 메서드는
보통 어플리케이션이 시작되기 전에 특정한 에러를 표시하기 위해 사용됩니다.
보통 어플리케이션이 시작되기 전에 특정한 에러를 표시하기 위해 사용됩니다. 만약
Linux에서 `ready` 이벤트가 호출되기 이전에 이 API를 호출할 경우, 메시지는 stderr를
통해서 표시되며 GUI 대화 상자는 표시되지 않습니다.
## Sheets
Mac OS X에선, `browserWindow` 인자에 `BrowserWindow` 객체 참조를 전달하면 대화
상자가 해당 윈도우에 시트처럼 표시되도록 표현할 수 있습니다. 윈도우의 객체 참조가
제공되지 않으면 모달 형태로 표시됩니다.
`BrowserWindow.getCurrentWindow().setSheetOffset(offset)`을 통해 윈도우에 부착될
시트의 위치를 조정할 수 있습니다.

View file

@ -22,6 +22,7 @@ win.webContents.session.on('will-download', function(event, item, webContents) {
console.log("Download is cancelled or interrupted that can't be resumed");
}
});
});
```
## Events

View file

@ -1,20 +1,20 @@
# ipcMain
`ipcMain` 모듈은 [EventEmitter](https://nodejs.org/api/events.html) 클래스의
인스턴스입니다. 메인 프로세스에서 사용하면, 더러 프로세스(웹 페이지)에서 전달된
동기, 비동기 메시지를 주고 받는 방법을 제공합니다. 더러 프로세스에서 메시지를 전달하면
인스턴스입니다. 메인 프로세스에서 사용하면, 더러 프로세스(웹 페이지)에서 전달된
동기, 비동기 메시지를 주고 받는 방법을 제공합니다. 더러 프로세스에서 메시지를 전달하면
이 모듈을 통해 메시지를 받을 수 있습니다.
## 메시지 전송
물론 메시지를 받는 것 말고도 메인 프로세스에서 더러 프로세스로 보내는 것도 가능합니다.
물론 메시지를 받는 것 말고도 메인 프로세스에서 더러 프로세스로 보내는 것도 가능합니다.
자세한 내용은 [webContents.send][web-contents-send]를 참고하세요.
* 메시지를 전송할 때 이벤트 이름은 `channel`이 됩니다.
* 메시지에 동기로 응답할 땐 반드시 `event.returnValue`를 설정해야 합니다.
* 메시지를 비동기로 응답할 땐 `event.sender.send(...)` 메서드를 사용할 수 있습니다.
다음 예제는 더러 프로세스와 메인 프로세스간에 메시지를 전달하고 받는 예제입니다:
다음 예제는 더러 프로세스와 메인 프로세스간에 메시지를 전달하고 받는 예제입니다:
```javascript
// 메인 프로세스
@ -31,7 +31,7 @@ ipcMain.on('synchronous-message', function(event, arg) {
```
```javascript
// 더러 프로세스 (웹 페이지)
// 더러 프로세스 (웹 페이지)
const ipcRenderer = require('electron').ipcRenderer;
console.log(ipc.sendSync('synchronous-message', 'ping')); // "pong" 출력

View file

@ -1,7 +1,7 @@
# ipcRenderer
`ipcRenderer` 모듈은 [EventEmitter](https://nodejs.org/api/events.html) 클래스의
인스턴스입니다. 더러 프로세스에서 메인 프로세스로 동기/비동기 메시지를 주고 받는
인스턴스입니다. 더러 프로세스에서 메인 프로세스로 동기/비동기 메시지를 주고 받는
방법을 제공합니다. 또한 메인 프로세스로부터 받은 메시지에 응답할 수도 있습니다.
[ipcMain](ipc-main.md)에서 코드 예제를 확인할 수 있습니다.
@ -71,7 +71,7 @@
메인 프로세스는 `ipcMain` 모듈을 통해 `channel` 이벤트를 리스닝 할 수 있고,
`event.returnValue`로 회신 할 수 있습니다.
**참고:** 동기 메서드는 모든 더러 프로세스의 작업을 일시 중단시킵니다. 사용 목적이
**참고:** 동기 메서드는 모든 더러 프로세스의 작업을 일시 중단시킵니다. 사용 목적이
확실하지 않다면 사용하지 않는 것이 좋습니다.
### `ipcRenderer.sendToHost(channel[, arg1][, arg2][, ...])`

View file

@ -62,6 +62,9 @@ OS X에서의 `role`은 다음 값을 추가로 가질 수 있습니다:
* `help` - 부 메뉴를 가지는 "Help" 메뉴
* `services` - 부 메뉴를 가지는 "Services" 메뉴
OS X에서는 `role`을 지정할 때, `label``accelerator`만 MenuItem에 효과가
적용되도록 변경되며, 다른 옵션들은 모두 무시됩니다.
## Instance Properties
다음 속성들은 존재하는 `MenuItem`에서 계속 변경될 수 있습니다:

View file

@ -1,7 +1,7 @@
# Menu
`menu` 클래스는 어플리케이션 메뉴와 [컨텍스트 메뉴](https://developer.mozilla.org/ko/docs/Mozilla/Tech/XUL/PopupGuide/ContextMenus)를
만들 때 사용됩니다. 이 모듈은 메인 프로세스용 모듈이지만 `remote` 모듈을 통해 더러
만들 때 사용됩니다. 이 모듈은 메인 프로세스용 모듈이지만 `remote` 모듈을 통해 더러
프로세스에서도 사용할 수 있습니다.
각 메뉴는 여러 개의 [메뉴 아이템](menu-item.md)으로 구성되고 서브 메뉴를 가질 수도 있습니다.
@ -29,7 +29,7 @@ window.addEventListener('contextmenu', function (e) {
</script>
```
또 하나의 예를 들자면 다음 예제는 더러 프로세스에서 template API를 사용하여
또 하나의 예를 들자면 다음 예제는 더러 프로세스에서 template API를 사용하여
어플리케이션 메뉴를 만듭니다:
```javascript
@ -106,7 +106,7 @@ var template = [
})(),
click: function(item, focusedWindow) {
if (focusedWindow)
focusedWindow.toggleDevTools();
focusedWindow.webContents.toggleDevTools();
}
},
]

View file

@ -9,6 +9,8 @@ Electron의 `process` 객체는 기존의 node와는 달리 약간의 차이점
* `process.resourcesPath` String - JavaScript 소스 코드의 경로.
* `process.mas` Boolean - Mac 앱 스토어용 빌드일 때 `true`로 지정됩니다. 다른
빌드일 땐 `undefined`로 지정됩니다.
* `process.windowsStore` Boolean - 만약 앱이 Windows Store 앱 (appx)으로 작동하고
있다면, 이 값이 `true`로 지정되며 다른 빌드인 경우엔 `undefined`로 지정됩니다.
## Events

View file

@ -1,15 +1,15 @@
# remote
`remote` 모듈은 메인 프로세스와 더러 프로세스(웹 페이지) 사이의 inter-process
`remote` 모듈은 메인 프로세스와 더러 프로세스(웹 페이지) 사이의 inter-process
(IPC) 통신을 간단하게 추상화 한 모듈입니다.
Electron의 메인 프로세스에선 GUI와 관련 있는(`dialog`, `menu`등) 모듈만 사용할 수
있습니다. 더러 프로세스에서 이러한 모듈들을 사용하려면 `ipc` 모듈을 통해 메인
있습니다. 더러 프로세스에서 이러한 모듈들을 사용하려면 `ipc` 모듈을 통해 메인
프로세스와 inter-process 통신을 해야 합니다. 또한, `remote` 모듈을 사용하면
inter-process 통신을 하지 않고도 간단한 API를 통해 직접 메인 프로세스의 모듈과
메서드를 사용할 수 있습니다. 이 개념은 Java의 [RMI][rmi]와 비슷합니다.
다음 예제는 더러 프로세스에서 브라우저 창을 만드는 예제입니다:
다음 예제는 더러 프로세스에서 브라우저 창을 만드는 예제입니다:
```javascript
const remote = require('electron').remote;
@ -19,7 +19,7 @@ var win = new BrowserWindow({ width: 800, height: 600 });
win.loadURL('https://github.com');
```
**참고:** 반대로 메인 프로세스에서 더러 프로세스에 접근 하려면 [webContents.executeJavascript](web-contents.md#webcontentsexecutejavascriptcode-usergesture)
**참고:** 반대로 메인 프로세스에서 더러 프로세스에 접근 하려면 [webContents.executeJavascript](web-contents.md#webcontentsexecutejavascriptcode-usergesture)
메서드를 사용하면 됩니다.
## Remote 객체
@ -30,8 +30,8 @@ win.loadURL('https://github.com');
동기형 inter-process 메시지를 보냅니다.
위의 예제에서 사용한 두 `BrowserWindow``win`은 remote 객체입니다. 그리고
`new BrowserWindow`이 생성하는 `BrowserWindow` 객체는 더러 프로세스에서 생성되지
않습니다. 대신에 이 `BrowserWindow` 객체는 메인 프로세스에서 생성되며 더러
`new BrowserWindow`이 생성하는 `BrowserWindow` 객체는 더러 프로세스에서 생성되지
않습니다. 대신에 이 `BrowserWindow` 객체는 메인 프로세스에서 생성되며 더러
프로세스에 `win` 객체와 같이 이에 대응하는 remote 객체를 반환합니다.
참고로 remote를 통해선 [enumerable 속성](https://developer.mozilla.org/ko/docs/Web/JavaScript/Enumerability_and_ownership_of_properties)을
@ -39,11 +39,11 @@ win.loadURL('https://github.com');
## Remote 객체의 생명 주기
Electron은 더러 프로세스의 remote 객체가 살아있는 한(다시 말해서 GC(garbage
Electron은 더러 프로세스의 remote 객체가 살아있는 한(다시 말해서 GC(garbage
collection)가 일어나지 않습니다) 대응하는 메인 프로세스의 객체는 릴리즈되지 않습니다.
Remote 객체가 GC 되려면 대응하는 메인 프로세스 내부 객체의 참조가 해제되어야만 합니다.
만약 remote 객체가 더러 프로세스에서 누수가 생겼다면 (예시: 맵에 저장하고 할당
만약 remote 객체가 더러 프로세스에서 누수가 생겼다면 (예시: 맵에 저장하고 할당
해제하지 않음) 대응하는 메인 프로세스의 객체도 누수가 생깁니다. 그래서 remote 객체를
사용할 땐 메모리 누수가 생기지 않도록 매우 주의해서 사용해야 합니다.
@ -51,14 +51,14 @@ Remote 객체가 GC 되려면 대응하는 메인 프로세스 내부 객체의
## 메인 프로세스로 콜백 넘기기
메인 프로세스의 코드는 `remote` 모듈을 통해 더러 프로세스가 전달하는 콜백 함수를
메인 프로세스의 코드는 `remote` 모듈을 통해 더러 프로세스가 전달하는 콜백 함수를
받을 수 있습니다. 하지만 이 작업은 반드시 주의를 기울여 사용해야 합니다.
첫째, 데드락을 피하기 위해 메인 프로세스로 전달된 콜백들은 비동기로 호출됩니다. 이러한
이유로 메인 프로세스로 전달된 콜백들의 반환 값을 내부 함수에서 언제나 정상적으로 받을
것이라고 예측해선 안됩니다.
예를 들어 메인 프로세스에서 `Array.map` 같은 메서드를 사용할 때 더러 프로세스에서
예를 들어 메인 프로세스에서 `Array.map` 같은 메서드를 사용할 때 더러 프로세스에서
전달된 함수를 사용해선 안됩니다:
```javascript
@ -75,7 +75,7 @@ exports.withLocalCallback = function() {
```
```javascript
// 더러 프로세스
// 더러 프로세스
var mapNumbers = require("remote").require("./mapNumbers");
var withRendererCb = mapNumbers.withRendererCallback(function(x) {
@ -87,7 +87,7 @@ var withLocalCb = mapNumbers.withLocalCallback()
console.log(withRendererCb, withLocalCb) // [true, true, true], [2, 3, 4]
```
보다시피 더러 콜백의 동기 반환 값은 예상되지 않은 처리입니다.
보다시피 더러 콜백의 동기 반환 값은 예상되지 않은 처리입니다.
그리고 메인 프로세스에서 처리한 함수의 반환 값과 일치하지 않습니다.
둘째, 콜백들은 메인 프로세스로 전달, 호출된 이후에도 자동으로 함수의 참조가 릴리즈 되지
@ -113,9 +113,9 @@ remote.getCurrentWindow().on('close', function() {
설상가상으로 이전에 설치된 콜백의 콘텍스트가 릴리즈 되고 난 후(예: 페이지 새로고침)
`close` 이벤트가 발생하면 예외가 발생하고 메인 프로세스가 작동 중지됩니다.
이러한 문제를 피하려면 더러 프로세스에서 메인 프로세스로 넘긴 함수의 참조를 사용 후
이러한 문제를 피하려면 더러 프로세스에서 메인 프로세스로 넘긴 함수의 참조를 사용 후
확실하게 제거해야 합니다. 작업 후 이벤트 콜백을 포함하여 책임 있게 함수의 참조를
제거하거나 메인 프로세스에서 더러 프로세스가 종료될 때 내부적으로 함수 참조를
제거하거나 메인 프로세스에서 더러 프로세스가 종료될 때 내부적으로 함수 참조를
제거하도록 설계해야 합니다.
## 메인 프로세스의 빌트인 모듈에 접근

View file

@ -1,12 +1,13 @@
# screen
`screen` 모듈은 화면 크기, 디스플레이, 커서 위치 등등의 다양한 정보를 가져옵니다.
이 모듈은 `app` 모듈의 `ready` 이벤트가 발생하기 전까지 사용할 수 없습니다.
이 모듈은 `app` 모듈의 `ready` 이벤트가 발생하기 전까지 사용할 수 없습니다. (호출 또는
모듈 포함)
`screen`은 [EventEmitter](http://nodejs.org/api/events.html#events_class_events_eventemitter)를
상속 받았습니다.
**참고:** 더러 / DevTools에선 이미 DOM 속성이 `window.screen`을 가지고 있으므로
**참고:** 더러 / DevTools에선 이미 DOM 속성이 `window.screen`을 가지고 있으므로
`screen = require('screen')` 형식으로 모듈을 사용할 수 없습니다. 아래의 예제와 같이
`electronScreen` 같은 이름으로 모듈 이름을 대체하여 사용해야 합니다.

View file

@ -293,9 +293,9 @@ myWindow.webContents.session.setCertificateVerifyProc(function(hostname, cert, c
* `handler` Function
* `webContents` Object - [WebContents](web-contents.md) 권한을 요청.
* `permission` String - 'media', 'geolocation', 'notifications',
'midiSysex', 'pointerLock', 'fullscreen'의 나열.
* `callback` Function - 권한 허용 및 거부.
* `permission` String - 'media', 'geolocation', 'notifications',
'midiSysex', 'pointerLock', 'fullscreen', 'openExternal'의 나열.
* `callback` Function - 권한 허용 및 거부.
`session`의 권한 요청에 응답을 하는데 사용하는 핸들러를 설정합니다.
`callback(true)`를 호출하면 권한 제공을 허용하고 `callback(false)`
@ -419,7 +419,7 @@ HTTP 요청을 보내기 전 요청 헤더를 사용할 수 있을 때 `listener
* `timestamp` Double
* `requestHeaders` Object
#### `ses.webRequest.onHeadersReceived([filter,] listener)`
#### `ses.webRequest.onHeadersReceived([filter, ]listener)`
* `filter` Object
* `listener` Function

View file

@ -36,14 +36,12 @@ shell.openExternal('https://github.com');
mailto: URL은 유저의 기본 이메일 에이전트로 URL을 엽니다.) 어플리케이션이 해당 URL을
열 수 있을 때 `true`를 반환합니다. 아니라면 `false`를 반환합니다.
역주: 폴더는 'file:\\\\C:\\'와 같이 지정하여 열 수 있습니다. (Windows의 경우)
**역주:** 탐색기로 폴더만 표시하려면 `'file://경로'`와 같이 지정하여 열 수 있습니다.
### `shell.moveItemToTrash(fullPath)`
* `fullPath` String
Move the given file to trash and returns boolean status for the operation.
지정한 파일을 휴지통으로 이동합니다. 작업의 성공여부를 boolean 형으로 리턴합니다.
### `shell.beep()`

View file

@ -5,12 +5,12 @@ node 모듈을 완벽하게 지원합니다. ([네이티브 모듈](../tutorial/
포함)
또한 Electron은 네이티브 데스크톱 어플리케이션을 개발 할 수 있도록 추가적인 built-in
모듈을 제공합니다. 몇몇 모듈은 메인 프로세스에서만 사용할 수 있고 어떤 모듈은 더러
모듈을 제공합니다. 몇몇 모듈은 메인 프로세스에서만 사용할 수 있고 어떤 모듈은 더러
프로세스(웹 페이지)에서만 사용할 수 있습니다. 또한 두 프로세스 모두 사용할 수 있는
모듈도 있습니다.
기본적인 규칙으로 [GUI][gui]와 저 수준 시스템에 관련된 모듈들은 오직 메인
프로세스에서만 사용할 수 있습니다. [메인 프로세스 vs. 더러 프로세스](../tutorial/quick-start.md#메인-프로세스)
프로세스에서만 사용할 수 있습니다. [메인 프로세스 vs. 더러 프로세스](../tutorial/quick-start.md#메인-프로세스)
컨셉에 익숙해야 모듈을 다루기 쉬우므로 관련 문서를 읽어 보는 것을 권장합니다.
메인 프로세스 스크립트는 일반 Node.js 스크립트와 비슷합니다:
@ -28,7 +28,7 @@ app.on('ready', function() {
});
```
더러 프로세스도 예외적인 node module들을 사용할 수 있다는 점을 제외하면 일반 웹
더러 프로세스도 예외적인 node module들을 사용할 수 있다는 점을 제외하면 일반 웹
페이지와 크게 다를게 없습니다:
```html

View file

@ -350,6 +350,10 @@ var currentURL = win.webContents.getURL();
현재 웹 페이지가 리소스를 로드중인지 여부를 반환합니다.
### `webContents.isLoadingMainFrame()`
메인 프레임이 여전히 로딩중인지 여부를 반환합니다. (내부 iframe 또는 frame 포함)
### `webContents.isWaitingForResponse()`
현재 웹 페이지가 페이지의 메인 리소스로부터 첫 응답을 기다리고있는지 여부를 반환합니다.
@ -640,6 +644,9 @@ mainWindow.webContents.on('devtools-opened', function() {
* `options` Object (optional)
* `detach` Boolean - 새 창에서 개발자 도구를 엽니다.
* `mode` String - 개발자 도구 표시 상태를 지정합니다. 옵션은 "right", "bottom",
"undocked", "detach" 중 한 가지가 될 수 있습니다. 기본값은 마지막 표시 상태를
사용합니다.
개발자 도구를 엽니다.

View file

@ -1,6 +1,6 @@
# webFrame
`web-frame` 모듈은 현재 웹 페이지의 더링 상태를 설정 할 수 있도록 관련 유틸리티를
`web-frame` 모듈은 현재 웹 페이지의 더링 상태를 설정 할 수 있도록 관련 유틸리티를
제공하는 모듈입니다.
다음 예제는 현재 페이지를 200% 줌 합니다:

View file

@ -20,12 +20,6 @@
<webview id="foo" src="https://www.github.com/" style="display:inline-flex; width:640px; height:480px"></webview>
```
주의할 점은 `webview` 태그의 스타일은 전통적인 flexbox 레이아웃을 사용했을 때 자식
`object` 요소가 해당 `webview` 컨테이너의 전체 높이와 넓이를 확실히 채우도록
내부적으로 `display:flex;`를 사용합니다. (v0.36.11 부터) 따라서 인라인 레이아웃을
위해 `display:inline-flex;`를 쓰지 않는 한, 기본 `display:flex;` CSS 속성을
덮어쓰지 않도록 주의해야 합니다.
게스트 컨텐츠를 조작하기 위해 자바스크립트로 `webview` 태그의 이벤트를 리스닝 하여
응답을 받을 수 있습니다. 다음 예제를 참고하세요: 첫번째 리스너는 페이지 로딩 시작시의
이벤트를 확인하고 두번째 리스너는 페이지의 로딩이 끝난시점을 확인합니다. 그리고
@ -49,6 +43,36 @@
</script>
```
## CSS 스타일링 참고
주의할 점은 `webview` 태그의 스타일은 전통적인 flexbox 레이아웃을 사용했을 때 자식
`object` 요소가 해당 `webview` 컨테이너의 전체 높이와 넓이를 확실히 채우도록
내부적으로 `display:flex;`를 사용합니다. (v0.36.11 부터) 따라서 인라인 레이아웃을
위해 `display:inline-flex;`를 쓰지 않는 한, 기본 `display:flex;` CSS 속성을
덮어쓰지 않도록 주의해야 합니다.
`webview``hidden` 또는 `display: none;` 속성을 사용할 때 발생하는 문제를 한 가지
가지고 있습니다. 자식 `browserplugin` 객체 내에서 비정상적인 랜더링 동작을 발생시킬 수
있으며 웹 페이지가 로드되었을 때, `webview`가 숨겨지지 않았을 때, 반대로 그냥 바로
다시 보이게 됩니다. `webview`를 숨기는 방법으로 가장 권장되는 방법은 `width` &
`height`를 0으로 지정하는 CSS를 사용하는 것이며 `flex`를 통해 0px로 요소를 수축할 수
있도록 합니다.
```html
<style>
webview {
display:inline-flex;
width:640px;
height:480px;
}
webview.hide {
flex: 0 1;
width: 0px;
height: 0px;
}
</style>
```
## 태그 속성
`webview` 태그는 다음과 같은 속성을 가지고 있습니다:
@ -149,7 +173,7 @@ API를 사용할 수 있습니다. 이를 지정하면 내부에서 로우레벨
동일한 세션을 공유할 수 있도록 할 수 있습니다. 만약 `partition`이 지정되지 않으면 앱의
기본 세션을 사용합니다.
이 값은 첫 탐색 이전에만 지정할 수 있습니다. 즉. 작동중인 더러 프로세스의 세션은
이 값은 첫 탐색 이전에만 지정할 수 있습니다. 즉. 작동중인 더러 프로세스의 세션은
변경할 수 없습니다. 이후 이 값을 바꾸려고 시도하면 DOM 예외를 발생시킵니다.
### `allowpopups`
@ -263,7 +287,7 @@ Webview에 웹 페이지 `url`을 로드합니다. `url`은 `http://`, `file://`
### `<webview>.isCrashed()`
더러 프로세스가 크래시 됬는지 확인합니다.
더러 프로세스가 크래시 됬는지 확인합니다.
### `<webview>.setUserAgent(userAgent)`
@ -294,7 +318,7 @@ Webview에 웹 페이지 `url`을 로드합니다. `url`은 `http://`, `file://`
이 옵션을 활성화 시키면 `requestFullScreen`와 같은 HTML API에서 유저의 승인을
무시하고 개발자가 API를 바로 사용할 수 있도록 허용합니다.
역주: 기본적으로 브라우저에선 전체화면, 웹캠, 파일 열기등의 API를 사용하려면 유저의
**역주:** 기본적으로 브라우저에선 전체화면, 웹캠, 파일 열기등의 API를 사용하려면 유저의
승인(이벤트)이 필요합니다.
### `<webview>.openDevTools()`
@ -423,8 +447,8 @@ Webview 페이지를 PDF 형식으로 인쇄합니다.
* `channel` String
* `args` (optional)
`channel`을 통해 더러 프로세스로 비동기 메시지를 보냅니다. 또한 `args`를 지정하여
임의의 인자를 보낼 수도 있습니다. 더러 프로세스는 `ipcRenderer` 모듈의 `channel`
`channel`을 통해 더러 프로세스로 비동기 메시지를 보냅니다. 또한 `args`를 지정하여
임의의 인자를 보낼 수도 있습니다. 더러 프로세스는 `ipcRenderer` 모듈의 `channel`
이벤트로 이 메시지를 받아 처리할 수 있습니다.
예제는 [webContents.send](web-contents.md#webcontentssendchannel-args)를 참고하세요.
@ -469,9 +493,10 @@ Returns:
* `errorCode` Integer
* `errorDescription` String
* `validatedURL` String
* `isMainFrame` Boolean
`did-finish-load`와 비슷합니다. 하지만 이 이벤트는 `window.stop()`과 같은 무언가로
인해 로드에 실패했을 때 발생하는 이벤트입니다.
`did-finish-load`와 비슷합니다. 하지만 이 이벤트는 `window.stop()`과 같이 취소
함수가 호출되었거나 로드에 실패했을 때 발생하는 이벤트입니다.
### Event: 'did-frame-finish-load'
@ -696,7 +721,7 @@ ipcRenderer.on('ping', function() {
### Event: 'crashed'
더러 프로세스가 크래시 되었을 때 발생하는 이벤트입니다.
더러 프로세스가 크래시 되었을 때 발생하는 이벤트입니다.
### Event: 'gpu-crashed'
@ -725,6 +750,10 @@ WebContents가 파괴될 때 발생하는 이벤트입니다.
### Event: 'did-change-theme-color'
Returns:
* `themeColor` String
페이지의 테마 색이 변경될 때 발생하는 이벤트입니다. 이 이벤트는 보통 meta 태그에
의해서 발생합니다:

View file

@ -0,0 +1,87 @@
# Windows에서 Electron 디버깅하기
만약 작성한 Javascript 어플리케이션이 아닌 Electron 자체의 크래시나 문제를 경험하고
있다면, 네이티브/C++ 디버깅에 익숙하지 않은 개발자는 디버깅이 약간 까다로울 수
있습니다. 그렇다 해도, Visual Studio, GitHub의 Electron이 호스팅하는 심볼 서버,
Electron 소스 코드가 중단점을 통해 순차적으로 쉽게 디버깅할 수 있는 환경을 제공합니다.
## 요구 사항
* **Electron의 디버그 빌드**: 가장 쉬운 방법은 보통
[Windows용 빌드 설명서](build-instructions-windows.md)에 명시된 요구사항과 툴을
사용하여 스스로 빌드하는 것입니다. 물론 직접 다운로드 받은 Electron 바이너리에도
디버거 연결 및 디버깅을 사용할 수 있지만, 실질적으로 디버깅이 까다롭게 고도의
최적화가 되어있음을 발견하게 될 것입니다: 인라인화, 꼬리 호출, 이외 여러 가지
생소한 최적화가 적용되어 디버거가 모든 변수와 실행 경로를 정상적으로 표시할 수
없습니다.
* **Visual Studio와 C++ 툴**: Visual Studio 2013과 Visual Studio 2015 두 가지
커뮤니티 에디션 모두 잘 작동합니다. 설치가 완료되면,
[Visual Studio가 GitHub의 Electron 심볼 서버를 사용하도록](setting-up-symbol-server.md)
설정해야 합니다. 이 작업은 Visual Studio가 Electron에서 무슨일이 일어나는지 더 잘
이해할 수 있도록 하며 변수를 사람이 읽기 좋은 포맷으로 쉽게 표현할 수 있도록 합니다.
* **ProcMon**: 이 무료 [SysInternals][sys-internals] 툴은 프로세스 인자, 파일
핸들러 그리고 레지스트리 작업을 탐색할 수 있게 도와줍니다.
## Electron에 디버거 연결하고 디버깅하기
디버깅 작업을 시작하려면, PowerShell/CMD 중 한 가지를 열고 디버그 빌드 상태의
Electron에 인자로 어플리케이션을 전달하여 실행합니다:
```powershell
$ ./out/D/electron.exe ~/my-electron-app/
```
### 중단점 설정
그리고, Visual Studio를 엽니다. Electron은 Visual Studio로 만들어지지 않았으며
이러한 이유로 인해 프로젝트 파일을 가지고 있지 않습니다. 하지만 "파일로 열기"를 통해
소스 코드 파일들을 열 수 있습니다. Visual Studio가 각각의 파일을 따로 연다는 것입니다.
여전히 중단점을 설정할 수 있습니다. Visual Studio는 현재 소스 코드와 일치하는 작동
중인 프로세스와 중단점을 자동으로 찾아냅니다.
관련된 코드 파일들은 `./atom/`에서 찾을 수 있으며 또한 Brightray 안
`./vendor/brightray/browser``./vendor/brightray/common`에서도 찾을 수 있습니다.
만약 하드코어를 좋아한다면, Chromium을 직접 디버깅할 수도 있습니다. 확실히
`chromium_src` 안에서 찾을 수 있습니다.
### 디버거 연결
로컬에서 작동 중인 프로세스 또는 원격 컴퓨터에 Visual Studio 디버거를 적용시킬 수
있습니다. 프로세스의 실행이 끝난 후, 디버그 / 프로세스에 연결을 (또는 `Ctrl+Alt+P`
입력) 클릭하면 "프로세스에 연결" 대화 상자가 열립니다. 이 도구를 통해 로컬 또는
원격에서 작동 중인 어플리케이션을 디버깅할 수 있으며 여러 프로세스를 동시에 디버깅할
수도 있습니다.
만약 Electron이 서로 다른 유저 계정에서 실행 중이라면, `모든 사용자의 프로세스
보이기`를 선택하면 됩니다. 참고로 이는 `BrowserWindow`가 열린 개수에 따라 달라질 수
있으며 아마 다수의 프로세스를 발견할 수 있을 것입니다. 전형적인 one-window
어플리케이션은 Visual Studio에서 두 개의 `Electron.exe` 항목으로 표시됩니다. 하나는
메인 프로세스이며 다른 하나는 렌더러 프로세스입니다. 리스트는 단지 이름 하나만 제공하기
때문에 현재까지는 다른 적절한 프로세스 판별법이 없습니다.
### 어떤 프로세스에 디버거를 적용해야 하나요?
코드는 메인 프로세스 내에서 실행되며 (이는 코드를 안에서 찾을 수 있거나, 결국 메인
Javascript 파일에 의해 실행) remote (`require('electron').remote`)를 사용하여
코드를 실행하는 것 또한 메인 프로세스 내에서 실행됩니다. 다른 코드는 각각의 렌더러
프로세스 내에서 실행됩니다.
디버깅할 때 여러 프로그램에 디버거를 적용할 수 있지만, 언제나 한 개의 프로그램만
디버거에서 활성화되어야 합니다. `디버그 경로` 툴바 또는 `프로세스 창`에서 활성화
프로그램을 설정할 수 있습니다.
## 프로세스를 관찰하기 위해 ProcMon 사용
Visual Studio는 특정 코드 경로를 탐색하는것에 대해 환상적인 기능을 제공하고 ProcMon은
어플리케이션이 운영체제와 하는 일의 모든 것을 관찰하는데 강력한 기능을 가지고 있습니다.
이 툴은 프로세스의 파일, 레지스트리, 네트워킹, 프로세스, 프로파일링 상세를 포착할 수
있으며 강력하게 **모든** 이벤트의 발생을 로깅을 시도합니다. 만약 어플리케이션이
운영체제에 대해 무슨 일을 하고 있는지 이해하고 싶다면 이는 좋은 자원이 될 것입니다.
ProcMon의 기본적인 디버깅 기능을 알아보고 싶다면 Microsoft에서 제공하는
[동영상 강좌][procmon-instructions]를 참고하세요.
[sys-internals]: https://technet.microsoft.com/en-us/sysinternals/processmonitor.aspx
[procmon-instructions]: https://channel9.msdn.com/shows/defrag-tools/defrag-tools-4-process-monitor

View file

@ -13,7 +13,7 @@ Electron
├── atom - C++ 소스 코드.
| ├── app - 시스템 엔트리 코드.
| ├── browser - 주 윈도우를 포함한 프론트엔드, UI, 그리고 메인 프로세스에 관련된
| | 코드와 더러 및 웹 페이지 관리 관련 코드.
| | 코드와 더러 및 웹 페이지 관리 관련 코드.
| | ├── ui - 서로 다른 플랫폼에 대한 UI 관련 구현 코드.
| | | ├── cocoa - Cocoa 특정 소스 코드.
| | | ├── gtk - GTK+ 특정 소스 코드.
@ -22,9 +22,9 @@ Electron
| | ├── net - 네트워킹 관련 코드.
| | ├── mac - Mac 특정 Objective-C 소스 코드.
| | └── resources - 아이콘들, 플랫폼 종속성 파일들, 기타 등등..
| ├── renderer - 더러 프로세스에서 작동하는 코드.
| | └── api - 더러 프로세스 API의 구현.
| └── common - 메인과 더러 프로세스에서 모두 사용하는 코드, 몇가지 유틸리티
| ├── renderer - 더러 프로세스에서 작동하는 코드.
| | └── api - 더러 프로세스 API의 구현.
| └── common - 메인과 더러 프로세스에서 모두 사용하는 코드, 몇가지 유틸리티
| 함수들이 포함되어 있고 node의 메시지 루프와 Chromium의 메시지 루프를 통합.
| └── api - 공통 API 구현들, 기초 Electron 빌트-인 모듈들.
├── chromium_src - Chromium에서 복사하여 가져온 소스코드.
@ -33,9 +33,9 @@ Electron
├── lib - JavaScript 소스 코드.
| ├── browser - Javascript 메인 프로세스 초기화 코드.
| | └── api - Javascript API 구현 코드.
| ├── common - 메인과 더러 프로세스에서 모두 사용하는 JavaScript
| ├── common - 메인과 더러 프로세스에서 모두 사용하는 JavaScript
| | └── api - Javascript API 구현 코드.
| └── renderer - Javascript 더러 프로세스 초기화 코드.
| └── renderer - Javascript 더러 프로세스 초기화 코드.
| └── api - Javascript API 구현 코드.
├── spec - 자동화 테스트.
├── atom.gyp - Electron의 빌드 규칙.
@ -57,3 +57,30 @@ Electron
스크립트로부터 만들어지는 임시 디렉터리.
* **external_binaries** - `gyp` 빌드를 지원하지 않아 따로 다운로드된 서드파티
프레임워크 바이너리들.
## Git 서브 모듈 최신 버전으로 유지
Electron 저장소는 몇 가지 외부 벤더 종속성을 가지고 있으며 [/vendor](/vendor)
디렉터리에서 확인할 수 있습니다. 때때로 `git status`를 실행했을 때 아마 다음과 같은
메시지를 흔히 목격할 것입니다:
```sh
$ git status
modified: vendor/brightray (new commits)
modified: vendor/node (new commits)
```
이 외부 종속성 모듈들을 업데이트 하려면, 다음 커맨드를 실행합니다:
```sh
git submodule update --init --recursive
```
만약 자기 자신이 너무 이 커맨드를 자주 사용하는 것 같다면, `~/.gitconfig` 파일을
생성하여 편하게 업데이트할 수 있습니다:
```
[alias]
su = submodule update --init --recursive
```

View file

@ -20,13 +20,13 @@ Node.js의 새로운 기능은 보통 V8 업그레이드에서 가져옵니다.
## 어떻게 웹 페이지 간에 데이터를 공유할 수 있나요?
두 웹페이지 간에 (더러 프로세스) 데이터를 공유하려면 간단히 이미 모든 브라우저에서
두 웹페이지 간에 (더러 프로세스) 데이터를 공유하려면 간단히 이미 모든 브라우저에서
사용할 수 있는 HTML5 API들을 사용하면 됩니다. 가장 좋은 후보는
[Storage API][storage], [`localStorage`][local-storage],
[`sessionStorage`][session-storage], 그리고 [IndexedDB][indexed-db]가 있습니다.
또는 Electron에서만 사용할 수 있는 IPC 시스템을 사용하여 메인 프로세스의 global
변수에 데이터를 저장한 후 다음과 같이 더러 프로세스에서 `remote` 모듈을 사용하여
변수에 데이터를 저장한 후 다음과 같이 더러 프로세스에서 `remote` 모듈을 사용하여
접근할 수 있습니다:
```javascript
@ -141,7 +141,7 @@ npm uninstall -g electron
그런데 여전히 빌트인 모듈이 계속해서 문제를 발생시키는 경우, 아마 모듈을 잘못 사용하고
있을 가능성이 큽니다. 예를 들면 `electron.app`은 메인 프로세스에서만 사용할 수 있는
모듈이며, 반면 `electron.webFrame` 모듈은 더러 프로세스에서만 사용할 수 있는
모듈이며, 반면 `electron.webFrame` 모듈은 더러 프로세스에서만 사용할 수 있는
모듈입니다.
[memory-management]: https://developer.mozilla.org/ko/docs/Web/JavaScript/Memory_Management

View file

@ -18,7 +18,7 @@ Electron 문서를 작성하는 규칙은 다음과 같습니다.
추가합니다.
- 메서드 헤더는 `code backtick` 으로 표시합니다.
- 이벤트 헤더는 한 '따옴표'로 표시합니다.
- 리스트를 2 단계 이상 중첩하지 않습니다. (안타깝게도 markdown 더러가 이를 지원하지
- 리스트를 2 단계 이상 중첩하지 않습니다. (안타깝게도 markdown 더러가 이를 지원하지
않습니다)
- 섹션에 대한 제목을 추가합니다. Events, Class 메서드 그리고 인스턴스 메서드 등
- 어떤 '것'의 사용 결과를 설명할 때 '될 것입니다' 형식을 사용하여 설명합니다.

View file

@ -1,6 +1,6 @@
# 메인 프로세스 디버깅하기
브라우저 창의 개발자 도구는 웹 페이지 같은 더러 프로세스의 스크립트만 디버깅이
브라우저 창의 개발자 도구는 웹 페이지 같은 더러 프로세스의 스크립트만 디버깅이
가능합니다. 대신 Electron은 메인 프로세스의 디버깅을 위해 `--debug``--debug-brk`
스위치들을 제공합니다.

View file

@ -14,7 +14,7 @@ Windows, Linux, OS X 운영체제 모두 기본적으로 어플리케이션에
통해 개발자가 편리하게 데스크톱 알림을 사용할 수 있는 기능을 제공합니다. 데스크톱 알림은
운영체제의 네이티브 알림 API를 사용하여 표시합니다.
**참고:** 이 API는 HTML5 API이기 때문에 더러 프로세스에서만 사용할 수 있습니다.
**참고:** 이 API는 HTML5 API이기 때문에 더러 프로세스에서만 사용할 수 있습니다.
```javascript
var myNotification = new Notification('Title', {

View file

@ -4,10 +4,6 @@ Electron은 v0.34.0 버전부터 앱 패키지를 Mac App Store(MAS)에 제출
되었습니다. 이 가이드는 어플리케이션을 앱 스토어에 등록하는 방법과 빌드의 한계에 대한
설명을 제공합니다.
**참고:** v0.36.0 버전부터 어플리케이션이 샌드박스화 된 상태로 실행되면 GPU 작동을
방지하는 버그가 있었습니다. 따라서 이 버그가 고쳐지기 전까진 v0.35.x 버전을 사용하는
것을 권장합니다. 이 버그에 관한 자세한 사항은 [issue #3871][issue-3871]를 참고하세요.
**참고:** Mac App Store에 어플리케이션을 등록하려면
[Apple Developer Program][developer-program]에 등록되어 있어야 하며 비용이 발생할
수 있습니다.
@ -56,6 +52,8 @@ Apple로부터 인증서를 취득했다면, [어플리케이션 배포](applica
<dict>
<key>com.apple.security.app-sandbox</key>
<true/>
<key>com.apple.security.temporary-exception.sbpl</key>
<string>(allow mach-lookup (global-name-regex #"^org.chromium.Chromium.rohitfork.[0-9]+$"))</string>
</dict>
</plist>
```
@ -77,17 +75,18 @@ INSTALLER_KEY="3rd Party Mac Developer Installer: Company Name (APPIDENTITY)"
FRAMEWORKS_PATH="$APP_PATH/Contents/Frameworks"
codesign --deep -fs "$APP_KEY" --entitlements child.plist "$FRAMEWORKS_PATH/Electron Framework.framework/Versions/A"
codesign --deep -fs "$APP_KEY" --entitlements child.plist "$FRAMEWORKS_PATH/$APP Helper.app/"
codesign --deep -fs "$APP_KEY" --entitlements child.plist "$FRAMEWORKS_PATH/$APP Helper EH.app/"
codesign --deep -fs "$APP_KEY" --entitlements child.plist "$FRAMEWORKS_PATH/$APP Helper NP.app/"
if [ -d "$FRAMEWORKS_PATH/Squirrel.framework/Versions/A" ]; then
# non-MAS 빌드 서명
codesign --deep -fs "$APP_KEY" --entitlements child.plist "$FRAMEWORKS_PATH/Mantle.framework/Versions/A"
codesign --deep -fs "$APP_KEY" --entitlements child.plist "$FRAMEWORKS_PATH/ReactiveCocoa.framework/Versions/A"
codesign --deep -fs "$APP_KEY" --entitlements child.plist "$FRAMEWORKS_PATH/Squirrel.framework/Versions/A"
fi
codesign -fs "$APP_KEY" --entitlements parent.plist "$APP_PATH"
codesign -s "$APP_KEY" -f --entitlements child.plist "$FRAMEWORKS_PATH/Electron Framework.framework/Versions/A/Electron Framework"
codesign -s "$APP_KEY" -f --entitlements child.plist "$FRAMEWORKS_PATH/Electron Framework.framework/Versions/A/Libraries/libffmpeg.dylib"
codesign -s "$APP_KEY" -f --entitlements child.plist "$FRAMEWORKS_PATH/Electron Framework.framework/Versions/A/Libraries/libnode.dylib"
codesign -s "$APP_KEY" -f --entitlements child.plist "$FRAMEWORKS_PATH/Electron Framework.framework"
codesign -s "$APP_KEY" -f --entitlements child.plist "$FRAMEWORKS_PATH/$APP Helper.app/Contents/MacOS/$APP Helper"
codesign -s "$APP_KEY" -f --entitlements child.plist "$FRAMEWORKS_PATH/$APP Helper.app/"
codesign -s "$APP_KEY" -f --entitlements child.plist "$FRAMEWORKS_PATH/$APP Helper EH.app/Contents/MacOS/$APP Helper EH"
codesign -s "$APP_KEY" -f --entitlements child.plist "$FRAMEWORKS_PATH/$APP Helper EH.app/"
codesign -s "$APP_KEY" -f --entitlements child.plist "$FRAMEWORKS_PATH/$APP Helper NP.app/Contents/MacOS/$APP Helper NP"
codesign -s "$APP_KEY" -f --entitlements child.plist "$FRAMEWORKS_PATH/$APP Helper NP.app/"
codesign -s "$APP_KEY" -f --entitlements child.plist "$APP_PATH/Contents/MacOS/$APP"
codesign -s "$APP_KEY" -f --entitlements parent.plist "$APP_PATH"
productbuild --component "$APP_PATH" /Applications --sign "$INSTALLER_KEY" "$RESULT_PATH"
```
@ -96,11 +95,31 @@ productbuild --component "$APP_PATH" /Applications --sign "$INSTALLER_KEY" "$RES
문서를 참고하여 기본적인 개념을 이해해야 합니다. 그리고 자격(plist) 파일에
어플리케이션에서 요구하는 권한의 키를 추가합니다.
### 어플리케이션 업로드하고 심사용 앱으로 제출
### 어플리케이션 업로드
어플리케이션 서명을 완료한 후 iTunes Connect에 업로드하기 위해 Application Loader를
사용할 수 있습니다. 참고로 업로드하기 전에 [레코드][create-record]를 만들었는지
확인해야 합니다. 그리고 [심사를 위해 앱을 제출][submit-for-review]할 수 있습니다.
확인해야 합니다.
### `temporary-exception`의 사용처 설명
어플리케이션을 샌드박싱할 때 `temporary-exception` 엔트리가 자격에 추가되며
[어플리케이션 샌드박스 임시 예외 적용][temporary-exception] 문서에 따라
왜 이 엔트리가 필요한지 설명해야 합니다:
> Note: If you request a temporary-exception entitlement, be sure to follow the
guidance regarding entitlements provided on the iTunes Connect website. In
particular, identify the entitlement and corresponding issue number in the App
Sandbox Entitlement Usage Information section in iTunes Connect and explain why
your app needs the exception.
아마 제출하려는 어플리케이션이 Chromium 브라우저를 기반으로 만들어졌고, 또한
멀티-프로세스 구조를 위해 Mach 포트를 사용하는 것도 설명해야 할 수 있습니다. 하지만
여전히 이러한 문제 때문에 어플리케이션 심사에 실패할 수 있습니다.
### 어플리케이션을 심사에 제출
위 과정을 마치면 [어플리케이션을 심사를 위해 제출][submit-for-review]할 수 있습니다.
## MAS 빌드의 한계
@ -117,7 +136,7 @@ productbuild --component "$APP_PATH" /Applications --sign "$INSTALLER_KEY" "$RES
* 어플리케이션이 DNS의 변경을 감지하지 못할 수 있습니다.
또한 어플리케이션 샌드박스 개념으로 인해 어플리케이션에서 접근할 수 있는 리소스는
엄격하게 제한되어 있습니다. 자세한 내용은 [App Sandboxing][app-sandboxing] 문서를
엄격하게 제한되어 있습니다. 자세한 내용은 [앱 샌드박싱][app-sandboxing] 문서를
참고하세요.
## Electron에서 사용하는 암호화 알고리즘
@ -164,5 +183,5 @@ ERN의 승인을 얻는 방법은, 다음 글을 참고하는 것이 좋습니
[create-record]: https://developer.apple.com/library/ios/documentation/LanguagesUtilities/Conceptual/iTunesConnect_Guide/Chapters/CreatingiTunesConnectRecord.html
[submit-for-review]: https://developer.apple.com/library/ios/documentation/LanguagesUtilities/Conceptual/iTunesConnect_Guide/Chapters/SubmittingTheApp.html
[app-sandboxing]: https://developer.apple.com/app-sandboxing/
[issue-3871]: https://github.com/electron/electron/issues/3871
[ern-tutorial]: https://carouselapps.com/2015/12/15/legally-submit-app-apples-app-store-uses-encryption-obtain-ern/
[temporary-exception]: https://developer.apple.com/library/mac/documentation/Miscellaneous/Reference/EntitlementKeyReference/Chapters/AppSandboxTemporaryExceptionEntitlements.html

View file

@ -1,6 +1,6 @@
# 온라인/오프라인 이벤트 감지
온라인/오프라인 이벤트는 다음 예제와 같이 더러 프로세스에서 표준 HTML5 API를 이용하여
온라인/오프라인 이벤트는 다음 예제와 같이 더러 프로세스에서 표준 HTML5 API를 이용하여
구현할 수 있습니다.
_main.js_

View file

@ -16,23 +16,23 @@ Electron은 실행될 때 __메인 프로세스__ 로 불리는 `package.json`
호출합니다. 이 스크립트는 메인 프로세스에서 작동합니다. GUI 컴포넌트를 조작하거나 웹
페이지 창을 생성할 수 있습니다.
### 더러 프로세스
### 더러 프로세스
Electron이 웹페이지를 보여줄 때 Chromium의 multi-processes 구조도 같이 사용됩니다.
Electron 프로세스 내에서 작동하는 웹 페이지를 __더러 프로세스__ 라고 불립니다.
Electron 프로세스 내에서 작동하는 웹 페이지를 __더러 프로세스__ 라고 불립니다.
보통 일반 브라우저의 웹 페이지들은 샌드박스가 적용된 환경에서 작동하며 네이티브
리소스에는 접근할 수 없도록 되어 있습니다. 하지만 Electron은 웹 페이지 내에서 Node.js
API를 사용하여 low-level 수준으로 운영체제와 상호작용할 수 있습니다.
### 메인 프로세스와 더러 프로세스의 차이점
### 메인 프로세스와 더러 프로세스의 차이점
메인 프로세스는 `BrowserWindow` Class를 사용하여 새로운 창을 만들 수 있습니다.
`BrowserWindow` 인스턴스는 따로 분리된 프로세스에서 랜더링 되며 이 프로세스를 랜더러
프로세스라고 합니다. `BrowserWindow` 인스턴스가 소멸할 때 그 창의 더러 프로세스도
`BrowserWindow` 인스턴스는 따로 분리된 프로세스에서 렌더링 되며 이 프로세스를 렌더러
프로세스라고 합니다. `BrowserWindow` 인스턴스가 소멸할 때 그 창의 더러 프로세스도
같이 소멸합니다.
메인 프로세스는 모든 웹 페이지와 랜더러 프로세스를 관리하며 랜더러 프로세스는 각각의
메인 프로세스는 모든 웹 페이지와 렌더러 프로세스를 관리하며 렌더러 프로세스는 각각의
프로세스에 고립되며 웹 페이지의 작동에만 영향을 끼칩니다.
웹 페이지 내에선 기본적으로 네이티브 GUI와 관련된 API를 호출할 수 없도록 설계 되어
@ -40,7 +40,7 @@ API를 사용하여 low-level 수준으로 운영체제와 상호작용할 수
리소스를 누수시킬 수 있기 때문입니다. 꼭 웹 페이지 내에서 API를 사용해야 한다면 메인
프로세스에서 그 작업을 처리할 수 있도록 메인 프로세스와 통신을 해야 합니다.
Electron에는 메인 프로세스와 더러 프로세스 사이에 통신을 할 수 있도록
Electron에는 메인 프로세스와 더러 프로세스 사이에 통신을 할 수 있도록
[ipc](../api/ipc-renderer.md) 모듈을 제공하고 있습니다.
또는 [remote](../api/remote.md) 모듈을 사용하여 RPC 스타일로 통신할 수도 있습니다.
또한 FAQ에서 [다양한 객체를 공유하는 방법](share-data)도 소개하고 있습니다.

View file

@ -12,7 +12,7 @@ Windows 7 이후 버전만 지원됩니다. Windows Vista에서도 작동할 수
테스트가 완료되지 않았습니다.
윈도우용 바이너리는 `x86``x64` 모두 제공됩니다. 그리고 `ARM` 버전 윈도우는 아직
지원하지 않습니다. (역주: 추후 지원할 가능성이 있습니다)
지원하지 않습니다.
### Linux

View file

@ -16,9 +16,9 @@ Electron 기반 어플리케이션을 Travis, Circle, Jenkins 또는 유사한
그리고, 가상 xvfb 스크린을 생성하고 DISPLAY라고 불리우는 환경 변수를 지정합니다.
Electron의 Chromium은 자동적으로 `$DISPLAY` 변수를 찾습니다. 따라서 앱의 추가적인
다른 설정이 필요하지 않습니다. 이러한 작업은 Paul Betts의
[xfvb-maybe](https://github.com/paulcbetts/xvfb-maybe)를 통해 자동화 할 수
있습니다: `xfvb-maybe`를 테스트 커맨드 앞에 추가하고 현재 시스템에서 요구하면
이 작은 툴이 자동적으로 xfvb를 설정합니다. Windows와 Mac OS X에선 간단히 아무 작업도
[xvfb-maybe](https://github.com/paulcbetts/xvfb-maybe)를 통해 자동화 할 수
있습니다: `xvfb-maybe`를 테스트 커맨드 앞에 추가하고 현재 시스템에서 요구하면
이 작은 툴이 자동적으로 xvfb를 설정합니다. Windows와 Mac OS X에선 간단히 아무 작업도
하지 않습니다.
```
@ -45,7 +45,7 @@ install:
### Jenkins
Jenkins는 [Xfvb 플러그인이 존재합니다](https://wiki.jenkins-ci.org/display/JENKINS/Xvfb+Plugin).
Jenkins는 [Xvfb 플러그인이 존재합니다](https://wiki.jenkins-ci.org/display/JENKINS/Xvfb+Plugin).
### Circle CI