Aujourd’hui, nous publions et hérgeons un webservice , open-source, gratuit ainsi que son package complémentaire disponible sur npm pour permettre d'effectuer facilement la mise à jour automatique des applications Electron open source. Il s’agit d’une étape permettant aux développeurs d’applications de moins avoir à réfléchir au déploiement et d'avantage au développement d’expériences de haute qualité pour leurs utilisateurs.

Faciliter les choses​

Electron possède l'API autoUpdater donnant aux applications la possibilité de consommer des métadonnées depuis un point de terminaison distant pour vérifier les mises à jour, de télécharger celles-ci en arrière-plan avant de les installer automatiquement.

C'était jusqu'alors, pour de nombreux développeurs d'applications Electron, une étape lourde dans le processus de déploiement que de permettre ces mises à jour car cela nécessitait un serveur web pour le déploiement et que celui-ci devait être maintenu uniquement pour servir les métadonnées de l'historique des versions de l'application.

Aujourd'hui, nous annonçons une nouvelle solution clés en main de mise à jour automatique des applications. Si votre application Electron eréside sur un dépôt GitHub public et que vous utilisez GitHub Releases pour publier des builds, vous pouvez utiliser ce service pour fournir des mises à jour en continu à vos utilisateurs.

Utiliser le nouveau module​

Pour minimiser la configuration de votre part, nous avons créé update-electron-app, un module npm qui s'intègre au nouveau webservice update.electronjs.org.

Installer le module:

npm install update-electron-app

Appelez-le de n’importe où dans le processus principal de votre application [][]:

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

Voilà! Par défaut, ce module vérifiera les mises à jour au démarrage de l'application puis ensuite toutes les dix-minutes. Lorsqu'une mise à jour sera détectée, elle sera téléchargée automatiquement en arrière-plan et une boîte de dialogue s'affichera lorsque la mise à jour sera prête.

Migration des applications existantes​

Les applications utilisant déjà l'API autoUpdater d'Electron peuvent également utiliser ce service. Pour ce faire, vous pouvez personnaliser le module update-electron-app ou intégrer directement avec update.electronjs.org.

Alternatives​

Si vous utilisez electron-builder pour packager votre application, vous pouvez utiliser son système intégré de mise à jour. Pour plus d’informations, reportez-vous à electron.build/auto-update .

Si votre application est privée, vous devrez alors utiliser votre propre serveur de mise à jour. Il y a un certain nombre d'outils open-source pour cela, y compris Hazel de Zeit et Nucleus d'Atlassian. Pour plus d'informations, consultez le tutoriel Déployer un serveur de mise à jour.

Remerciements​

Merci à Julian Gruber pour avoir aidé à concevoir ce service web simple et évolutif. Merci aux collègues de Zeit pour leur service open-source Hazel dont nous nous sommes inspiré pour la conception. Merci à Samuel Attard pour les révisions de code. Merci à la communauté Electron d’avoir aidé à tester ce service.

🌲 Voila de quoi assurer une évolution permanente des applications Electron !

The new Electron 2.0 release line is packed with new features and fixes. One of the highlights from this new major version is a new inAppPurchase API for Apple's Mac App Store.

In-app purchases enable content or subscriptions to be purchased directly from within apps. This gives developers an easy way to embrace the freemium business model, wherein users pay nothing to download an app and are offered optional in-app purchases for premium features, additional content, or subscriptions.

The new API was added to Electron by community contributor Adrien Fery to enable in-app purchases in Amanote, a note-taking Electron app for lectures and conferences. Amanote is free to download and allows clear and structured notes to be added to PDFs, with features like mathematical formulae, drawings, audio recording, and more.

Since adding in-app purchase support to the Mac version of Amanote, Adrien has noted a 40% increase in sales!

Démarrer​

The new inAppPurchase API has already landed in the latest Electron beta:

npm i -D electron@beta

The docs for the API can be found on GitHub, and Adrien has been kind enough to write a tutorial on how to use the API. To get started adding in-app purchases to your app, see the tutorial.

More improvements to the API are in the works, and will soon be landing in an upcoming Electron beta release.

Windows Could Be Next​

Up next, Adrien is hoping to open a new revenue channel for Amanote by adding support for Microsoft Store in-app purchases in Electron. Stay tuned for developments on that!

Une vulnérabilité a été découverte qui permettait de réactiver l'intégration de Node.js dans certaines applications Electron qui la désactivent. L’identificateur CVE CVE a été attribué à cette vulnérabilitéCVE-2018-1000136.

Applications concernées​

Une application est affectée si toutes les conditions suivantes sont remplies :

