Today we're releasing a free, open-source, hosted updates webservice and companion npm package to enable easy automatic updates for open-source Electron apps. This is a step toward empowering app developers to think less about deployment and more about developing high-quality experiences for their users.

Das Leben einfacher machen​

Electron has an autoUpdater API that gives apps the ability to consume metadata from a remote endpoint to check for updates, download them in the background, and install them automatically.

Enabling these updates has been a cumbersome step in the deployment process for many Electron app developers because it requires a web server to be deployed and maintained just to serve app version history metadata.

Heute kündigen wir eine neue Drop-In Lösung für automatische App-Updates an. Wenn sich Ihre Electron-App in einem öffentlichen GitHub Repository befindet und Sie GitHub Releases verwenden, um Builds zu veröffentlichen, können Sie diesen Dienst nutzen, um Ihren Nutzern kontinuierliche App-Updates zukommen zu lassen.

Benutze das neue Modul​

Um die Konfiguration Ihrerseits zu minimieren, haben wir update-electron-app, ein npm Modul, erstellt, das in den neuen update.electronjs.org webservice integriert ist.

Installiere das Modul:

npm install update-electron-app

Call it from anywhere in your app's main process:

require('update-electron-app')();

Das war alles. Das Modul wird beim Start der App nach Updates suchen, dann alle zehn Minuten. Wird ein Update gefunden, wird es automatisch im Hintergrund heruntergeladen. Ein Dialog wird sich öffnen, sobald das Update bereit ist.

Migration bestehender Apps​

Anwendungen, die bereits die autoUpdater API von Electron verwenden, können diesen Dienst auch nutzen. To do so, you can customize the update-electron-app module or integrate directly with update.electronjs.org.

Alternativen​

If you're using electron-builder to package your app, you can use its built-in updater. Weitere Informationen finden Sie unter electron.build/auto-update.

Wenn Ihre App privat ist, müssen Sie möglicherweise Ihren eigenen Update-Server einrichten. Es gibt eine Reihe von Open-Source-Tools dafür, einschließlich Zeits Hazel und Atlassian's Nucleus. Siehe das Einrichten eines Update-Servers Tutorials für weitere Informationen.

Danke​

Dank an Julian Gruber für die Unterstützung bei der Gestaltung und dem Aufbau dieses einfachen und skalierbaren Web-Services. Vielen Dank an die Leute bei Zeit für ihren Open-Source Hazel Service, von dem wir Inspiration zum Design genommen haben. Danke an Samuel Attard für die Code-Reviews. Vielen Dank an die Electron-Community, die beim Testen dieses Dienstes geholfen hat.

🌲 Hier ist eine immergrüne Zukunft für Electron Apps!

Die neue Electron 2.0 Release-Linie ist gepackt mit neuen Funktionen und Fehlerbehebungen. Eines der Highlights dieser neuen Hauptversion ist eine neue inAppPurchase API für Apple's Mac App Store.

In-App-Käufe ermöglichen den Kauf von Inhalten oder Abonnements direkt in Apps. Dies gibt Entwicklern eine einfache Möglichkeit, das freemium Geschäftsmodellzu übernehmen, wobei Nutzer nichts zahlen, um eine App herunterzuladen, sondern sie optional In-App-Käufe für Premium-Funktionen, zusätzliche Inhalte oder Abonnements anbieten.

Die neue API wurde zu Electron vom Community-Mitwirkenden Adrien Fery hinzugefügt, um In-App-Käufe in Amanote, einer Notizenanwendung für Vorträge und Konferenzen, zu aktivieren. Amanote kann kostenlos heruntergeladen werden und ermöglicht das Hinzufügen klarer und strukturierter Notizen zu PDFs, mit Funktionen wie mathematische Formeln, Zeichnungen, Audio, Aufzeichnung und mehr.

Adrien hat seit dem Hinzufügen von In-App-Kauf-Support zur Mac-Version von Amanote eine 40% Umsatzsteigerung festgestellt!

Erste Schritte​

Die neue inAppPurchase API ist bereits in der neuesten Electron Beta gelandet:

