---

前言

在最近的学习中，我接触了 Electron 这个前端框架，尽管学习进程断断续续，但我仍想分享一下我对它的了解。本文将带着真正小白的视角，向大家介绍 Electron 是什么、它的应用场景、学习方法以及为我们带来的好处。

---

一、Electron是什么

Electron是什么呢？它是一个框架，框架大家应该都明白吧。框架就像是一套工具箱，里面有很多工具可以帮助程序员更快、更方便地编写应用程序。我们需要按照既定的规则使用这些工具就可以了。（所以学习框架很容易，就是按照作者的规则来编写代码，基础功能就实现啦）

1.官网介绍

我们来看官网如何介绍自己吧

Electron是一个使用 JavaScript、HTML 和 CSS 构建桌面应用程序的框架。 嵌入 Chromium 和 Node.js 到 二进制的 Electron 允许您保持一个 JavaScript 代码代码库并创建 在Windows上运行的跨平台应用 macOS和Linux——不需要本地开发 经验。

2.小白介绍

Electron是一个前端框架，可用于构建跨平台的桌面应用程序，桌面应用程序指的是可以在电脑上安装的软件（如QQ、浏览器、酷狗音乐等）。与Java、C++等语言相同，前端技术也可用于桌面应用程序的开发。开发者可使用JavaScript、HTML和CSS等前端基础技术，结合Node.js进行开发。最重要的是，使用Electron开发的桌面应用程序，可以在Windows、macOS和Linux系统上无缝运行，实现跨平台开发。

我们可以使用 HTML 和 CSS 创建一个漂亮的用户界面，使用 JavaScript 处理用户输入和数据，使用 Node.js 处理系统调用和后台任务等等，使用Electron 构建桌面应用程序就像在编写网页一样，相当容易上手。

二、Electron开发了哪些应用

哪些我们熟知的软件是Electron开发的呢？

• Visual Studio Code：微软推出的跨平台轻量级代码编辑器。对于前端小伙伴来说，vscode并不陌生，没错，它是使用了Electron框架。
• Skype：微软推出的跨平台在线通讯工具，支持语音和视频通话。小伙伴的window系统中就有，大家也不陌生吧。
• Postman：跨平台的API开发和测试工具。测试人员/开发人员测试的利器。
• 微信开发者工具：为开发者提供的用于微信小程序开发的开发工具。微信公众号/小程序开发人员肯定知道。
• 迅雷X：据说 10.1版本开始，采用Electron软件框架完全重写了迅雷主界面。

还有钉钉、网易云音乐、有道翻译、Typora（Markdown编辑器），据说都是Electron的影子。

三、Electron的优势在哪里

1.优势

很多著名的桌面应用程序都在使用Electron，那么它有哪些优势呢？

• 跨平台支持：首先便是跨平台，Electron框架可在主流的操作系统（例如Windows、Mac OS和Linux等）上运行，可以有效地减少开发者在不同平台上开发应用程序的工作量和时间。一套代码多平台运行，这点很重要。
• 前端技术支持：通过使用HTML、CSS和JavaScript等前端技术栈进行开发，拥有大量的UI组件和模板，开发出来的桌面应用界面更加美观、交互体验更好。
• 本地能力支持：Electron 除了支持 Web API，而且还允许调用很多操作系统底层 API 来访问计算机的硬件设备，甚至可以自己用 C++、Go 来编写本地模块，可以完成很多 Web 应用无法做到的事情。
• 调试测试支持：Electron框架开发的应用程序是基于Chrome内核的，可以直接使用Chrome内核的开发者工具进行调试和测试，提高了开发效率。
• 自动更新支持：Electron应用程序在发布后可以自动更新，这意味着当有新版本可用时，用户会自动收到更新提示，无需手动下载和安装更新文件。

2.带给我们什么优势

多学习肯定可以为我们带来一定的竞争优势的。首先一些企业是有开发桌面应用的需求的，之前开发桌面应用需要专门技术人员，web网站需要专门技术人员，现在web开发就可以搞定，而且应用还是跨平台的。老板会很喜欢的。

还能有更高的开发效率和产出效率。开发者利用Electron框架可以快速构建出符合需求的桌面应用程序，同时也能够减少应用程序中与相关企业数据和功能的代码量，降低开发难度。

作为一名web开发者，如果学会开发桌面应用，会非常显著地提升自己的竞争力，目前国内外一些著名的软件都是使用Electron开发，这个不能忽视，说明它的市场份额逐步增大。

四、Electron如何学习

1.前置知识

学习Electron框架，需要有一些技术的储备：

• Web前端技术：Electron应用程序是基于前端技术进行构建的，能够使用HTML、CSS、JavaScript等Web技术实现应用程序。

• Node.js和npm：Node.js是一个基于JavaScript的后端编程语言，是Electron框架的基础之一。npm可以用于安装和管理Node.js环境中使用的包和库。

• 前端框架：了解一些流行的前端框架，如React、Vue.js、Angular等，这有助于更好地应用Electron框架开发出更优质的桌面应用程序。

总之，掌握Electron技术栈前需要具备前端编程技术、Node.js环境和npm包管理技术等相关编程语言和工具基础知识，同时也需要进行深入的操作系统和调试工具学习。

2.学习建议

首先是掌握web前端基础技术，包括HTML、CSS和JavaScript，然后是理解和使用Node.js和npm，要注意Electron在底层基于Node.js，要是能理解Node.js的工作原理以及npm的应用就更好了。

然后就是选择比较细致的教程，但是不要忽略官网，官网才是根本，有详细的文档。

一般教程最后都会实现一个小demo，学习完后，自己可以设计一个小型应用，以最佳实践方式真正理解和掌握Electron的知识。