Electron之旅

preface

Electron -> 使用 JavaScript，HTML 和 CSS 构建跨平台的桌面应用程序

• 两个核心:
  • main-process
  • render-process
• 三个部分:
  • Chromium: for making web pages
  • Node.js: for filesystems and networks
  • native apis: for three systems

官网教程 教程1 教程2

基础部分

构建一个demo：

$ git clone https://github.com/demopark/electron-api-demos-Zh_CN

$ cd electron-api-demos-Zh_CN

#安装依赖
$ npm install

$ npm start

Hello World!
We are using Node.js 12.16.3, Chromium 85.0.4183.93, and Electron 10.1.1.

Electron 在一开始会通过node去执行当前main.js文件

//electron是内置模块，提供了所有的API
const electron = require('electron')

//module to control application life
const app = electron.app 

//module to create native browser window
//如同在浏览器中打开一个新的窗口
const BrowserWidow = electron.BrowserWidow

//注册事件
app.on('ready', createWindow)

APP常用事件

• ready
• window-all-closed
• before-quit
• will-quit
• quit

js库

React 是一个用于构建用户界面的 JAVASCRIPT 库。

React 主要用于构建UI，很多人认为 React 是 MVC 中的 V（视图）。

React 起源于 Facebook 的内部项目，用来架设 Instagram 的网站，并于 2013 年 5 月开源。

Vue.js是一套构建用户界面的渐进式框架。

Vue 只关注视图层， 采用自底向上增量开发的设计。

Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。

Electron 可以让你使用纯 JavaScript 调用丰富的原生(操作系统) APIs 来创造桌面应用。 你可以把它看作一个 Node. js 的变体，它专注于桌面应用而不是 Web 服务器端。

应用架构：多窗口，单窗口

Electron在主进程和渲染进程中提供了大量API去帮助开发桌面应用程序， 在主进程和渲染进程中，你可以通过require的方式将其包含在模块中以此，获取Electron的API

other