01.课程介绍.mp4
02.内容综述：学完这门课程你能得到什么？.mp4
03.Electron介绍：为什么Electron这么火？.mp4
04.揭秘Electron架构原理：Chromium + Node-js是如何一起工作？.mp4
05.桌面端技术选型：如何选择合适的桌面端技术？.mp4
06.Electron开发准备：环境搭建及前期准备.mp4
07.第一个Electron应用：开发一个简单版的番茄钟（上）.mp4
08.第一个Electron应用：开发一个简单版的番茄钟（下）.mp4
09.与Web开发不同（一）：主进程与渲染进程.mp4
10.与Web开发不同（二）：进程间通信.mp4
11.与Web开发不同（三）：Native能力及原生GUI.mp4
12.与Web开发不同（四）： 释放前端想象力，基于Electron能做什么？.mp4
13.实战项目综述：整体需求分析.mp4
14.设计思路：做远程控制有几步？.mp4
15.项目架构与基础业务：Electron 与 React 框架结合.mp4
16.主页面基础业务：Real World IPC.mp4
17.傀儡端实现（一）：基于Electron能力捕获桌面视频流.mp4
18.傀儡端实现（二）：如何接收&响应指令？.mp4
19.傀儡端实现（三）：基于WebRTC传输视频流（上）.mp4
20.傀儡端实现（四）：基于WebRTC传输视频流（下）.mp4
21.信令服务：如何连接两端（上）.mp4
22.信令服务：如何连接两端（下）.mp4
23.指令传输实现：如何建立数据传输？.mp4
24.项目完善与总结（上）：App特性.mp4
25.项目完善与总结（下）：原生GUI.mp4
26.Electron 应用打包：从HTML到安装包.mp4
27.Electron 应用更新（一）：软件更新的痛点.mp4
28.Electron 应用更新（二）：线上项目如何更新？.mp4
29.Electron 质量监控：桌面端的质量抓手是什么？.mp4
30.使用原生能力：如何集成C++能力？.mp4
31.Electron 自动化测试：如何编写端到端测试？.mp4
32.Electron体验优化：如何优化白屏问题？.mp4
33.Electron客户端的安全：从XSS到RCE.mp4
34.Electron bad parts：辩证看待Electron技术.mp4
35.总结.mp4
有需要联系v；加客服窗口的联系方式
摘要：Electron开发实战2020是一篇深入浅出的Electron框架实战指南，旨在帮助开发者快速掌握Electron技术，实现跨平台桌面应用程序的开发。本文将从Electron框架概述、开发环境搭建、核心功能实现和实战案例解析四个方面进行详细阐述，为开发者提供全面的技术支持。
1、Electron框架概述
Electron是一个使用JavaScript、HTML和CSS来构建跨平台桌面应用程序的框架。它基于Chromium和Node.js，允许开发者使用Web技术来创建具有原生桌面应用程序体验的应用。Electron框架的出现，极大地简化了跨平台桌面应用程序的开发过程，使得开发者可以更加专注于业务逻辑的实现。
Electron框架具有以下特点：
1）跨平台：Electron支持Windows、macOS和Linux三大操作系统，使得开发者可以一次编写，多平台运行。
2）高性能：Electron基于Chromium和Node.js，具有高性能和良好的扩展性。
3）丰富的API：Electron提供了丰富的API，包括桌面操作、文件系统、网络通信等，方便开发者实现各种功能。
2、开发环境搭建
搭建Electron开发环境是进行实战开发的第一步。以下是搭建Electron开发环境的步骤：
1）安装Node.js：从Node.js官网下载并安装Node.js，确保版本兼容。
2）安装Electron：通过npm（Node.js包管理器）安装Electron。在命令行中执行以下命令：
npm install electron –save-dev
3）创建项目：创建一个新的文件夹，作为Electron项目的根目录。在根目录下创建一个名为“package.json”的文件，用于配置项目信息。
4）编写主进程代码：在项目根目录下创建一个名为“main.js”的文件，编写主进程代码，用于启动Electron应用。
5）编写渲染进程代码：在项目根目录下创建一个名为“index.html”的文件，编写渲染进程代码，用于展示用户界面。
3、核心功能实现
Electron框架提供了丰富的API，可以帮助开发者实现各种功能。以下是Electron框架的核心功能实现：
1）桌面操作：Electron提供了丰富的桌面操作API，如创建窗口、设置窗口大小、移动窗口等。
2）文件系统：Electron允许开发者访问文件系统，实现文件读取、写入、删除等操作。
3）网络通信：Electron支持WebSocket、HTTP等网络通信协议，方便开发者实现客户端和服务器之间的数据交互。
4）插件扩展：Electron支持插件扩展，开发者可以自定义插件，丰富应用功能。
4、实战案例解析
以下是一个简单的Electron实战案例，实现一个具有基本功能的桌面应用程序。
1）创建项目：按照上述步骤搭建Electron开发环境。
2）编写主进程代码：在“main.js”文件中，编写以下代码：
const { app, BrowserWindow } = require(‘electron’);
let mainWindow;
function createWindow() {
mainWindow = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true
},
});
mainWindow.loadFile(‘index.html’);
}
app.whenReady().then(createWindow);
app.on(‘window-all-closed’, () => {
if (process.platform !== ‘darwin’) {
app.quit();
}
});
app.on(‘activate’, () => {
if (BrowserWindow.getAllWindows().length === 0) {
createWindow();
}
});
3）编写渲染进程代码：在“index.html”文件中，编写以下代码：
<!DOCTYPE html>
<html>
<head>
<meta charset=”UTF-8″>
<title>Electron实战案例</title>
</head>
<body>
<h1>Electron实战案例</h1></p点击联系需要东西方神秘学学习资料，专业的咨询
联系我们
关注公众号
微信扫一扫
支付宝扫一扫