1. Fonctionne sur Electron 1.7, 1.8 ou une version bêta 2.0.0
2. Permet l’exécution de code distant arbitraire
3. Désactive l'intégration de Node.js
4. Ne déclare pas explicitement webviewTag: false dans ses webPreferences
5. N’active pas l’option nativeWindowOption
6. N'intercepte pas les événements new-window et surcharge manuellement event.newGuest sans utiliser le tag d'options fournie

Bien que cela ne semble concerner qu'une minorité d'applications Electron, nous vous encourageons à ce que toutes les applications soient mises à jour par précaution.

Atténuation​

Cette vulnérabilité est corrigée dans les versions d'aujourd'hui de 1.7.13, 1.8.4et 2.0.0-beta.5.

Les développeurs ne pouvant pas mettre à niveau la version Electron de leur application peuvent atténuer la vulnérabilité avec le code suivant :

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();
  });
});

Informations complémentaires ​

Cette vulnérabilité a été trouvée et signalée de manière responsable au projet Electron par Trustwave SpiderLabs.

Pour en savoir plus à propos des meilleures pratiques pour sécuriser vos applications Electron, consultez notre tutoriel de sécurité.

Si vous souhaitez signaler une vulnérabilité dans Electron, envoyez un e-mail à security@electronjs.org.

Veuillez vous inscrire à notre liste de diffusion recevoir des mises à jour sur les versions et les mises à jour de sécurité.

La semaine dernière, le site electronjs.org a eu quelques minutes de temps d'arrêt. Si vous avez été affecté par ces brèves interruptions, nous sommes désolés pour la gêne occasionnée. Après investigation , nous avons diagnostiqué aujourd'hui, la cause principale et avons déployé un correctif.

Pour éviter ce type de temps d'arrêt à l'avenir, nous avons activé les alertes de seuil Heroku sur notre application. Chaque fois que notre serveur web accumule des requêtes ayant échouées ou des réponses lentes au-delà d'un certain seuil, notre équipe sera informée afin que nous puissions résoudre le problème rapidement.

Documentation hors connexion et pour de multiples langues​

La prochaine fois que vous développerez une application Electron dans un avion ou dans un café en sou-sol, vous voudrez peut-être avoir une copie de la documentation pour vous y référer hors ligne. Heureusement, la documentation d'Electron est disponible sous forme de fichiers Markdown dans plus de 20 langues.

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

Documentation hors connexion avec interface graphique​

devdocs.io/electron est un site pratique qui stocke des documentations pour une utilisation hors ligne, et pas seulement pour Electron mais pour beaucoup d'autres projets comme JavaScript, TypeScript, Node.js, React, Angular. Et bien sûr il existe également une application Electron pour cela. Consultez devdocs-app sur le site d'Electron.

Si vous préférez installer les applications sans utiliser votre souris ou pavé tactile, essayez la commande install d'Electron Forge :

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.

Plateformes affectées​

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.

Atténuation​

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.

Si pour une raison quelconque, vous ne pouvez pas mettre à jour votre version d'Electron, vous pouvez ajouter -- comme dernier argument en appelant l'application . etAsDefaultProtocolClient, qui empêche Chromium d'analyser d'autres options. The double dash -- signifies the end of command options, after which only positional parameters are accepted.

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

Voir l'API app.setAsDefaultProtocolClient pour plus de détails.

Voir l'API app.setAsDefaultProtocolClient pour plus de détails.

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

A new major version of Electron is in the works, and with it some changes to our versioning strategy. As of version 2.0.0, Electron will strictly adhere to Semantic Versioning.

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.

Incréments de version Majeure

• mises à jour de version Chromium
• Mises à jour de la version majeure de Node.js
• changement Electron qui altère l'API

Incréments de version mineure

• Mises à jour mineure de la version de Node.js
• changement Electron n'altérant pas l'API

Incréments de version de Correctifs

• Mises à jour des correctifs de Node.js
• mises à jour de correctifs Chromium
• Corrections de bugs d'Electron

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 a maintenant un nouveau site web sur electronjs.org! Nous avons remplacé notre site statique Jekyll par un serveur Node.js, nous donnant la flexibilité d'internationaliser le site et ouvrant la voie à de nouvelles fonctionnalités plus excitantes.

🌍 Traductions​

Nous avons entamé le processus d’internationalisation du site avec comme objectif de rendre le développement d’applications Electron accessible mondiallement aux développeurs. Nous utilisons désormais la plateforme de localisation appelée Crowdin qui s'intègre avec GitHub, l’ouverture et la mise à jour des requêtes de tirage automatiquement que le contenu est traduit dans différentes langues.

Bien que nous y ayons jusqu’à présent travaillé tranquillement , plus de 75 membres de la communauté Electron ont déjà découvert le projet organiquement et unis dans l’effort d’internationaliser le site afin de traduire les documents d’Electron en plus de 20 langues. We are seeing daily contributions from people all over the world, with translations for languages like French, Vietnamese, Indonesian, and Chinese leading the way.

