Aller au contenu principal

API Changes Coming in Electron 1.0

· 4 mins de lecture

Since the beginning of Electron, starting way back when it used to be called Atom-Shell, we have been experimenting with providing a nice cross-platform JavaScript API for Chromium's content module and native GUI components. The APIs started very organically, and over time we have made several changes to improve the initial designs.


Now with Electron gearing up for a 1.0 release, we'd like to take the opportunity for change by addressing the last niggling API details. The changes described below are included in 0.35.x, with the old APIs reporting deprecation warnings so you can get up to date for the future 1.0 release. An Electron 1.0 won't be out for a few months so you have some time before these changes become breaking.

Deprecation warnings

Par défaut, des avertissements s'afficheront si vous utilisez des API obsolètes. To turn them off you can set process.noDeprecation to true. To track the sources of deprecated API usages, you can set process.throwDeprecation to true to throw exceptions instead of printing warnings, or set process.traceDeprecation to true to print the traces of the deprecations.

New way of using built-in modules

Les modules intégrés sont maintenant regroupés en un seul module, au lieu d'être séparés en modules indépendants, pour que vous puissiez les utiliser sans conflits avec d'autres modules :

var app = require('electron').app;
var BrowserWindow = require('electron').BrowserWindow;

The old way of require('app') is still supported for backward compatibility, but you can also turn if off:

require('electron').hideInternalModules();
require('app'); // throws error.

An easier way to use the remote module

Because of the way using built-in modules has changed, we have made it easier to use main-process-side modules in renderer process. You can now just access remote's attributes to use them:

// New way.
var app = require('electron').remote.app;
var BrowserWindow = require('electron').remote.BrowserWindow;

Instead of using a long require chain:

// Old way.
var app = require('electron').remote.require('app');
var BrowserWindow = require('electron').remote.require('BrowserWindow');

Splitting the ipc module

The ipc module existed on both the main process and renderer process and the API was different on each side, which is quite confusing for new users. We have renamed the module to ipcMain in the main process, and ipcRenderer in the renderer process to avoid confusion:

// Dans le processus principal .
var ipcMain = require('electron').ipcMain;
// In renderer process.
var ipcRenderer = require('electron').ipcRenderer;

And for the ipcRenderer module, an extra event object has been added when receiving messages, to match how messages are handled in ipcMain modules:

ipcRenderer.on('message', function (event) {
console.log(event);
});

Standardizing BrowserWindow options

The BrowserWindow options had different styles based on the options of other APIs, and were a bit hard to use in JavaScript because of the - in the names. They are now standardized to the traditional JavaScript names:

new BrowserWindow({ minWidth: 800, minHeight: 600 });

Following DOM's conventions for API names

The API names in Electron used to prefer camelCase for all API names, like Url to URL, but the DOM has its own conventions, and they prefer URL to Url, while using Id instead of ID. We have done the following API renames to match the DOM's styles:

  • Url is renamed to URL
  • Csp is renamed to CSP

You will notice lots of deprecations when using Electron v0.35.0 for your app because of these changes. An easy way to fix them is to replace all instances of Url with URL.

Changes to Tray's event names

The style of Tray event names was a bit different from other modules so a rename has been done to make it match the others.

  • clicked is renamed to click
  • double-clicked is renamed to double-click
  • right-clicked is renamed to right-click

Mac App Store and Windows Auto Updater on Electron

· 2 mins de lecture

Recently Electron added two exciting features: a Mac App Store compatible build and a built-in Windows auto updater.


Mac App Store Support

As of v0.34.0 each Electron release includes a build compatible with the Mac App Store. Previously an application built on Electron would not comply with Apple's requirements for the Mac App Store. Most of these requirements are related to the use of private APIs. In order to sandbox Electron in such a way that it complies with the requirements two modules needed to be removed:

  • crash-reporter
  • auto-updater

Additionally some behaviors have changed with respect to detecting DNS changes, video capture and accessibility features. You can read more about the changes and submitting your app to the Mac App store in the documentation. The distributions can be found on the Electron releases page, prefixed with mas-.

Related Pull Requests: electron/electron#3108, electron/electron#2920

Windows Auto Updater

In Electron v0.34.1 the auto-updater module was improved in order to work with Squirrel.Windows. This means that Electron ships with easy ways for auto updating your app on both OS X and Windows. You can read more on setting up your app for auto updating on Windows in the documentation.

Related Pull Request: electron/electron#1984

Quoi de neuf dans Electron

· 3 mins de lecture

Il y a eu quelques mises à jour et discussions intéressantes sur Electron récemment, voici un récapitulatif.


Source

Electron est maintenant à jour avec Chrome 45 à partir de la version v0.32.0. Les autres mises à jour comprennent...