npm i -D electron@beta

Die Dokumentation für die API kann auf GitHub gefunden werden, und Adrien waren so freundlich, ein Tutorial über die Verwendung der API zu schreiben. Um mit dem Hinzufügen von In-App Käufen in ihrer App zu starten, sehen sie dieses Tutorial.

Weitere Verbesserungen an der API sind in Arbeit und werden bald in einer kommenden Electron Beta-Version landen.

Windows könnte als nächstes sein​

Als nächstes hofft Adrien einen neuen Umsatzkanal für Amanote zu eröffnen, indem er Unterstützung für Microsoft-In-App-Käufe in Electron hinzufügt. Bleiben Sie auf dem Laufenden für Entwicklungen daran!

A vulnerability has been discovered which allows Node.js integration to be re-enabled in some Electron applications that disable it. This vulnerability has been assigned the CVE identifier CVE-2018-1000136.

Affected Applications​

An application is affected if all of the following are true:

1. Runs on Electron 1.7, 1.8, or a 2.0.0-beta
2. Allows execution of arbitrary remote code
3. Disables Node.js integration
4. Does not explicitly declare webviewTag: false in its webPreferences
5. Does not enable the nativeWindowOption option
6. Does not intercept new-window events and manually override event.newGuest without using the supplied options tag

Although this appears to be a minority of Electron applicatons, we encourage all applications to be upgraded as a precaution.

Mitigation​

This vulnerability is fixed in today's 1.7.13, 1.8.4, and 2.0.0-beta.5 releases.

Developers who are unable to upgrade their application's Electron version can mitigate the vulnerability with the following code:

app.on('web-contents-created', (event, win) => {
  win.on(
    'new-window',
    (event, newURL, frameName, disposition, options, additionalFeatures) => {
      if (!options.webPreferences) options.webPreferences = {};
      options.webPreferences.nodeIntegration = false;
      options.webPreferences.nodeIntegrationInWorker = false;
      options.webPreferences.webviewTag = false;
      delete options.webPreferences.preload;
    },
  );
});

// and *IF* you don't use WebViews at all,
// you might also want
app.on('web-contents-created', (event, win) => {
  win.on('will-attach-webview', (event, webPreferences, params) => {
    event.preventDefault();
  });
});

Further Information​

This vulnerability was found and reported responsibly to the Electron project by Brendan Scarvell of Trustwave SpiderLabs.

To learn more about best practices for keeping your Electron apps secure, see our security tutorial.

To report a vulnerability in Electron, please email security@electronjs.org.

Please join our email list to receive updates about releases and security updates.

Last week the electronjs.org site had a few minutes of downtime. If you were affected by these brief outages, we're sorry for the inconvenience. After a bit of investigation today, we've diagnosed the root cause and have deployed a fix.

To prevent this kind of downtime in the future, we've enabled Heroku threshold alerts on our app. Any time our web server accumulates failed requests or slow responses beyond a certain threshold, our team will be notified so we can address the problem quickly.

Offline Docs in Every Language​

The next time you're developing an Electron app on a plane or in a subterranean coffee shop, you might want to have a copy of the docs for offline reference. Fortunately, Electron's docs are available as Markdown files in over 20 languages.

git clone https://github.com/electron/electron-i18n
ls electron-i18n/content

Offline Docs with a GUI​

devdocs.io/electron is a handy website that stores docs for offline use, not just for Electron but many other projects like JavaScript, TypeScript, Node.js, React, Angular, and many others. And of course there's an Electron app for that, too. Check out devdocs-app on the Electron site.

If you like to install apps without using your mouse or trackpad, give Electron Forge's install command a try:

npx electron-forge install egoist/devdocs-app

A remote code execution vulnerability has been discovered affecting Electron apps that use custom protocol handlers. This vulnerability has been assigned the CVE identifier CVE-2018-1000006.

Affected Platforms​

Electron apps designed to run on Windows that register themselves as the default handler for a protocol, like myapp://, are vulnerable.

Such apps can be affected regardless of how the protocol is registered, e.g. using native code, the Windows registry, or Electron's app.setAsDefaultProtocolClient API.

