Prerequisites
Esta es la parte 1 del tutorial de Electrón.
Electron es un framework para crear aplicaciones de escritorio usando JavaScript, HTML y CSS. By embedding Chromium and Node.js into a single binary file, Electron allows you to create cross-platform apps that work on Windows, macOS, and Linux with a single JavaScript codebase.
Este tutorial le guiará a través del proceso de desarrollar una aplicación de escritorio con Electron y distribuirla a los usuarios finales.
Metas
Este tutorial comienza guiándolo a través del proceso de repartir juntos una aplicación mínima de Electron desde cero, entonces te enseña cómo paquete y distribuirlo a los usuarios usando Electron Forge.
Si prefiere comenzar un proyecto con un solo comando de boilerplate, le recomendamos que inicie con el comando create-electron-app.
Supuestos
Electron es una capa de envoltorio nativa para aplicaciones web y se ejecuta en un entorno Node.js. Por lo tanto, este tutorial asume que generalmente estás familiarizado con Node y los conceptos básicos de desarrollo web del front-end. Si necesita leer un poco antes de continuar, le recomendamos los siguientes recursos:
Herramientas necesarias
Editor de código
Necesitarás un editor de texto para escribir tu código. Recomendamos usar Visual Studio Code, aunque puede elegir el que prefiera.
Línea de comandos
A lo largo del tutorial te pediremos que utilices varias interfaces de línea de comandos (CLIs). Puede teclear estos comandos en la terminal predeterminada de su sistema:
- Windows: Command Prompt or PowerShell
- macOS: Terminal
- Linux: varía dependiendo de la distribución (ej: Terminal GNOME, Konsole)
La mayoría de los editores de código también vienen con una terminal integrada, que también puede utilizar.
Git y GitHub
Git es un sistema de control de versiones usado comúnmente para código fuente, y GitHub es una plataforma de desarrollo colaborativa construida además de ella. Aunque ninguno de los dos es estrictamente necesario para construir una aplicación Electron usaremos lanzamientos de GitHub para configurar actualizaciones automáticas después encendido en el tutorial. Por lo tanto, te requeriremos para:
Si no estás familiarizado con como funciona Sinatra, te recomendamos leer la guía de Sinatra. También puede usar la aplicación GitHub Desktop si prefiere usar una interfaz visual en lugar de la línea de comandos.
Le recomendamos que cree un repositorio Git local y lo publique en GitHub antes de iniciar el tutorial, y confirmar su código después de cada paso.
GitHub Desktop instalará la última versión de Git en su sistema si todavía no tiene instalado.
Node.js y npm
Para comenzar a desarrollar una aplicación Electron necesita instalar el tiempo de ejecución Node.js y su gestor de paquetes npm empaquetado en su sistema. Le recomendamos que utilice la última versión de soporte a largo plazo (LTS).
Por favor instala Node.js usando instaladores precompilados para su plataforma. De lo contrario, puedes encontrar problemas de incompatibilidad con diferentes herramientas de desarrollo. Si estás usando macOS, recomendamos usar un gestor de paquetes como Homebrew o nvm para evitar cualquier problema de permisos de directorio.
Para comprobar que Node.js fue instalado correctamente, puede usar la bandera -v cuando ejecute los comandos node y npm. Estos deben imprimir las versiones instaladas.
$ node -v
v16.14.2
$ npm -v
8.7.0
Aunque necesita Node.js instalado localmente para montar un proyecto de Electron, Electron no utiliza la instalación de Node.js de su sistema para ejecutar su código. En cambio, viene empaquetado con su propio tiempo de ejecución Node.js. Esto significa que sus usuarios finales no necesitan instalar Node.js como requisito previo para ejecutar su aplicación.
Para verificar qué versión de Node.js se está ejecutando en su aplicación, puede acceder al process.versions variable en el proceso principal o script de precarga. También puede hacer referencia a https://releases.electronjs.org/releases.json.