跳到主要内容

本周项目:WordPress 桌面版

·4 分钟阅读

本周,我们与 Automattic 的人进行了交流,讨论了 WordPress 桌面版,这是一个用于管理 WordPress 内容的开源桌面客户端。


WordPress Apps

每个人都知道 WordPress,但什么是 WordPress 桌面版?

WordPress.com 桌面应用程序提供无缝的跨平台体验,使您可以专注于您的内容和设计,而不会有浏览器选项卡分散您的注意力,或者使您的网站处于搁置状态但可访问。结合我们的浏览器支持和移动应用程序,您可以在任何地方以任何方式构建您的网站,帮助您完成工作。

为什么要构建用于管理 WordPress 站点的桌面应用程序?难道它不应该全部基于 Web 吗?

它实际上使用的是您在浏览器中访问 WordPress.com 时获得的完全相同的技术。但是,它都是本地托管的,因此加载时间最短。借助诸如停靠在您的停靠栏、通知等原生功能,您可以真正专注于您的 WordPress 站点和博客。

您为什么选择在 Electron 上构建 WordPress 桌面版?

在 2015 年底,我们以 Calypso 的形式重建了大部分 WordPress.com,这是一个使用 React 的开源现代 JavaScript 应用程序。我们开始关注 Electron,并对 Calypso 进行了一些更改后,使其可以在本地运行。这是一种引人注目的体验,我们认为进一步开发它具有很大的价值。

我们有几个团队在开发 Calypso。要使用传统的桌面技术制作与此匹配的完整多平台 GUI 客户端,需要做更多的工作。通过使用 Electron,我们一个 2-4 人的小团队能够利用其他团队的努力,并在几个月内构建桌面应用程序。

在构建 WordPress 桌面版时,您面临哪些挑战?

我们很快就运行了应用程序的初始版本,但是调整它使其作为桌面应用程序发挥最佳性能需要更多的时间。该应用程序的一个巨大挑战是,您实际上是在您自己的计算机上运行 Calypso 的副本 - 它纯粹是 API 驱动的 UI。其中涉及大量的桥接工作,并且更改会反馈回 Calypso 本身。

此外,还花费了大量精力来为不同的平台打包应用程序 - 我们提供了 Windows、macOS 和 Linux 版本 - 并且存在足够的差异来使这项工作变得棘手。

当时,Electron 还比较新,我们不断遇到一些很快就得到修复的问题(有时是同一天!)

Electron 在哪些方面应该改进?

Electron 已经为桌面应用程序提供了我们所需的大部分功能,并且自我们开始使用它以来,它已经取得了快速进展。也就是说,在桌面应用程序中有些方面是理所当然的,例如拼写检查和查找/替换,这些方面使用 Electron 难以按原样复制。

我们也希望看到一些较新的 Chrome 技术也渗透到 Electron 中。我们特别热衷于尝试 WebVR。

您最喜欢 Electron 的哪些方面?

我们选择 Electron 的主要原因,也是它最大的优势,是非常活跃和开放的社区。Automattic 一直坚信开源。这是我们的核心原则之一,Electron 项目和社区遵循了许多非常开放和积极的核心信念。

WordPress 桌面版的下一步是什么?

我们模型的伟大之处在于,桌面应用程序可以从任何新的 Calypso 功能中受益 - 会不断改进。我们希望我们可以为应用程序添加其他功能,例如离线支持,这将真正使应用程序进入原生领域,以及更好的系统通知。

Automattic 是否有任何团队在开发其他 Electron 应用程序?

是的,在我们在桌面应用上努力之后,Simplenote 团队决定使用 Electron 为 Windows 和 Linux 构建桌面应用(已存在原生的 Mac 客户端)。 Simplenote Electron 应用也是开源的,可在 Github 上获取。

我们还有一个即将推出的 Raspberry Pi 集成,它也使用了 Electron。

如果这些听起来让你感兴趣,我们很乐意收到你的消息

有什么 Electron 技巧可能对其他开发者有用吗?

发布签名的桌面软件对我们来说是相对较新的过程,特别是对于 Windows。我们写了一篇文章,关于代码签名 Windows 应用,其中包括了流程以及我们为了正确完成它而经历的一些障碍。

本周项目:Dat

·7 分钟阅读

本周的特色项目是 Dat,一个获得资助的开源、去中心化工具,用于分发数据集。Dat 由一个地理分布式团队构建和维护,他们中的许多人帮助撰写了这篇文章。


A screenshot of the main view of dat-desktop, showing a few rows of shared
dats

首先,什么是 Dat?

我们希望将点对点和分布式系统中最好的部分带到数据共享中。我们从科学数据共享开始,然后开始扩展到研究机构、政府、公共服务和开源团队。