macOS and Linux are not vulnerable to this issue.

Mitigation​

We've published new versions of Electron which include fixes for this vulnerability: 1.8.2-beta.5, 1.7.12, and 1.6.17. We urge all Electron developers to update their apps to the latest stable version immediately.

Wenn Sie aus irgendeinem Grund nicht in der Lage sind, Ihre Electron-Version zu aktualisieren Sie können -- als letztes Argument anhängen, wenn Sie App aufrufen. etAsDefaultProtocolClient, , der Chromium daran hindert, weitere Optionen zu parsen. The double dash -- signifies the end of command options, after which only positional parameters are accepted.

app.setAsDefaultProtocolClient(protocol, process.execPath, [
  '--your-switches-here',
  '--',
]);

Siehe app.setAsDefaultProtocolClient für weitere Details.

To learn more about best practices for keeping your Electron apps secure, see our security tutorial.

If you wish to report a vulnerability in Electron, email security@electronjs.org.

Eine neue Hauptversion von Electron ist in Arbeit und damit einige Änderungen an unserer Versionierungsstrategie. Ab Version 2.0.0 wird Electron die Semantic Versionierung strikt einhalten.

This change means you'll see the major version bump more often, and it will usually be a major update to Chromium. Patch releases will also be more stable, as they will now only contain bug fixes with no new features.

Major Version Increments

• Chromium version updates
• Node.js major version updates
• Electron breaking API changes

Minor Version Increments

• Node.js minor version updates
• Electron non-breaking API changes

Patch Version Increments

• Node.js patch version updates
• fix-related chromium patches
• Electron bug fixes

Because Electron's semver ranges will now be more meaningful, we recommend installing Electron using npm's default --save-dev flag, which will prefix your version with ^, keeping you safely up to date with minor and patch updates:

npm install --save-dev electron

For developers interested only in bug fixes, you should use the tilde semver prefix e.g. ~2.0.0, which which will never introduce new features, only fixes to improve stability.

For more details, see electronjs.org/docs/tutorial/electron-versioning.

Electron has a new website at electronjs.org! We've replaced our static Jekyll site with a Node.js webserver, giving us flexibility to internationalize the site and paving the way for more exciting new features.

🌍 Übersetzungen​

We've begun the process of internationalizing the website with the goal of making Electron app development accessible to a global audience of developers. We're using a localization platform called Crowdin that integrates with GitHub, opening and updating pull requests automatically as content is translated into different languages.

Though we've been working quietly on this effort so far, over 75 Electron community members have already discovered the project organically and joined in the effort to internationalize the website and translate Electron's docs into over 20 languages. We are seeing daily contributions from people all over the world, with translations for languages like French, Vietnamese, Indonesian, and Chinese leading the way.

To choose your language and view translation progress, visit electronjs.org/languages

If you're multilingual and interested in helping translate Electron's docs and website, visit the electron/electron-i18n repo, or jump right into translating on Crowdin, where you can sign in using your GitHub account.

There are currently 21 languages enabled for the Electron project on Crowdin. Adding support for more languages is easy, so if you're interested in helping translate but you don't see your language listed, let us know and we'll enable it.

Raw Translated Docs​

If you prefer to read documentation in raw markdown files, you can now do that in any language:

git clone https://github.com/electron/electron-i18n
ls electron-i18n/content

App-Seiten​

As of today, any Electron app can easily have its own page on the Electron site. For a few examples, check out Etcher, 1Clipboard, or GraphQL Playground, pictured here on the Japanese version of the site:

There are some incredible Electron apps out there, but they're not always easy to find, and not every developer has the time or resources to build a proper website to market and distribute their app.

Using just a PNG icon file and a small amount of app metadata, we're able to collect a lot of information about a given app. Using data collected from GitHub, app pages can now display screenshots, download links, versions, release notes, and READMEs for every app that has a public repository. Using a color palette extracted from each app's icon, we can produce bold and accessible colors to give each app page some visual distinction.

