| 背景 | 开发 | 开发难题 |
|---|---|---|
| What is Electron | Prereqs | Stay in touch |
| Why is this important | Two Processes | Put it all Together |
| How,even? | Main Process | Packaging |
| What is developing like？ | Renderer Process | More resources |
| ·· | Think of it like this | ·· |
什么是electron？
Electron 是一个库，您可以使用它来使用JavaScript、HTML 和 CSS构建桌面应用程序。这些应用程序可以打包在 Mac、Windows 和 Linux 计算机上运行，也可以放在 Mac 和 Windows 应用商店中。
定义
- JavaScript、HTML 和 CSS是网络语言，这意味着它们是网站的构建块，Chrome 等浏览器知道如何将这些代码转化为您看到的可视图形。
- Electron 是一个库Electron 是您可以重复使用而不必自己编写的代码。你用它来构建你的项目。
资源：
- 基于 Electron 构建的应用程序
- Electron API 演示（看看你可以用 Electron 做什么）
为什么这很重要？
通常，每个操作系统的桌面应用程序都是用各自的母语编写的。这可能意味着让三个团队编写您的应用程序的三个版本。Electron 使您可以使用 Web 语言编写一次应用程序。
下一篇：怎么，甚至？
定义：
- 本机（操作系统）语言这些是主要操作系统（主要）构建的语言：Mac、Objective C；Linux，C；视窗，C++。
怎么，甚至？
Electron 将Chromium和Node.js与一组用于本地操作系统功能的自定义API相结合，例如打开文件对话框、通知、图标等。
下一篇：发展是怎样的？
定义：
- API应用程序接口描述了一组可供您使用库的函数。
- Chromium由 Google 创建，这是 Google 的浏览器 Chrome 使用的开源库。
- Node.js（或 Node） 用于在服务器上编写 JavaScript、访问文件系统和网络（您的计算机也是服务器！）的工具。
资源：
发展如何？
使用 Electron 开发就像构建可以无缝使用 Node 的网页，或者构建一个 Node 应用程序，您可以在其中使用 HTML 和 CSS 构建界面。而且您只需要针对一种浏览器进行设计，即最新的 Chrome。
下一个：先决条件
定义：
- 在其中使用 Node这还不是全部！除了无处不在的完整 Node API，您还可以使用已经编写并托管在 npm（Node 的包管理器）上的超过 300,000 个模块。
- 一个浏览器并非所有的浏览器都是相同的，网页设计师和开发人员经常不得不加倍努力使一个站点在每个浏览器上看起来都一样。
- 最新的 Chrome使用超过 90% 的 ES2015、JavaScript 的最新更新以及 CSS 变量等酷炫功能。
资源：
先决条件
由于 Electron 的两个组件是网站和 JavaScript，因此在开始之前您需要在这两个方面都有经验。查看一些关于 HTML、CSS 和 JS 的教程并在您的计算机上安装 Node。
定义：
- 让我们变得真实，学习制作网站和编写 Node 不是一朝一夕的事情，但希望下面的链接可以帮助您入门。
下一个：两个过程
资源：
- 安装节点（选择 LTS 版本）
- NodeSchool 教程（试试 learnyounode）
- 猫的 JS（作者：Max Ogden）
- 学习编写 HTML 和 CSS（作者 Shay Howe）
- CSS Tricks（学习 CSS 最佳实践和技巧）
- Mozilla 开发者网络（就像网站和 JavaScript 的字典）
两个过程
Electron 有两种类型的进程：Main 和 Renderer。有一些模块适用于每个或两个进程。主进程更多是在幕后，而渲染器进程是应用程序中的每个窗口。
定义：
- 模块Electron 的 API 根据它们的功能组合在一起。例如，该
dialog模块具有用于打开文件、保存文件和警报等原生对话框的所有 API。
下一篇：主要流程
资源：
主要流程
主进程，通常是一个名为 的文件main.js，是每个 Electron 应用程序的入口点。它控制着应用程序的生命周期，从打开到关闭。它还调用原生元素并在应用程序中创建每个新的渲染器进程。内置完整的 Node API。
定义：
- 调用本机元素打开对话框和其他本机操作系统交互是资源密集型的，因此它在主进程中完成，使渲染器进程不中断。
Next:渲染器进程
资源：
渲染器进程
渲染器进程是应用程序中的一个浏览器窗口。与主进程不同，这些进程可以有多个，并且每个都是独立的。它们也可以被隐藏。通常一个被命名index.html。它们就像典型的 HTML 文件，但在 Electron 中，您也可以在这里获得整个 Node API，这与任何 Web 浏览器不同。
定义：
- 每个都是独立的每个渲染器进程都是一个单独的进程，这意味着一个崩溃不会影响另一个。
- 隐藏您可以将一个窗口设置为隐藏，并使用它在后台执行代码。
下一张：这样想
资源：
像这样想
在 Chrome（或其他网络浏览器）中，每个选项卡及其网页就像 Electron 中的单个渲染器进程。如果你关闭所有标签页，Chrome 仍然存在，这就像你的主进程，你可以打开一个新窗口或退出应用程序。
资源：
下一个：保持联系
保持联系
主进程和渲染器进程需要能够通信，因为它们都负责不同的任务。为此，有IPC，进程间通信。使用它在主进程和渲染器进程之间传递消息。
定义：
- IPC主进程和渲染器进程各有一个 IPC 模块可供使用。
下一个：把它们放在一起
把它们放在一起
Electron 应用程序类似于 Node 应用程序并使用package.json文件. 在那里你可以定义哪个文件是你的主要进程，从而定义 Electron 应该在哪里启动你的应用程序。然后该主进程可以创建渲染器进程，您将使用 IPC 在两者之间传递消息。
定义：
package.jsonfile这是 Node 应用程序中的一个通用文件，其中包含有关项目的元数据和依赖项列表。
下一篇：快速入门
快速开始
Electron 快速入门存储库是一个package.json带有. 此外，请使用您选择的框架查看模板的样板。main.js``index.html
下一个：包装
资源：
包装
构建应用程序后，您可以使用Mac、Windows 或 Linux的命令行工具将其打包。 electron-packager将此脚本添加到您的package.json. 查看以下资源，以在 Mac 和 Windows 应用商店中获取您的应用。
下一篇：更多资源
定义：
- 命令行工具这是一个程序，您可以通过在终端中向它传递命令来与之交互。
资源：
更多资源
这里的概念会让你走得很远，但当然还有更多，所以这里有其他资源。
资源：
- 完整的Electron文档--API文档
- Awesome Electron：工具、视频、组件、聚会
- Spectron（electron测试库）
- Devtron（检查您的 Electron 应用程序）
