Cross-Platform Applications with ASP.NET Core and Electron.NET

Electron.Net is an interesting library that allows us to build cross-platform applications based on ASP .Net Core and Electron.

The ability to use the versatility of HTML as the front end, coupled with the power of ASP .NET Core as the backend, to create cross-platform desktop applications is a dream for many .NET developers.

While we wait for Microsoft to make us happy with this integration, Electron.NET offers an alternative, acting as a wrapper around the popular Electron solution.

Electron.NET automates the process of creating an Electron desktop application. It also provides a certain API that acts as a gateway between .NET and Electron, offering methods to interact between them, such as creating windows, accessing devices, and more.

Although Electron.NET is a great tool, it also has some disadvantages. For instance, while it provides debugging tools, it’s not nearly as comfortable as with a regular application.

Electron.NET is an open-source project, and its code is available at https://github.com/ElectronNET/Electron.NET. The documentation is somewhat scarce, and we often need to infer its usage through repositories, which aren’t particularly up-to-date.

It’s available as a NuGet package, so adding it to our ASP .NET Core project is as simple as running:

Install-Package ElectronNET.API

Next, we modify our AppBuilder to include the ‘.UseElectron(args)’ method, like this:

public static IHostBuilder CreateHostBuilder(string[] args) =>
  Host.CreateDefaultBuilder(args)
    .ConfigureWebHostDefaults(webBuilder =>
    {
      webBuilder.UseStartup<Startup>();
      webBuilder.UseElectron(args);
    });

Additionally, in the application configuration, we need to add ‘Task.Run(async () => await Electron.WindowManager.CreateWindowAsync());’, resulting in:

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
  // ... (existing code)

  // Open the Electron-Window here
  Task.Run(async () => await Electron.WindowManager.CreateWindowAsync());
}

To start the application, we’ll use the provided CLI, ElectronNET.CLI, which we need to ensure is installed globally. To do so, we run:

dotnet tool install ElectronNET.CLI -g

If we already have ElectronNET.CLI installed, to initialize the project, we write the following command within our ASP .NET Core application directory:

electronize init

This will create an ‘electronnet.manifest.json’ file in the project’s root. Next, to start the application, we execute:

electronize start

The compilation takes quite some time, especially the first time we run the application. Eventually, if everything goes well, we’ll see our Electron application running.

Finally, there are various options to build the production version (Release/Build) of the project. For example, we’d do:

electronize build /target win

There are different compilation options for various targets. You can refer to the project’s website for details on the parameters to use for different operating systems.