另一种思考方式是,它是一个类似于 Dropbox 或 BitTorrent Sync 的同步和上传应用,只不过 Dat 是开源的。我们的目标是成为一个强大、开源、非营利的数据共享软件,用于大型、小型、中型、小批量和大批量数据。

要使用 dat 命令行工具,您只需键入

dat share path/to/my/folder

然后 dat 将创建一个链接,您可以使用该链接将该文件夹发送给其他人 —— 没有中央服务器或第三方可以访问您的数据。与 BitTorrent 不同,也不可能嗅探到谁在共享什么(有关更多详细信息,请参阅 Dat 论文草案)。

现在我们知道什么是 Dat 了。Dat Desktop 如何融入其中?

Dat Desktop 是一种让无法或不想使用命令行的人访问 Dat 的方式。您可以在您的机器上托管多个 dat 并通过您的网络提供数据。

您可以分享一些很酷的用例吗?

DataRefuge + Project Svalbard

我们正在开发一个代号为 Project Svalbard 的项目,它与 DataRefuge 相关,这是一个致力于备份可能消失的政府气候数据的组织。Svalbard 以北极的斯瓦尔巴全球种子库命名,该种子库有一个大型地下植物 DNA 备份库。我们的版本是一个大型版本控制的公共科学数据集集合。一旦我们知道并信任元数据,我们就可以构建其他很酷的项目,例如分布式志愿者数据存储网络

加州公民数据联盟

CACivicData 是一个开源档案库,每天提供来自 CAL-ACCESS(加州追踪政治资金的数据库)的下载。他们每天发布,这意味着在他们的 zip 文件中托管大量重复数据。我们正在努力将他们的数据托管为 Dat 存储库,这将减少引用特定版本或更新到较新版本所需的麻烦和带宽。

Electron 更新

这个还不具体,但我们认为一个有趣的用例是将编译后的 Electron 应用放在 Dat 存储库中,然后使用 Electron 中的 Dat 客户端来提取已构建的应用二进制文件的最新增量,以节省下载时间,同时降低服务器的带宽成本。

谁应该使用 Dat Desktop?

任何想要通过 p2p 网络共享和更新数据的人。数据科学家、开放数据黑客、研究人员、开发人员。如果有人想到我们尚未想到的很酷的用例,我们非常乐于接受反馈。您可以访问我们的 Gitter 聊天,并向我们提出任何问题!

Dat 和 Dat Desktop 的下一步是什么?

用户帐户和元数据发布。我们正在开发一个 Dat 注册表 Web 应用,该应用将部署在 datproject.org 上,它基本上是“数据集的 NPM”,但需要注意的是,我们只是一个元数据目录,数据可以位于任何在线位置(与 NPM 或 GitHub 不同,所有数据都集中托管,因为源代码足够小,可以全部放入一个系统中)。由于许多数据集都很大,我们需要一个联合注册表(类似于 BitTorrent 跟踪器的工作方式)。我们希望让人们可以轻松地通过 Dat Desktop 在注册表中查找或发布数据集,从而使数据共享过程无摩擦。

另一个功能是多写者/协作文件夹。我们计划进行大型协作工作流程,可能带有分支,类似于 git,但围绕数据集协作设计。但我们仍在努力提高整体稳定性和标准化我们的协议!

为什么您选择在 Electron 上构建 Dat Desktop?

Dat 是使用 Node.js 构建的,因此它自然适合我们的集成。除此之外,我们的用户使用各种机器,因为科学家、研究人员和政府官员可能被迫为他们的机构使用某些设置 —— 这意味着我们需要能够定位 Windows 和 Linux 以及 Mac。Dat Desktop 可以轻松地实现这一点。

在构建 Dat 和 Dat Desktop 时,您遇到了一些什么挑战?

弄清楚人们想要什么。我们从表格数据集开始,但我们意识到这是一个有点复杂的问题,而且大多数人都不使用数据库。因此,在项目进行到一半时,我们将所有内容从头开始重新设计为使用文件系统,并且没有回头。

我们还遇到了一些通用的 Electron 基础设施问题,包括

  • 遥测 - 如何捕获匿名使用统计信息
  • 更新 - 设置自动更新有点零碎和神奇
  • 发布 - XCode 签名、在 Travis 上构建版本、进行 beta 构建,这些都是挑战。

我们还在 Dat Desktop 的“前端”代码中使用了 Browserify 和一些很酷的 Browserify Transforms(这有点奇怪,因为即使我们有原生的 require,我们仍然会捆绑 —— 但这是因为我们需要 Transforms)。为了更好地管理我们的 CSS,我们从 Sass 切换到使用 sheetify。它极大地帮助我们模块化了 CSS,并使我们的 UI 更容易使用具有共享依赖关系的面向组件的架构。例如,dat-colors 包含我们所有的颜色,并在我们所有项目之间共享。

