Electron是什么？怎樣安裝和運行Electron軟件

Electron(原名為Atom Shell)是GitHub開發(fā)的一個開源框架。它通過使用Node.js和Chromium的渲染引擎完成**跨平臺的桌面GUI應用程序的開發(fā)。Electron 現(xiàn)已被多個開源Web應用程序用于前端與后端的開發(fā)，著名項目包括 GitHub 的 Atom 、微軟的 Visual Studio Code 和騰訊的QQNT。

Electron并不是一門新的技術，自 2013 年開始至今已有 10 年歷史了，最初是由 GitHub 團隊開發(fā)，現(xiàn)由 OpenJS 基金會負責維護。

1. 安裝 Electron Fiddle

Electron Fiddle [下載地址](https://www.electronjs.org/zh/fiddle)，下載符合各自操作系統(tǒng)的版本，正常安裝即可。

打開 Electron Fiddle 后可以看到自動創(chuàng)建了 Electron 項目的模板，左側是文件列表，右側是文件的內容，可以簡單的看到Electron 的項目代碼是由 HTML、CSS、JavaScript 構成。

2. 運行 Electron 項目

點擊 Electron Fiddle 工具欄中的 【Run】按鈕：

3. 修改 Electron 項目代碼

- index.html 是項目的布局結構

- style.css 是項目布局樣式

- renderer.js 是運行在瀏覽器環(huán)境

- preload.js 是運行在瀏覽器環(huán)境

- main.js 是運行在 Node 環(huán)境

關于 proload.js 和 main.js 的作用在后面會詳細介紹，當前需要體會到 index.html、style.css 和renderer.js 的作用。

注：默認情況下每次打開 Electron Fiddle 都會重新的生成項目模板，代碼模板可以以鏈接形式進行分享。

上面的內容的主旨內容是要知道 Electron 項目的代碼使用的是 HTML、CSS、JavasScript 和 Node.js 相關的技術。