Why use electron
Recently, we are going to develop a desktop application on Kirin system, mainly to complete the visualization of Linux commands. electron, as one of the most active cross-platform desktop application frameworks, can create desktop applications using web technologies (e.g., HTML, CSS, and JavaScript), and at the same time, it can take full advantage of the power of the front-end community and various technology stacks to achieve powerful functionality. It can leverage the various technology stacks that the front-end community has to offer to achieve powerful functionality.
Interacting with the operating system
Electron's architecture is divided into three core parts: the Main Process, the Renderer Process, and the Preload Script.
1. Main Process
- functionality: The master process is the entry point to the Electron application and controls the application's lifecycle. It runs the JavaScript code of the environment and is responsible for creating and managing all the rendering processes (i.e., the windows of the application).
2. Renderer Process
- functionality: The rendering process is a separate process for each application window that runs in Chromium and is responsible for displaying the user interface (UI). The code executed by the rendering process is web technology (HTML, CSS, JavaScript).
3. Preload Script
- functionality: Preloaded scripts are executed before the rendering process loads the web content and run in an isolated context. It is possible to expose APIs to the rendering process via bridging, while still maintaining security.
electron practice
The general architecture of the command visualization tool is as follows
Backend UI: vue-element-admin
Backend Server: Golang
Client UI: vue-element-admin
Client Operation.
rendering (visual representation of how things will turn out)