我们一直很喜欢标准和最少的抽象。我们的整个界面都是使用常规 DOM 节点和一些辅助库构建的。我们已经开始将其中一些组件移动到 base-elements,一个低级可重用组件的库。与我们的大多数技术一样,我们会不断迭代它直到我们做得正确,但作为一个团队,我们觉得我们正在朝着正确的方向前进。

Electron 在哪些方面应该改进?

我们认为最大的痛点是原生模块。必须使用 npm 为 Electron 重建模块会增加工作流程的复杂性。我们的团队开发了一个名为 prebuild 的模块,该模块处理预构建的二进制文件,这对于 Node 来说效果很好,但 Electron 工作流程在安装后仍然需要一个自定义步骤,通常是 npm run rebuild。这很烦人。为了解决这个问题,我们最近切换到一种策略,将所有平台的所有编译二进制版本捆绑到 npm tarball 中。这意味着 tarball 会变得更大(尽管可以使用 .so 文件 - 共享库进行优化),但这种方法避免了运行安装后脚本,也完全避免了 npm run rebuild 模式。这意味着 npm install 第一次就能为 Electron 做正确的事情。

您最喜欢 Electron 的哪些方面?

API 似乎经过了深思熟虑,它相对稳定,并且在与上游 Node 版本保持同步方面做得很好,我们别无他求了!

有什么 Electron 技巧可能对其他开发者有用吗?

如果您使用原生模块,请尝试一下 prebuild

关注 Dat 开发的最佳方式是什么?

在 Twitter 上关注 @dat_project,或订阅我们的电子邮件通讯

本周项目:Ghost

·5 分钟阅读

本周我们与 Felix Rieseberg 进行了交流,他是 Slack 的桌面工程师,也是 Ghost Desktop 的维护者,Ghost Desktop 是 Ghost 出版平台的 Electron 客户端。


Ghost Desktop Screenshot

什么是 Ghost?

Ghost 是一个完全开源、可定制的平台,用于构建和运行现代在线出版物。我们为从 Zappos 到天空新闻的博客、杂志和记者提供支持。

它与其他出版平台有何不同?

Ghost 成立于 2013 年 4 月,在一次非常成功的 Kickstarter 众筹活动之后,旨在创建一个专注于专业出版的新平台。我们的使命是为世界各地的独立记者和作家创建最好的开源工具,并对在线媒体的未来产生真正的影响。它提供了更简单、更专注的体验:我们的编辑器完全围绕提供最佳的写作体验而设计。

与一直以来经典的 WordPress 相比,它提供了更简单、更精简的体验——它更容易设置和维护,自带所有重要功能,而且速度更快。与其他在线平台相比,Ghost 让作者完全拥有并控制其内容,允许完全自定义,并使作者能够围绕其出版物建立业务。

Ghost 是一家营利性公司吗?

这对我们很重要:Ghost 是一个独立的非营利组织。我们为现代新闻和博客构建出版工具,因为我们相信言论自由很重要。我们的软件是在 免费开源许可 下发布的,我们的商业模式是 完全透明的,我们的法律结构意味着我们赚取的 100% 的资金都将再投资于使 Ghost 变得更好。

什么是 Ghost Desktop?

Ghost Desktop 允许作者一次管理多个博客,并专注于他们的写作。像常见的写作快捷方式这样的简单操作在浏览器中无法实现,但在我们的桌面应用程序中可以使用。它允许其他应用程序通过 深度链接 直接与博客通信。

什么是 Ghost for Journalism?

今年,我们非常高兴能将我们整个 10 人全职 Ghost 团队投入到帮助三个独立出版物的发展中,并为他们的工作投入 45,000 美元的资源。我们称之为 Ghost for Journalism

我们一直在构建 Ghost,作为网络上下一个伟大的独立出版商平台已经大约三年半了,我们现在已经达到了一个非常有趣的拐点。我们开始这段旅程是为了创建一个简单、设计良好的博客平台,几乎任何人都可以使用。这始终是第一步。

从长远来看,我们希望 Ghost 成为世界上最好的新闻业的杰出平台,这意味着我们需要构建吸引这些人的功能。今年,我们正在做出非常清醒的决定,专注于这一点。

你为什么选择在 Electron 上构建 Ghost Desktop?

Ghost 在后端和前端都使用 JavaScript 和 Node.js,因此能够利用相同的技术和技能使我们的团队能够更快地行动,构建更多,并最终提供更好的体验。此外,能够在 macOS、Windows 和 Linux 版本的应用程序之间共享超过 95% 的代码使我们能够专注于构建出色的核心用户体验,而无需为每个平台维护一个代码库。