The apps index page now also has categories and a keyword filter to find interesting apps like GraphQL GUIs and p2p tools.

If you've got an Electron app that you'd like featured on the site, open a pull request on the electron/electron-apps repository.

Einzeilige Installation mit Homebrew​

The Homebrew package manager for macOS has a subcommand called cask that makes it easy to install desktop apps using a single command in your terminal, like brew cask install atom.

We've begun collecting Homebrew cask names for popular Electron apps and are now displaying the installation command (for macOS visitors) on every app page that has a cask:

To view all the apps that have homebrew cask names, visit electronjs.org/apps?q=homebrew. If you know of other apps with casks that we haven't indexed yet, please add them!

🌐 A New Domain​

We've moved the site from electron.atom.io to a new domain: electronjs.org.

The Electron project was born inside Atom, GitHub's open-source text editor built on web technologies. Electron was originally called atom-shell. Atom was the first app to use it, but it didn't take long for folks to realize that this magical Chromium + Node runtime could be used for all kinds of different applications. When companies like Microsoft and Slack started to make use of atom-shell, it became clear that the project needed a new name.

And so "Electron" was born. In early 2016, GitHub assembled a new team to focus specifically on Electron development and maintenance, apart from Atom. In the time since, Electron has been adopted by thousands of app developers, and is now depended on by many large companies, many of which have Electron teams of their own.

Supporting GitHub's Electron projects like Atom and GitHub Desktop is still a priority for our team, but by moving to a new domain we hope to help clarify the technical distinction between Atom and Electron.

🐢🚀 Node.js Everywhere​

The previous Electron website was built with Jekyll, the popular Ruby-based static site generator. Jekyll is a great tool for building static websites, but the website had started to outgrow it. We wanted more dynamic capabilities like proper redirects and dynamic content rendering, so a Node.js server was the obvious choice.

The Electron ecosystem includes projects with components written in many different programming languages, from Python to C++ to Bash. But JavaScript is foundational to Electron, and it's the language used most in our community.

By migrating the website from Ruby to Node.js, we aim to lower the barrier to entry for people wishing to contribute to the website.

⚡️ Einfachere Open-Source-Teilnahme​

If you've got Node.js (8 or higher) and git installed on your system, you can easily get the site running locally:

git clone https://github.com/electron/electronjs.org
cd electronjs.org
npm install
npm run dev

The new website is hosted on Heroku. We use deployment pipelines and the Review Apps feature, which automatically creates a running copy of the app for every pull request. This makes it easy for reviewers to view the actual effects of a pull request on a live copy of the site.

🙏 Dank an Mitwirkende​

We'd like to give special thanks to all the folks around the world who have contributed their own time and energy to help improve Electron. The passion of the open-source community has helped immeasurably in making Electron a success. Thank you!

A remote code execution vulnerability has been discovered in Google Chromium that affects all recent versions of Electron. Jede Electron-App, die auf Remote-Inhalte zugreift, ist anfällig für diese Ausnutzung, unabhängig davon, ob die Sandbox-Option aktiviert ist.

We've published two new versions of electron 1.7.8 and 1.6.14, both of which include a fix for this vulnerability. We urge all Electron developers to update their apps to the latest stable version immediately:

npm i electron@latest --save-dev

To learn more about best practices for keeping your Electron apps secure, see our security tutorial.

Please contact security@electronjs.org if you wish to report a vulnerability in Electron.

Das electron-npm-Paket enthält jetzt eine TypeScript-Definitionsdatei, die detaillierte Anmerkungen zur gesamten Electron-API bereitstellt. Diese Anmerkungen können Ihre Electron-Entwicklungserfahrung verbessern, selbst wenn Sie reines JavaScript schreiben.. Führen Sie einfach npm install electron aus, um aktuelle Electron-Typisierungen in Ihr Projekt einzubinden.