Pour choisir votre langue et voir la progression de la traduction, visitez electronjs.org/languages

Si vous êtes polyglotte et que vous souhaitez aider à traduire les documents d'Electron et le site Web, visitez le dépôt electron/electron-i18n , ou passez directement à la traduction sur Crowdin, où vous pouvez vous connecter en utilisant votre compte GitHub.

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 Pages​

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.

Si vous avez une application Electron que vous aimeriez voir sur le site, ouvrez une pull request sur le dépôt electron/electron-apps.

One-line Installation with Homebrew​

Le gestionnaire de paquets Homebrew pour macOS a une sous-commande appelée cask qui facilite l'installation d'applications de bureau en utilisant une seule commande dans votre terminal, comme 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!

🌐 Un nouveau domaine​

Nous avons déplacé le site de electron.atom.io vers un nouveau domaine : 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.

Soutenir les projets Electron de GitHub comme Atom et GitHub Desktop reste une priorité pour notre équipe, mais en passant à un nouveau domaine, nous espérons contribuer à clarifier la distinction technique entre Atom et Electron.

🐢🚀 Node.js Everywhere​

Le site Web précédent d'Electron a été construit avec Jekyll, le générateur de site statique populaire basé sur Ruby. Jekyll is a great tool for building static websites, but the website had started to outgrow it. Nous voulions des capacités plus dynamiques comme des redirections appropriées et un rendu de contenu dynamique, donc un serveur Node.js était le choix évident.

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.

⚡️ Easier Open-Source Participation​

Si vous avez Node.js (8 ou plus) et git installé sur votre système, vous pouvez facilement faire fonctionner le site localement :

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.

🙏 Merci aux contributeurs​

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. Merci !

A remote code execution vulnerability has been discovered in Google Chromium that affects all recent versions of Electron. Toute application Electron qui accède au contenu à distance est vulnérable à cet exploit, que l'option sandbox soit activée.

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

Pour en savoir plus sur les bonnes pratiques pour sécuriser les applications Electron, consultez notre tutoriel de sécurité .

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

Le package npm electron inclut désormais un fichier de définition TypeScript qui fournit des annotations détaillées de l’ensemble de l’API Electron. Ces annotations peuvent faciliter vos développements avec Electron même si vous écrivez du JavaScript de base. Il vous suffit d'effectuer la commande npm install electron pour obtenir les types d'Electron à jour dans votre projet.

TypeScript est un langage de programmation open-source créé par Microsoft. C'est un sur-ensemble de JavaScript étendant le langage en ajoutant la prise en charge des types statiques. La communauté TypeScript s'est développée rapidement ces dernières années, et TypeScript s'est classé parmi les langages de programmation les plus appréciés dans une enquête récente de Stack Overflow sur les développeurs . TypeScript est décrit comme un « JavaScript qui évolue », et les équipes de GitHub, Slack, et Microsoft l’utilisent toutes pour écrire des applications Electron évolutives qui sont utilisées par des millions de personnes.

TypeScript prend en charge de nombreuses fonctionnalités parmi les plus récentes de JavaScript, telles que les classes, la déstructuration d’objets et l’async/await, mais sa véritable fonctionnalité de différenciation est les annotations des type. La déclaration des types de données d’entrée et de sortie attendus par votre programme peut réduire les bogues en vous aidant à trouver des erreurs au moment de la compilation, et les annotations peuvent également servir de déclaration formelle de fonctionnement de votre programme.

Lorsque les bibliothèques sont écrites en Javascript de base, les types sont souvent vaguement définis après coup lors de la rédaction de la documentation. Les fonctions peuvent souvent accepter plus de types que ce qui a été documenté ou une avoir des contraintes invisibles qui ne sont pas documentées et ceci peut entraîner des erreurs à l’exécution.

TypeScript résout ce problème avec les fichiers de définition. Un fichier de définition TypeScript décrit toutes les fonctions d'une bibliothèque et ses types d'entrée et de sortie attendus. Lorsque les auteurs de bibliothèque regroupent un fichier de définition typeScript avec leur bibliothèque publiée, les utilisateurs de cette bibliothèque peuvent explorer son API directement dans leur éditeur et commencer à l’utiliser immédiatement, souvent sans avoir besoin de consulter sa documentation.

De nombreux projets populaires comme Angular, Vue.js, node-github (et maintenant Electron!) compilent leur propre fichier de définition et le regroupent avec leur package publié sur npm. Pour les projets ne regroupant pas leur propre fichier de définition, il existe DefinitelyTyped, un écosystème tiers de fichiers de définition gérés par la communauté.

Installation​