在构建 Ghost Desktop 时你遇到过哪些挑战?

拼写检查可能仍然是最难提供的服务之一——我们可以轻松地利用众多在线服务之一,但在保护用户隐私和自主权的同时,以多种语言正确地进行拼写检查并非易事。

Electron 在哪些方面应该改进?

我们希望看到 Electron 将操作系统的本机拼写检查功能引入他们的应用程序。我们梦想着一个 <input> 字段接收与 NSTextView 相同服务的世界,但我们也清楚地知道这有多么困难。

您最喜欢 Electron 的哪些方面?

JavaScript 以其庞大的生态系统而闻名,其中涉及无数的工具和框架——但它为我们带来的便利是难以言表的。使用 Electron 构建应用程序仅比构建 Web 应用程序略微困难,这是一项了不起的壮举。

Ghost 完成了吗?如果没有,接下来会发生什么?

Ghost Desktop 也是一个正在进行的项目——我们离完成还很远。我们一直在谈论为用户带来完整的离线模式,而且我们越来越接近了。其他值得注意的工作领域是扩展和与其他文本编辑应用程序(如 Word 或 Atom)的集成,最终允许人们使用他们喜欢的工具编写帖子。总的来说,一旦我们发布了离线模式功能,我们就会寻求与操作系统的更深层次的集成。如果这听起来对你有吸引力,加入我们

你最喜欢的一些 Electron 应用程序有哪些?

我很喜欢 KapFelonyVisual Studio Code

👻

本周项目:Beaker 浏览器

·4 分钟阅读

本周我们采访了 Paul FrazeeBeaker 浏览器的创建者。Beaker 是一款实验性的点对点 Web 浏览器,它使用 Dat 协议从用户的设备托管站点。


什么是 Beaker?你为什么创建它?

Beaker 是一款参与式浏览器。它是为独立黑客打造的浏览器。

Web 是闭源的。如果你想影响社交媒体的运作方式,你必须在 Facebook 或 Twitter 工作。对于搜索,则是 Google。控制权掌握在公司手中,而不是用户自己手中。

使用 Beaker,我们有了一个新的 Web 协议:去中心化档案传输。“Dat”。它按需免费创建站点,然后从设备共享它们。无需服务器。这是我们的创新之处。

Beakers Protocols

当你在 Beaker 中访问 Dat 站点时,你会下载这些文件。该站点永远属于你。你可以保存它、派生它、修改它,并免费共享你的新版本。它完全是开源的。

所以这就是它的意义:我们正在为开源网站制作浏览器。我们希望它成为社交黑客的工具包。

谁应该使用 Beaker?

黑客。改装者。创意类型。喜欢修补的人。

如何创建一个使用 Dat 的新项目?

我们有一个 名为 bkr 的命令行工具,它有点像 git + npm。这是创建站点

$ cd ~/my-site
$ bkr init
$ echo "Hello, world!" > index.html
$ bkr publish

这是派生站点

$ bkr fork dat://0ff7d4c7644d0aa19914247dc5dbf502d6a02ea89a5145e7b178d57db00504cd/ ~/my-fork
$ cd ~/my-fork
$ echo "My fork has no regard for the previous index.html!" > index.html
$ bkr publish

然后这些站点会从你的浏览器中托管出去。这有点像 BitTorrent;你在 P2P 网格中共享站点。

如果你想要 GUI,我们在浏览器中内置了一些基本工具,但我们正在将这些工具推入用户领域。这一切都将是可修改的用户应用程序。

你为什么选择在 Electron 上构建 Beaker?

对于这个项目来说,这是显而易见的。如果我自己派生 Chrome,我现在就要写 C++ 了!没人想那样做。我了解 Web 堆栈,并且可以使用它快速工作。这毫不费力。

事实是,我不确定没有 Electron 我是否能完成这一切。它是一款很棒的软件。

在构建 Beaker 时你遇到过哪些挑战?

其中一半是在摆弄这些工具,并弄清楚我能做多少。

制作浏览器本身非常容易。Electron 实际上是制作浏览器的工具包。...除了浏览器标签;我花了很长时间才搞定。我最终崩溃并学会了如何制作 SVG。它看起来好多了,但我花了 3 或 4 次迭代才把它搞定。

Electron 在哪些方面应该改进?

如果我可以在 webview 中停靠开发人员工具,那就太好了。

接下来 Beaker 会有哪些新进展?

Dat 站点的安全 DNS 名称。一种可社交配置的 URL 方案,称为 “应用方案”。 更多 Dat API。

对于可能对项目贡献感兴趣的朋友,Beaker 在哪些方面需要帮助?