TypeScript ist eine Open Source-Programmiersprache von Microsoft. Als Erweiterung von JavaScript bietet TypeScript zusätzlich die Möglichkeit, statische Typen zu verwenden. Die TypeScript-Community ist in den letzten Jahren schnell gewachsen, und TypeScript wurde 2017 in einer Stack Overflow-Entwicklerumfrage als eine der beliebtesten Programmiersprachen genannt. TypeScript wird als „skalierbares JavaScript“ beschrieben und Teams bei GitHub, Slack und Microsoft verwenden es, um skalierbare Electron-Apps zu schreiben, die von Millionen Menschen verwendet werden.

TypeScript supports many of the newer language features in JavaScript like classes, object destructuring, and async/await, but its real differentiating feature is type annotations. Declaring the input and output datatypes expected by your program can reduce bugs by helping you find errors at compile time, and the annotations can also serve as a formal declaration of how your program works.

When libraries are written in vanilla Javascript, the types are often vaguely defined as an afterthought when writing documentation. Functions can often accept more types than what was documented, or a function can have invisible constraints that are not documented, which can lead to runtime errors.

TypeScript solves this problem with definition files. A TypeScript definition file describes all the functions of a library and its expected input and output types. When library authors bundle a TypeScript definition file with their published library, consumers of that library can explore its API right inside their editor and start using it right away, often without needing to consult the library's documentation.

Many popular projects like Angular, Vue.js, node-github (and now Electron!) compile their own definition file and bundle it with their published npm package. For projects that don't bundle their own definition file, there is DefinitelyTyped, a third-party ecosystem of community-maintained definition files.

Installation​

Starting at version 1.6.10, every release of Electron includes its own TypeScript definition file. When you install the electron package from npm, the electron.d.ts file is bundled automatically with the installed package.

The safest way to install Electron is using an exact version number:

npm install electron --save-dev --save-exact

Oder wenn Sie yarn verwenden:

yarn add electron --dev --exact

If you were already using third-party definitions like @types/electron and @types/node, you should remove them from your Electron project to prevent any collisions.

The definition file is derived from our structured API documentation, so it will always be consistent with Electron's API documentation. Just install electron and you'll always get TypeScript definitions that are up to date with the version of Electron you're using.

Beispiel​

For a summary of how to install and use Electron's new TypeScript annotations, watch this short demo screencast:

If you're using Visual Studio Code, you've already got TypeScript support built in. There are also community-maintained plugins for Atom, Sublime, vim, and other editors.

Once your editor is configured for TypeScript, you'll start to see more context-aware behavior like autocomplete suggestions, inline method reference, argument checking, and more.

Erste Schritte mit TypeScript​

Wenn du neu mit TypeScript bist und mehr erfahren möchtest, bietet dieses Einführungsvideo von Microsoft einen schönen Überblick darüber, warum die Sprache erstellt wurde, wie sie funktioniert, wie man sie benutzt und wohin es mit ihr geht.

There's also a handbook and a playground on the official TypeScript website.

Because TypeScript is a superset of JavaScript, your existing JavaScript code is already valid TypeScript. This means you can gradually transition an existing JavaScript project to TypeScript, sprinkling in new language features as needed.

Danke​

This project would not have been possible without the help of Electron's community of open-source maintainers. Thanks to Samuel Attard, Felix Rieseberg, Birunthan Mohanathas, Milan Burda, Brendan Forster, and many others for their bug fixes, documentation improvements, and technical guidance.

Unterstützung​

If you encounter any issues using Electron's new TypeScript definition files, please file an issue on the electron-typescript-definitions repository.

Frohes TypeScripting!

Diese Woche haben wir den Ersteller von Jasperinterviewt, einem Electron-basierten Werkzeug für die Verwaltung von GitHub Benachrichtigungen.

Hallo! Wer bist du?​

Ich bin Ryo Maruyama, ein Softwareentwickler in Japan. Ich entwickle Jasper und ESDoc.

Was ist Jasper?​

Jasper ist ein flexibler und mächtiger Issue-Reader für GitHub. Es unterstützt Issues und Pull-Requests auf github.com und GitHub Enterprise.

Warum hast du es gemacht?​

