¿Cómo funciona el Electrón JS en la creación de aplicaciones de escritorio para Mac y Windows?
- Andrés Cruz
Antes de hablarte sobre qué es Electron, quiero ponerte las cosas fáciles; tal vez haya escrito algún código en Atom o Visual Studio Code o haya enviado un mensaje a un amigo usando la aplicación de escritorio de WhatsApp. Si es así, entonces HAZ UTILIZADO ELECTRON: Electron es una herramienta en la cual están construidas múltiples aplicaciones MUY usadas como VSC y la emplean empresas tan importantes como Microsoft
Entonces,
¿Qué es Electron?
La versión corta es que es una plataforma para crear aplicaciones de escritorio que se ejecutan en MacOS, Windows y Linux utilizando tecnologías web. Electron combina Node.js con Chromium, la base de código abierto de Google Chrome. La respuesta larga es el tema central de mi curso en el cual vamos abordando esta tecnología.
Si formas parte de un pequeño equipo encargado de crear aplicaciones de escritorio para múltiples plataformas. Electron es una excelente manera de construir su producto sin la molestia de administrar dos o tres bases de código distintos; es decir
Con un código fuente, puedes eliminar errores relacionados en dos o tres plataformas o implementar la misma característica dos o tres veces.
Si eres un desarrollador de Node.js que quiere que tu aplicación de línea de comandos esté frente a una audiencia más amplia, Electron facilita la creación de una interfaz gráfica de usuario (GUI) sin tener que aprender un conjunto de habilidades completamente nuevo. Si es un desarrollador web que se ha acostumbrado a crear sus propias soluciones a los problemas, Electron facilita el acceso a las partes de su computadora que existen fuera de la zona de pruebas del navegador.
En mi experiencia, aprender Electron tiene implicaciones tanto a corto como a largo plazo:
La corta tiene que ver con lo que hacemos en JS, HTML y CSS nartivo, la comunicación entre procesos es muy fácil de entender de manera inicial para lanzar nuestra primera aplicación y ver elementos que ya nos vienen de gratis con Electron...
Es inmediatamente gratificante ver aparecer un ícono en su dock o barra de tareas cuando lo inicia o activa un cuadro de diálogo de archivo nativo desde el sistema operativo usando JavaScript.
Pero, a medida que se sienta cada vez más cómodo con Electron, encontrará ideas para aplicaciones que no podría crear ni con el navegador ni con Node.js por sí solos y que vas a necesitar conocer más aspectos sobre esta herramienta para hacer desarrollos más especializados y completos, por lo tanto, aprender a emplear y conocer el ciclo de Electron es fundamental y esto lleva su tiempo y pruebas...
Crear aplicaciones con Electron es fácil y divertido.
Finalmente... ¿Qué es Electron?
Electron es un runtime o tiempo de ejecución en español, que en pocas palabras es un pequeño sistema operativo que proporcionan la funcionalidad que necesitan los programas (nuestra app) para ejecutarse.
Con Electron podemos construir aplicaciones de escritorio con HTML5, CSS y JavaScript.
Electron es un proyecto de código abierto iniciado por Cheng Zhao (también conocido como zcbenz), un ingeniero de GitHub. Anteriormente llamado Atom Shell, Electron es la base de Atom, un editor de texto multiplataforma de GitHub creado con tecnologías web. Es posible que haya oído hablar o trabajado con Apache Cordova o Adobe PhoneGap, o lo haya utilizado, para crear aplicaciones web, envueltas en shells nativos, para sistemas operativos móviles como iOS, Android y Windows Phone. Si es así, podría ser útil pensar en Electron como una herramienta similar para crear aplicaciones de escritorio.
Electron le permite utilizar las tecnologías web que ya conoce para crear aplicaciones que de otro modo no crearía.
Con mi curso completo sobre Electron aprenderá a crear aplicaciones que se conecten a las API nativas del sistema operativo en Windows, macOS y Linux.
Electron combina el módulo de contenido de Chromium y los tiempos de ejecución de Node.js. Permite a los desarrolladores crear GUI con páginas web, así como acceder a las capacidades nativas del sistema operativo en Windows, macOS y Linux a través de una API independiente del sistema operativo (por eso es que se le conoce como un runtime de aplicaciones). Chromium y Node son plataformas de aplicaciones tremendamente populares por derecho propio, y ambas se han utilizado de forma independiente para crear aplicaciones ambiciosas. Electron reúne las dos plataformas para permitirle utilizar JavaScript para crear una clase de aplicación completamente nueva. Todo lo que puedes hacer en el navegador, lo puede hacer con Electron.
Todo lo que puedes hacer con Node, puedes hacerlo con Electron.
La parte emocionante es lo que puede hacer con las dos tecnologías juntas. Puede crear aplicaciones que aprovechen ambas plataformas y crear aplicaciones que de otro modo no serían posibles en una sola.
Aplicaciones con características nativas y algo mas
Electron no solo es una excelente opción para crear aplicaciones web que se comporten como aplicaciones de escritorio nativas; también es una excelente opción para construir una GUI alrededor de aplicaciones de modo que de otro modo estarían limitadas a una interfaz de línea de comandos.
Supongamos que desea crear una aplicación que le permita ver y editar una carpeta de imágenes en su computadora. Las aplicaciones de navegador tradicionales no pueden acceder al sistema de archivos. No pudieron acceder al directorio de fotografías, cargar ninguna de las fotografías en el directorio ni guardar ninguno de los cambios que realizó en la aplicación. Con Node, podría implementar todas esas funciones, pero no podría proporcionar una GUI, lo que dificultaría el uso de su aplicación para el usuario promedio. Al combinar el entorno del navegador con Node, puede usar Electron para crear una aplicación donde puede abrir y editar fotografías, así como proporcionar una interfaz de usuario para hacerlo.
Electron no es un marco complicado, es un tiempo de ejecución simple. De manera similar a la forma en que puede usar el nodo desde la línea de comando, puede ejecutar aplicaciones de Electron usando la herramienta de línea de comando de electron. No es necesario que aprenda muchas convenciones para comenzar, y puede estructurar su aplicación como desee, aunque proporcionaré sugerencias y prácticas recomendadas a lo largo de mi curso.
Desarrollo con Laravel, Django, Flask, CodeIgniter, HTML5, CSS3, MySQL, JavaScript, Vue, Android, iOS, Flutter