我们有很多未解决的问题。不要害怕联系我。在 freenode 上加入 #beakerbrowser。我们维护了一个贡献者页面,我们会把你加进去。如果你来奥斯汀,我会请你喝啤酒。

有什么 Electron 技巧可能对其他开发者有用吗?

  1. 使用现成的构建工具。相信我,你不会想自己解决问题。使用 electron-builder。使用样板代码库。
  2. 如果你需要在 Electron 代码库中提出问题,请尽力使其易于重现。你会更快地得到回复,团队也会感激你的。更好的是,尝试自己修复它。看看内部结构其实挺有趣的。
  3. 至少通读一遍所有的指南和高级文档。
  4. 不要再构建浏览器了,市场已经饱和了。

本周项目:Kap

·7 分钟阅读

Electron 社区正在快速发展,人们正在以惊人的速度创建强大的新应用和工具。为了庆祝这种创造性的势头并让社区了解这些新项目,我们决定开始一个每周博客系列,重点介绍值得关注的 Electron 相关项目。


这篇文章是该系列的第一篇,主要介绍 Kap,这是一款由 Wulkano 构建的开源屏幕录制应用,Wulkano 是一个由自由设计师和开发人员组成的地理分布式团队。

Kap Screencast

什么是 Kap?

Kap 是一款开源屏幕录像机,主要为设计师和开发人员设计,以便轻松捕捉他们的工作。人们用它来分享动画原型、记录错误、创建有趣的 GIF 以及介于两者之间的一切。

我们看到各个年龄段和背景的人在教育环境、屏幕录像、教程中使用它……不胜枚举。甚至用于创建生产资源!我们对我们的小型副项目如此受欢迎感到非常震惊。

你们为什么构建它?

这是一个非常好的问题,毕竟市面上并不缺乏屏幕录像机!我们觉得其他替代方案要么太复杂、要么太昂贵、要么太有限。没有什么能恰好适合我们的日常需求。我们也认为,我们用来工作的工具是开源的,这样每个人都可以帮助塑造它们,这很好。构建 Kap 最终和我们没有做什么同样重要。一切都在细节中,小改进的积累最终成为了我们想要使用的工具的轮廓。

然而,也许最重要的是,Kap 已经成为我们放下烦恼,只是为了自己和像我们这样的人构建一些东西而获得乐趣的地方。创造一个你可以发泄、尝试新事物并享受你的手艺的环境非常重要。没有要求、没有压力、没有期望。设计师和开发人员应该进行副项目吗?当然应该。是的,他们应该。

你们为什么选择在 Electron 上构建 Kap?

有很多原因:

  • Web 技术
  • 团队的大多数人都是 Web 开发人员
  • 我们投资于 JavaScript
  • 它为更多人贡献打开了大门
  • Electron 本身是开源的
  • node_modules 的强大功能和易于维护的模块化
  • 跨平台可能性

我们认为应用的未来在浏览器中,但我们还没有完全实现。Electron 是走向未来旅程中的重要一步。它不仅使应用本身更易于访问,而且使其构建所用的代码也更易于访问。一个有趣的想法是,想象一个操作系统是浏览器,而选项卡本质上是 Electron 应用的未来。

此外,作为主要的 Web 开发人员,我们非常喜欢 JavaScript 的同构特性,即你可以在客户端、服务器和现在的桌面上运行 JS。使用 Web 技术(HTML、CSS 和 JS),许多事情都比原生技术简单得多:更快的原型设计、更少的代码、flexbox > 自动布局(macOS/iOS)。

在构建 Kap 时,你们面临的一些挑战是什么?

使用 Electron 可用的资源来录制屏幕是最大的挑战。它们的性能根本不足以满足我们的要求,并且在我们看来会导致项目失败。尽管这并非 Electron 本身的错误,但在原生开发和使用 Web 技术构建桌面应用之间仍然存在差距。

我们花了很多时间尝试解决 getUserMedia API 性能不佳的问题,这个问题源于 Chromium。我们开始制作 Kap 的主要目标之一是用 Web 技术构建整个应用。在尝试了一切方法使其正常工作(Retina 屏幕上的最低要求为 30 FPS)之后,我们最终不得不寻找其他解决方案。

我在代码库中看到了一些 Swift 代码。那是什么意思?

在被迫寻找 getUserMedia 的替代方案时,我们开始尝试 ffmpeg。除了是音频和视频转换的最佳工具之一,它还具有在几乎任何操作系统中录制屏幕的功能,并且我们能够录制出清晰的视频,满足我们在 Retina 屏幕上 30 FPS 的最低要求。问题是?性能是 "😩",CPU 使用率失控了。所以我们回到绘图板,讨论了我们的选择,并意识到我们必须做出妥协。这导致了 Aperture,我们自己的 macOS 屏幕录制库,用 Swift 编写。