Wenn Menschen GitHub in ihren Job- oder OSS-Aktivitäten verwenden, neigen sie dazu, täglich viele Benachrichtigungen zu erhalten. Um die Benachrichtigungen zu abonnieren, bietet GitHub E-Mail und Web-Benachrichtigungen. Ich habe diese für ein paar Jahre verwendet, aber ich bin auf folgende Probleme gestoßen:

• It's easy to overlook issues where I was mentioned, I commented, or I am watching.
• I put some issues in a corner of my head to check later, but I sometimes forget about them.
• To not forget issues, I keep many tabs open in my browser.
• It's hard to check all issues that are related to me.
• It's hard to grasp all of my team's activity.

I was spending a lot of time and energy trying to prevent those problems, so I decided to make an issue reader for GitHub to solve these problems efficiently, and started developing Jasper.

Wer benutzt Jasper?​

Jasper is used by developers, designers, and managers in several companies that are using GitHub. Of course, some OSS developers also are using it. And it is also used by some people at GitHub!

Wie funktioniert Jasper?​

Sobald Jasper konfiguriert ist, erscheint der folgende Bildschirm. Von links nach rechts können Sie "Streams List", "Issue List" und "Issue Body" sehen.

Dieser "Stream" ist die Kernfunktion von Jasper. Wenn Sie zum Beispiel "Issues, die @zeke im electron/electron Repository zugewiesen sind" sehen wollen, erstellen Sie den folgenden Stream:

repo:electron/electron assignee:zeke is:issue

After creating the stream and waiting for a few seconds, you can see the issues that meet the conditions.

Was können wir mit Streams tun?​

I will introduce what kind of conditions can be used for stream.

Benutzer und Teams​

involves means mention, author, assignee or commenter

Respositories und Organisationen​

org is same as user

Attribute​

Prüfstatus​

As you may have noticed by looking at these, streams can use GitHub's search queries. For details on how to use streams and search queries, see the following URLs.

• jasperapp.io/doc.html#stream
• help.github.com/articles/searching-issues
• help.github.com/articles/search-syntax

Jasper also has features for unread issue management, unread comment management, marking stars, notification updating, filtering issues, keyboard shortcuts, etc.

Ist Jasper ein bezahltes Produkt? Wie viel kostet es?​

Jasper kostet $12. However you can use the free trial edition for 30 days.

Warum haben Sie Jasper auf Electron gebaut?​

Ich mag die folgenden Aspekte von Elektron:

• Apps können mit JavaScript/CSS/HTML entwickelt werden.
• Apps können für Windows, Mac und Linux-Plattformen gebaut werden.
• Electron wird aktiv entwickelt und hat eine große Community.

These features enable rapid and simple desktop application development. It is awesome! If you have any product idea, you should consider using Electron by all means.

Was sind einige Herausforderungen, denen Sie bei der Entwicklung von Jasper gegenüberstanden?​

I had a hard time figuring out the "stream" concept. Zuerst habe ich über die Verwendung von GitHubs Benachrichtigungs-API nachgedacht. Ich habe jedoch festgestellt, dass sie bestimmte Anwendungsfälle nicht unterstützt. Danach habe ich die Issues API und Pull-Requests APIzusätzlich zur Benachrichtigungs-API in Erwägung gezogen. Aber es wurde nie das, was ich wollte. Während ich über verschiedene Methoden nachdachte, erkannte ich, dass das Umfragen von GitHubs Such-API die größte Flexibilität bieten würde. It took about a month of experimentation to get to this point, then I implemented a prototype of Jasper with the stream concept in two days.

Note: The polling is limited to once every 10 seconds at most. This is acceptable enough for the restriction of GitHub API.

Was kommt als Nächstes?​

Ich habe einen Plan, die folgenden Funktionen zu entwickeln:

• Ein gefilterter Stream: Ein Stream hat einige gefilterte Streams, die Probleme im Stream filtern. Es ist wie eine Ansicht von SQL.
• Mehrere Konten: Sie werden in der Lage sein, github.com und GHE zu verwenden
• Leistung verbessern: Im Moment ist das Laden eines Problems in WebView in niedriger Geschwindigkeit als der normale Browser.

Folgen Sie @jasperappio auf Twitter für Updates.