web2 logo

Artikel Links Notities

Electron installeren

Met Electron kan je desktop apps maken met behulp van HTML, CSS en Javascript. Een Electron app kan onderverdeeld worden in een "Main" proces en een "Render" proces. Het "Main" proces behelst de toegang tot het Operating systeem, zoals toegang tot de bestanden. Het "Render" proces is in feite de webbrowser die de "webapp" laat zien. Als de web app toegang tot bestanden wil, zal het "Render" proces moeten communiceren met het "Main" proces.

Electron op Linux installeren

Voor een Linux installatie van Electron kan je het beste nvm gebruiken om node te installeren. Op een ontwikkelmachine kan je beter node niet installeren en draaien onder de root gebruiker, anders ga je als "gewone" gebruiker foutmeldingen over permissies krijgen bij het gebruik van npm opdrachten. NVM is een eenvoudig Bash script om meerdere actieve node.js versies te beheren. NVM staat op Github: nvm op Github. Op Github staat ook hoe je NVM eenvoudig installeert: curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.36.0/install.sh | bash of: wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.36.0/install.sh | bash Let op het versienummer, dat kan inmiddels anders zijn. Als curl nog niet is geinstalleerd, dan moet je dat eerst nog doen.

installeer curl

curl nvm

Installeer node via nvm: nvm install node Als alternatief voor nvm, kan je ook de default map van npm aanpassen: fixing npm permissions Na het installeren van node kan je Electron installeren: npm install -g electron

node en electron installeren

Installatie testen:

installatie testen

Als git nog niet is geinstalleerd, dat ook nog installeren:

git installeren

Als extra tip kan je ook Visual Studio Code nog installeren:

vscode installeren

De Electron snelstart

Voor Electron is een repository op Github waar een Electron Quick Start staat die je kan gebruiken als startpunt om snel een project te beginnen. Deze Electron Quick Start is te vinden op: Electron Quick Start op Github. Je kunt deze via de terminal (of CMD op Windows) zo gebruiken: # Quick Start klonen: git clone https://github.com/electron/electron-quick-start # Naar de repository gaan: cd electron-quick-start # met een schone git beginnen: git init # Afhankelijkheden installeren: npm install # Je app starten: npm start

De bestanden

Het bestand package.json bevat de gegevens over je app, zoals de naam, de versie etc. Het bestand main.js is het bestand voor het "Main" proces. Via dit main.js wordt uiteindelijk de index.html geladen die iets laat zien op het scherm.

naar boven

term zoeken

Notitieruimte