Electron 在哪些方面应该改进?

我们都知道 Electron 应用可能会占用大量 RAM,但同样,这实际上是 Chromium 的问题。这是它的工作方式的一部分,并且它实际上取决于你正在运行的内容,例如 Kap 和 Hyper 通常使用少于 100MB 的内存。

我们看到的最大改进领域之一是有效负载,特别是 Electron 如何分发 Chromium。一个想法是拥有一个共享的 Electron 核心,并使应用安装程序检查系统上是否已存在该核心。

创建跨平台 Electron 应用可能会有更好的体验。现在,平台之间存在太多不一致、特定于平台的 API 以及缺少的功能,这使得你的代码库中充满了 if-else 语句。例如,vibrancy 仅在 macOS 上受支持,自动更新程序在 macOS 和 Windows 上的工作方式不同,甚至在 Linux 上都不受支持。透明度在 Linux 上是碰运气的,通常会失败。

调用本机系统 API 也应该更容易。Electron 附带了一组非常好的 API,但有时你需要它不提供的功能。创建本机 Node.js 插件是一个选项,但是使用起来很痛苦。理想情况下,Electron 会附带一个良好的 FFI API,例如 fastcall。这将使我们能够用 JavaScript 编写 Swift 部分。

您最喜欢 Electron 的哪些方面?

我们最喜欢的一点是,任何具有 Web 创建知识的人都可以构建和贡献多平台本机体验。更不用说在其上开发的轻松和乐趣、出色的文档以及蓬勃发展的生态系统。

从前端的角度来看,构建 Kap 感觉与使用浏览器 API 构建一个简单的网站没有什么不同。Electron 在使应用开发与 Web 开发类似(基本上相同)方面做得非常好。事实上如此简单,以至于不需要框架或类似的东西来帮助我们,只需干净且模块化的 JS 和 CSS。

我们也非常喜欢构建它的团队、他们的奉献精神和支持,以及他们维护的活跃且友好的社区。向大家致以拥抱!

Kap 的下一步是什么?

我们的下一步是审查该应用,为我们的 2.0.0 里程碑做准备,其中包括 React 重写以及对插件的支持,允许开发人员扩展 Kap 的功能!我们邀请大家关注该项目并在我们的 GitHub 代码库上做出贡献。我们正在倾听,并希望尽可能多地收到大家的反馈,请告诉我们如何让 Kap 成为最适合你的工具

什么是 Wulkano?

Wulkano 是一家设计工作室和数字集体,一个由远程技术专家组成的团队,他们喜欢在客户项目和我们自己的项目上合作。我们是一个由来自不同地方和背景的人组成的分布式但紧密的团队,在我们的虚拟办公室(恰好是基于 Electron 的 Slack!)中分享知识、想法、经验,但最重要的是分享有趣的 GIF 和模因。

有什么 Electron 技巧可能对其他开发者有用吗?

充分利用并参与到精彩的 社区 中,查看 Awesome Electron,浏览 示例 并善用优秀的 文档

Electron 简单示例

·2 分钟阅读

我们最近在 GitHub 总部为 Hackbright Academy 的成员举办了一场 Electron 黑客马拉松,这是一所位于旧金山,为女性开设的编程学校。为了帮助参与者快速开始他们的项目,我们自己的 Kevin Sawicki 创建了一些 Electron 示例应用程序。


如果您是 Electron 开发新手,或者还没有尝试过它,这些示例应用程序是一个很好的起点。它们很小,易于阅读,并且代码中包含大量注释来解释一切是如何工作的。

要开始使用,请克隆此存储库

git clone https://github.com/electron/simple-samples

要运行下面的任何应用程序,请更改到该应用程序的目录,安装依赖项,然后启动

cd activity-monitor
npm install
npm start

活动监视器

显示 CPU 系统、用户和空闲活动时间的甜甜圈图。

Screenshot

哈希

显示使用不同算法输入的文本的哈希值。

screenshot

镜像

以最大化尺寸播放计算机摄像头的视频,就像照镜子一样。包含一个可选的彩虹滤镜效果,该效果使用 CSS 动画。

价格

使用雅虎财经 API 显示石油、黄金和白银的当前价格。

screenshot

URL

在窗口中加载命令行上传递的 URL。

其他资源

我们希望这些应用程序能帮助您开始使用 Electron。以下是一些其他可供学习的资源

Electron 用户领域

·3 分钟阅读

我们在 Electron 网站上添加了一个新的 userland 部分,以帮助用户发现构成我们蓬勃发展的开源生态系统的人员、软件包和应用程序。


github-contributors

Userland 的起源