Amélioration de la documentation

nouvelles docs

Nous avons restructuré et normalisé la documentation pour qu'elle soit plus attrayante et plus lisible. Il existe également des traductions de la documentation fournies par la communauté, comme le japonais et le coréen.

Pull requests similair: electron/electron#2028, electron/electron#2533, electron/electron#2557, electron/electron#2709, electron/electron#2725, electron/electron#2698, electron/electron#2649.

Node.js 4.1.0

Depuis la version v0.33.0 Electron est livré avec Node.js 4.1.0.

Questions apparentées : electron/electron#2817.

node-pre-gyp

Les modules reposant sur node-pre-gyp peuvent désormais être compilés dans Electron lors de la compilation à partir des sources.

Demande de téléchargement connexe : mapbox/node-pre-gyp#175.

Support ARM

Electron fournit maintenant des modules pour Linux sur ARMv7. Il fonctionne sur des plateformes populaires comme le Chromebook et le Raspberry Pi 2.

Questions apparentées : atom/libchromiumcontent#138, electron/electron#2094, electron/electron#366.

Fenêtre sans cadre style Yosemite

fenêtre sans cadre

Un correctif par @jaanus a été fusionné qui, comme les autres applications OS X intégrées, permet de créer des fenêtres sans cadre avec le système de feux de circulation intégré sur OS X Yosemite et les versions ultérieures.

Questions apparentées : electron/electron#2776.

Google Summer of Code, support d'impression

Après le Google Summer of Code nous avons fusionné des correctifs de @hokein pour améliorer le support de l'impression et ajoutez la possibilité d'imprimer la page dans des fichiers PDF.

Questions apparentées : electron/electron#2677, electron/electron#1935, electron/electron#1532, electron/electron#805, electron/electron#1669, electron/electron#1835.

Atom

Atom a maintenant été mis à jour vers Electron v0.30.6 qui fonctionne avec Chrome 44. Une mise à jour vers la v0.33.0 est en cours sur atom/atom#8779.

Talks

Amy Palamountain, membre de GitHubber, a présenté une excellente introduction à Electron lors d'une conférence à Nordic.js. Elle a également créé la bibliothèque electron-accelerator.

Créer des applications natives avec Electron par Amy Palomountain

Ben OgleBen Ogle, qui fait également partie de l'équipe Atom, a donné une conférence sur Electron à YAPC Asia :

Création d'Applications de Bureau avec les Technologies Web par Ben Ogle

Un membre de l'équipe Atom Kevin Sawicki et d'autres personnes ont récemment donné des conférences sur Electron lors de la réunion Bay Are Electron User Group. Les vidéos ont été postées, en voici quelques-unes :

L'histoire d'Electron par Kevin Sawicki

Créant une application web native par Ben Gotow

Electron Meetup at GitHub HQ

· Une min de lecture

Join us September 29th at GitHub's HQ for an Electron meetup hosted by Atom team members @jlord and @kevinsawicki. There will be talks, food to snack on, and time to hangout and meet others doing cool things with Electron. We'll also have a bit of time to do lightning talks for those interested. Nous espérons te revoir bientôt !


Talks

  • Jonathan Ross and Francois Laberge from Jibo will share how they use Electron to animate a robot.
  • Jessica Lord will talk about building a teaching tool, Git-it, on Electron.
  • Tom Moor will talk about the pros and cons of building video and screen sharing on Electron with speak.io.
  • Ben Gotow will preview N1: The Nylas Mail Client and talk about developing it on Electron.

Détails

electron-meetup-office-2

Documentation d'Electron

· 4 mins de lecture

Cette semaine, nous avons hébergé la documentation d'Electron sur electronjs.org. Vous pouvez visiter /docs/latest pour la dernière série de documents. We'll keep versions of older docs, too, so you're able to visit /docs/vX.XX.X for the docs that correlate to the version you're using.


You can visit /docs to see what versions are available or /docs/all to see the latest version of docs all on one page (nice for cmd + f searches).

Si vous souhaitez contribuer au contenu du répertoire docs, vous pouvez le faire en accédant au dépôt Electron, où sont récupéré les documentation. Nous les récupérons pour chaque version mineure et les ajoutons au dépôt du site Electron, qui est produit à l'aide de Jekyll.

Si vous souhaiter en savoir plus sur la façon dont nous extrayons les documents d'un dépôt vers un autre, continuez à lire ci-dessous. Sinon, profitez des docs!

The Technical Bits

We're preserving the documentation within the Electron core repository as is. Cela signifie que electron/electron aura toujours la dernière version des documents. When new versions of Electron are released, we duplicate them over on the Electron website repository, electron/electronjs.org.

