Electron

Introduction

Electron est un module Node.js qui permet de créer des applications (logiciels) desktop cross-plateform (Win, Mac, Linux) en utilisant des technologies web telles que :

• HTML5, CSS et JavaScript côté client pour l'interface graphique du Logiciel (front-end)
• Node.js pour la partie back-end (opérations de système, etc.)

Electron est un projet open-source maintenu par GitHub.

Objectifs de cette page

Cette page fait principalement référence au cours STIC I du Master MALTT et s'inscrit dans la perspective d'aborder les fondamenteaux de la programmation à travers JavaScript. Plus en détail, Electron permet de montrer à quel point les technologies web peuvent être combinées et adoptées dans des environnements différents. De plus, la création de logiciels desktop permet de prendre en compte la notion de persistance des données (e.g. sauvegarder un fichier) au niveau local, ce qui a des implications au niveau pédagogique.

Pour comprendre le contenu de cette page la lecture des pages suivantes et conseillée :

• Introduction à la programmation
• JavaScript
• Tutoriel JavaScript de base
• Node.js

Installation de Electron

Electron peut être installé comme tout module Node.js, c'est-à-dire de manière local ou global. Il existe également la possibilité d'installer une version binaire préconstituée, mais cette option ne sera pas abordée dans cette page.

Veuillez noter que l'utilisation du module est un peu plus complexe par rapport à d'autres types de module. Pour une première utilisation il est mieux de se référer aux exemples plus bas dans cette page.

Installation locale

Pour installer Electron de manière locale dans un projet, utiliser la commande :

npm install electron-prebuilt

Cette commande créera un dossier electron-prebuilt à l'intérieur du dossier node_modules :

votredossier
|- node_modules
   |- electron-prebuilt
      |- ...
      |- ...

Le module electron-prebuilt est assez conséquent (environ 40 mb en décembre 2015). Si vous comptez faire plusieurs essais, il peut-être utile de l'installer plutôt de manière global (voir de suite).

Installation globale

Pour installer Electron de manière globale dans votre système, utiliser la commande :

npm install -g electron-prebuilt

Cette commande ajoutera le module à la liste des modules installés dans votre système et qui sont accessibles dans tout script Node.js qui utilise la fonction require('electron') pour l'inclure.

Comprendre Electron

On peut utiliser une simple équation pour expliquer Electron :

Electron = Chrome + Node.js

En effet, l'intérêt de Electron est de mettre à disposition du développeur un navigateur web (à l'occurence Chrome) et Node.js dans le même paquet, ce qui permet notamment de :

• Utiliser HTML5, CSS et JavaScript côté-client pour construire l'interface graphique du logiciel, c'est-à-dire la partie frontend
• Utiliser Node.js et ses modules pour effectuer des opérations de système (i.e. backend) directement sur l'ordinateur de l'utilisateur qui installe le logiciel