Electron

AtomはElectronで作られています。
http://electron.atom.io/

Electronのインストール

> lesson\MyApp>npm init -y
> npm i electron-prebuilt --save-dev

package.jsの編集

{
  "name": "MyApp",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "electron index.js",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "electron-prebuilt": "^1.4.8"
  }
}
'use strict';

// index.js (main process)
// -GUI(renderer process)
// -GUI(renderer process)
// -GUI(renderer process)

const electron = require('electron');
const app = electron.app;
const BrowserWindow = electron.BrowserWindow;

let mainWindow;

app.on('ready', function(){

  mainWindow = new BrowserWindow({width: 600, height: 400});
  mainWindow.loadURL('file://' + __dirname + '/index.html');
  mainWindow.webContents.openDevTools();
  mainWindow.on('closed', function(){
    mainWindow = null;
  });
});

index.html

<!DOCTYPE html>
<html lang="ja">
<head>
	<meta charset="UTF-8">
	<title>Quotes!</title>
	<style>
	body{
		font-family: Verdana, sans-serif;
		padding: 10px;
		background: skyblue;
	}
	p {
		color: #fff;
		font-size: 36px;
		margin: 0;
		padding: 0;
	}
	</style>
</head>
<body>
	<p id="quote">Just do it!</p>
</body>
</html>

electronの起動

> npm start