script/docs

To fetch the docs we run a script with a command line interface of script/docs vX.XX.X with or without the --latest option (depending on if the version you're importing is the latest version). Our script for fetching docs uses a few interesting Node modules:

Tests help us know that all the bits and pieces landed as expected.

Jekyll

The Electron website is a Jekyll site and we make use of the Collections feature for the docs with a structure like this:

electron.atom.io
└── _docs
├── latest
├── v0.27.0
├── v0.26.0
├── so on
└── so forth

Front matter

For Jekyll to render each page it needs at least empty front matter. We're going to make use of front matter on all of our pages so while we're streaming out the /docs directory we check to see if a file is the README.md file (in which case it receives one front matter configuration) or if it is any other file with a markdown extension (in which case it receives slightly different front matter).

Each page receives this set of front matter variables:

---
version: v0.27.0
category: Tutorial
title: 'Quick Start'
source_url: 'https://github.com/electron/electron/blob/master/docs/tutorial/quick-start.md'
---

The README.md gets an additional permalink so that has a URL has a common root of index.html rather than an awkward /readme/.

permalink: /docs/v0.27.0/index.html

Config and Redirects

In the site's _config.yml file a variable latest_version is set every time the --latest flag is used when fetching docs. We also add a list of all the versions that have been added to the site as well as the permalink we'd like for the entire docs collection.

latest_version: v0.27.0
available_versions:
- v0.27.0
collections:
docs: { output: true, permalink: '/docs/:path/' }

The file latest.md in our site root is empty except for this front matter which allows users to see the index (aka README) of the latest version of docs by visiting this URL, electron.atom.io/docs/latest, rather than using the latest version number specifically (though you can do that, too).

---
permalink: /docs/latest/
redirect_to: /docs/{{ site.data.releases[0].version }}
---

Layouts

In the docs.html layout template we use conditionals to either show or hide information in the header and breadcrumb.

{% raw %} {% if page.category != 'ignore' %}
<h6 class="docs-breadcrumb">
{{ page.version }} / {{ page.category }} {% if page.title != 'README' %} / {{
page.title }} {% endif %}
</h6>
{% endif %} {% endraw %}

To create a page showing the versions that are available we just loop through the list in our config on a file, versions.md, in the site's root. Also we give this page a permalink: /docs/

{% raw %} {% for version in site.available_versions %} - [{{ version
}}](/docs/{{ version }}) {% endfor %} {% endraw %}

Hope you enjoyed these technical bits! Si vous désirez en savoir plus sur l'utilisation de Jekyll pour les sites de documentation, allez jeter un oeil sur comment l'équipe de docs de GitHub publie la documentation de GitHub sur Jekyll.

Atom Shell est désormais Electron

· 2 mins de lecture

Atom Shell s'appelle désormais Electron. Vous pouvez en savoir plus sur Electron et ce que les gens construisent avec lui à sa nouvelle maison electronjs.org.


electron

Electron est le shell d'application multi-plateforme que nous avons construit à l'origine pour l'éditeur Atom pour gérer l'intégration de la boucle d'événements Chromium/Node.js et les API natives.

Lorsque nous avons débuté, notre objectif n'était pas seulement de répondre aux besoins d'un éditeur de texte. Nous voulions également créer un framework simple qui permettrait aux gens d'utiliser les technologies web pour développer des applications de bureau multiplateformes avec tous les ajustements natifs.

En deux ans, Electron a énormément grandi. Il inclut désormais les mises à jour automatiques, un installateur Windows, des rapports d'incident, notifications, et d'autres fonctionnalités d'application natives utiles — toutes exposées via des API JavaScript. Et nous en avons d'autres en préparation. Nous prévoyons de sortir encore plus de bibliothèques d’Atom pour rendre la création d’une application native avec des technologies Web aussi facile que possible.

Jusqu'à présent, des développeurs individuels, de nouvelles startups comme de plus grandes entreprises ont créées des applications sur Electron. Ils ont créé une vaste gamme d'applications — incluant des applications de discution, des explorateurs de base de données, des concepteurs de carte, des outils de conception collaborative et des applications de prototypage mobile.

Jetez un coup d'oeil au nouveau electronjs.org pour voir plus d'applications que les gens ont construites sur Electron ou jetez un coup d'œil à la documentations pour en savoir plus sur ce que vous pouvez faire d'autre.

Si vous avez déjà commencé, nous serions ravis de discuter avec vous des applications que vous créez sur Electron. Adressez un mail à info@electronjs.org pour nous en dire plus. Vous pouvez également nous suivre sur le nouveau compte Twitter @ElectronJS pour rester connecté sur le projet.

💙🔌