Userland 是软件社区中的人们聚集在一起分享工具和想法的地方。该术语起源于 Unix 社区,指的是在内核之外运行的任何程序,但今天它意味着更多。当今 JavaScript 社区的人们提到 userland 时,他们通常指的是 npm 包注册表。这是大多数实验和创新发生的地方,而 Node 和 JavaScript 语言(如 Unix 内核)保留了一个相对较小且稳定的核心功能集。

Node 和 Electron

像 Node 一样,Electron 拥有一小套核心 API。这些提供了开发多平台桌面应用程序所需的基本功能。这种设计理念使 Electron 保持为一个灵活的工具,而不会过度规定如何使用它。

Userland 是“核心”的对应部分,它使用户能够创建和共享扩展 Electron 功能的工具。

收集数据

为了更好地了解我们生态系统中的趋势,我们分析了 15,000 个依赖于 electronelectron-prebuilt 的公共 GitHub 存储库的元数据

我们使用了 GitHub APIlibraries.io API 和 npm 注册表来收集有关依赖项、开发依赖项、依赖项、软件包作者、存储库贡献者、下载计数、fork 计数、星标计数等的信息。

然后,我们使用这些数据生成以下报告

筛选结果

诸如 应用程序依赖项星标应用程序 之类的报告,其中列出了软件包、应用程序和存储库,它们都有一个文本输入,可用于筛选结果。

当您在此输入框中输入时,页面的 URL 会动态更新。这允许您复制表示特定 userland 数据片段的 URL,然后与其他人共享。

babel

更多内容即将推出

第一组报告仅仅是个开始。我们将继续收集有关社区如何构建 Electron 的数据,并将向网站添加新的报告。

所有用于收集和显示此数据的工具都是开源的

如果您对如何改进这些报告有任何想法,请在网站存储库上或在上面提到的任何存储库中打开一个问题,请告诉我们。

感谢您,Electron 社区,使 userland 成为今天的样子!

证书透明度修复

·2 分钟阅读

Electron 1.4.12 包含一个重要的补丁,该补丁修复了一个上游 Chrome 问题,其中一些 Symantec、GeoTrust 和 Thawte SSL/TLS 证书在 libchromiumcontent (Electron 的底层 Chrome 库)的构建时间起 10 周后被错误地拒绝。受影响站点上使用的证书没有问题,更换这些证书也无济于事。


在 Electron 1.4.0 — 1.4.11 中,在某个日期之后,使用这些受影响的证书的站点的 HTTPS 请求将因网络错误而失败。这会影响使用 Chrome 的底层网络 API 发出的 HTTPS 请求,例如 window.fetch、Ajax 请求、Electron 的 net API、BrowserWindow.loadURLwebContents.loadURL<webview> 标签上的 src 属性等。

将您的应用程序升级到 1.4.12 将防止发生这些请求失败。

注意:此问题是在 Chrome 53 中引入的,因此早于 1.4.0 的 Electron 版本不受影响。

影响日期

下面是每个 Electron 1.4 版本以及何时开始请求使用这些受影响的证书的站点的失败的日期表。

Electron 版本影响日期
1.3.x不受影响
1.4.0已失败
1.4.1已失败
1.4.2已失败
1.4.32016 年 12 月 10 日下午 9:00 (PST)
1.4.42016 年 12 月 10 日下午 9:00 (PST)
1.4.52016 年 12 月 10 日下午 9:00 (PST)
1.4.62017 年 1 月 14 日下午 9:00 (PST)
1.4.72017 年 1 月 14 日下午 9:00 (PST)
1.4.82017 年 1 月 14 日下午 9:00 (PST)
1.4.92017 年 1 月 14 日下午 9:00 (PST)
1.4.102017 年 1 月 14 日下午 9:00 (PST)
1.4.112017 年 2 月 11 日下午 9:00 (PST)
1.4.12不受影响

您可以通过将计算机的时钟提前,然后检查 https://symbeta.symantec.com/welcome/ 是否可以从中成功加载来验证您的应用程序的影响日期。

更多信息

您可以在以下位置阅读有关此主题、原始问题和修复的更多信息

2016 年 9 月:新应用

·3 分钟阅读

以下是 9 月份添加到网站的新 Electron 应用程序和演讲。


本网站通过社区的拉取请求更新新的应用聚会。您可以关注该存储库以获取新添加内容的通知,或者如果您对网站的所有更改不感兴趣,请订阅博客 RSS 订阅

如果您制作了一个 Electron 应用或主办了一次聚会,请提交一个拉取请求将其添加到网站,它将出现在下一轮汇总中。

新演讲

9 月份,GitHub 举办了 GitHub Universe 大会,该大会被誉为面向构建软件未来的人们的大会。会上有一些有趣的 Electron 演讲。

此外,如果您恰好在 12 月 5 日在巴黎,Zeke 将在 dotJS 2016 上进行 Electron 演讲