À partir de la version 1.6.10, chaque version d’Electron inclut son propre fichier de définition TypeScript. Lorsque vous installez le package electron à partir de npm, le fichier electron.d.ts est automatiquement fourni avec le package installé.

Le moyen le le plus sûr d’installer Electron est d’utiliser un numéro de version exact :

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

Ou si vous utilisez yarn:

yarn add electron --dev --exact

Si vous utilisiez déjà des définitions tierces telles que @types/electron et @types/node, vous devez les supprimer de votre projet Electron pour éviter toutes collisions.

Le fichier de définition est dérivé de notre documentation API structurée, et sera donc toujours cohérent avec la documentation API de Electron. Installez simplement electron et vous obtiendrez toujours les définitions TypeScript à jour avec la version d'Electron que vous utilisez.

Utilisation​

Pour un résumé de l’installation et de l’utilisation des nouvelles annotations TypeScript d’Electron veuillez regarder cette courte démonstration vidéo:

Si vous utilisez Visual Studio Code, vous disposez de la prise en charge de TypeScript intégrée. Il existe également des plugins maintenus par la communauté pour Atom, Sublime, vim, et d’autres éditeurs.

Une fois que votre éditeur est configuré pour TypeScript, vous verrez plus d'indications contextuelles comme des suggestions de saisie semi-automatique, la référence de méthode en ligne, la vérification des des arguments, etc.

Prise en main de TypeScript​

Si vous débuter avec TypeScript et que vous souhaitez en savoir plus, cette vidéo d’introduction de Microsoft fournit un bon aperçu des raisons pour lesquelles le langage a été créé, son fonctionnement, son utilisation et sa destinée.

Il existe également un manuel et une appli d'expérimentation sur le site officiel de TypeScript.

Étant donné que TypeScript est un sur-ensemble de JavaScript, votre code JavaScript existant est déjà du Typescript valide. Cela signifie que vous pouvez progressivement transférer un projet JavaScript existant vers TypeScript, en le parsemant selon les besoins de nouvelles fonctionnalités du langage.

Merci​

Ce projet n’aurait pas été possible sans l’aide de la communauté des mainteneurs open source d’Electron. Merci à Samuel Attard, Felix Rieseberg, Birunthan Mohanathas, Milan Burda, Brendan Forster, et beaucoup d'autres pour leurs corrections de bogues, améliorations de documentation, et conseils techniques.

Support​

Si vous rencontrez des problèmes en utilisant les nouveaux fichiers de définition TypeScript d'Electron, veuillez déclarer un problème sur le dépôt electron-typescript-definitions.

Joyeux TypeScripting!

Cette semaine, nous avons interviewé le créateur de Jasper, un outil basé sur Electron pour gérer les notifications GitHub.

Hello! Qui es-tu ?​

I'm Ryo Maruyama, a software developer in Japan. I am developing Jasper and ESDoc.

What is Jasper?​

Jasper est un lecteur de tickets flexible et puissant pour GitHub. It supports issues and pull requests on github.com and GitHub Enterprise.

Why did you make it?​

When people use GitHub in their job or OSS activities, they tend to receive many notifications on a daily basis. As a way to subscribe to the notifications, GitHub provides email and web notifications. I used these for a couple of years, but I faced the following problems:

• 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.

Who's using 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!

How does Jasper work?​

Once Jasper is configured, the following screen appears. From left to right, you can see "streams list", "issues list" and "issue body".

This "stream" is the core feature of Jasper. For example, if you want to see "issues that are assigned to @zeke in the electron/electron repository", you create the following 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.

What can we do with streams?​

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

Users and Teams​

involves means mention, author, assignee or commenter

Repositories and Organizations​

org is same as user

Attributs​

Review Status​

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.

Is Jasper a paid product? How much does it cost?​

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

Why did you choose to build Jasper on Electron?​

I like the following aspects of Electron:

• Apps can be developed with JavaScript/CSS/HTML.
• Apps can be built for Windows, Mac, and Linux platforms.
• Electron is actively developed and has a large 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.

What are some challenges you've faced while developing Jasper?​

I had a hard time figuring out the "stream" concept. Au début, j'ai envisagé d'utiliser l'API Notifications de GitHub. However I noticed that it does not support certain use cases. Après cela, j'ai envisagé d'utiliser l'API Issues API et Pull Requests API, en plus de l'API de notification. But it never became what I wanted. Puis en pensant à diverses méthodes, j'ai réalisé que le sondage de l'API de recherche de GitHub offrirait la plus grande flexibilité. 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.

What's coming next?​

I have a plan to develop the following features:

• A filtered stream: A stream has some filtered stream that filter issues in the stream. It is like as view of SQL.
• Multiple accounts: you will be able to use both github.com and GHE
• Improve performance: For now the loading a issue in WebView is low speed than normal browser.

Follow @jasperappio on Twitter for updates.