新应用

Pexels搜索完全免费的照片并将其复制到剪贴板
Timestamp一个更好的 macOS 菜单栏时钟,具有可自定义的日期/时间显示和日历
Harmony与 Spotify、Soundcloud、Play Music 和本地文件兼容的音乐播放器
uPhoneWebRTC 桌面电话
SealTalk由融云即时通讯云服务和即时通讯 SDK 驱动的即时消息应用
Infinity一种简易的演示制作方式
Cycligent Git Tool用于 Git 项目的简单、图形化 GUI
Foco通过 Foco 保持专注并提高工作效率
Strawberry使用一体化餐厅软件套件,更好地了解和服务终身食客。
Mixmax实时查看您电子邮件上的每一个操作。随时随地编写。
Firebase Admin一个 Firebase 数据管理工具
ANote一个简单的友好的 Markdown 笔记
Temps一个简单但智能的菜单栏天气应用程序
Amium一款将对话带到您的文件中的工作协作产品
Soube简单的音乐播放器
(Un)colored下一代桌面富内容编辑器,可以保存带有主题的文档,兼容 HTML 和 Markdown。适用于 Windows、OS X 和 Linux。
quickcalc菜单栏计算器
Forestpin Analytics面向企业的金融数据分析工具
LingREST 客户端
Shortexts您经常复制的文本、文件夹和表情符号的快捷方式
Front-End Box前端代码生成器集合

Electron 的 API 文档作为结构化数据

·3 分钟阅读

今天,我们宣布对 Electron 的文档进行一些改进。每个新版本现在都包含一个 JSON 文件,详细描述了 Electron 的所有公共 API。我们创建此文件是为了使开发人员能够以有趣的新方式使用 Electron 的 API 文档。


模式概述

每个 API 都是一个对象,具有名称、描述、类型等属性。诸如 BrowserWindowMenu 之类的类具有描述其实例方法、实例属性、实例事件等的附加属性。

这是模式中描述 BrowserWindow 类的一个摘录

{
name: 'BrowserWindow',
description: 'Create and control browser windows.',
process: {
main: true,
renderer: false
},
type: 'Class',
instanceName: 'win',
slug: 'browser-window',
websiteUrl: 'https://electron.js.cn/docs/api/browser-window',
repoUrl: 'https://github.com/electron/electron/blob/v1.4.0/docs/api/browser-window.md',
staticMethods: [...],
instanceMethods: [...],
instanceProperties: [...],
instanceEvents: [...]
}

这是方法描述的示例,在本例中为 apis.BrowserWindow.instanceMethods.setMaximumSize 实例方法

{
name: 'setMaximumSize',
signature: '(width, height)',
description: 'Sets the maximum size of window to width and height.',
parameters: [{
name: 'width',
type: 'Integer'
}, {
name: 'height',
type: 'Integer'
}]
}

使用新数据

为了让开发人员在其项目中使用此结构化数据变得容易,我们创建了 electron-docs-api,这是一个小的 npm 包,每当有新的 Electron 版本发布时都会自动发布。

npm install electron-api-docs --save

为了立即获得满足感,请在您的 Node.js REPL 中试用该模块

npm i -g trymodule && trymodule electron-api-docs=apis

数据如何收集

Electron 的 API 文档遵循 Electron 编码风格Electron 风格指南,因此其内容可以通过编程方式解析。

electron-docs-linterelectron/electron 存储库的新开发依赖项。它是一个命令行工具,用于检查所有 markdown 文件并强制执行风格指南的规则。如果发现错误,则会列出这些错误并中止发布过程。如果 API 文档有效,则会创建 electron-json.api 文件,并作为 Electron 发布的一部分上传到 GitHub

标准 Javascript 和标准 Markdown

今年早些时候,Electron 的代码库已更新为对所有 JavaScript 使用 standard 代码检查器。Standard 的 README 总结了此选择背后的原因

采用标准风格意味着将代码清晰度和社区约定置于个人风格之上。这对于 100% 的项目和开发文化可能没有意义,但是开源对于新手来说可能是一个不友好的地方。设置明确的、自动化的贡献者期望会使项目更健康。

我们最近还创建了 standard-markdown,以验证我们文档中的所有 JavaScript 代码片段是否有效,并与代码库本身的风格保持一致。

这些工具共同帮助我们使用持续集成 (CI) 自动查找拉取请求中的错误。这减轻了人类进行代码审查的负担,并使我们对文档的准确性更有信心。

社区的努力

Electron 的文档在不断改进,我们感谢我们出色的开源社区为此做出的贡献。在撰写本文时,已有近 300 人为该文档做出了贡献。

我们很高兴看到人们如何利用这种新的结构化数据。可能的用途包括