Criando aplicações desktop multiplataforma com ASP.NET Core e Electron.NET \| TreinaWeb Promoção no ar Matricule-se agora e garanta **54% de desconto** Termina em Tempo restante da oferta: 17 Horas 51 Min 39 Seg Tempo restante da oferta: 17 51 39 [Assinar →](https://www.treinaweb.com.br/checkout/pagamento/plano/anual?cupom=TW-SCLIENTE26) [ ](https://www.treinaweb.com.br) Explorar [ Quanto custa? ](#assinatura) [ FAQ ](https://www.treinaweb.com.br#faq) [Matricule-se](#assinatura) [ Entrar ](https://www.treinaweb.com.br/login) [ Início ](https://www.treinaweb.com.br) [ Artigos ](https://www.treinaweb.com.br/blog) Criando aplicações desktop multiplataforma com ASP.NET Core e Electron.NET [ ASP .NET ](https://www.treinaweb.com.br/blog/categoria/asp-net) [ .NET Core ](https://www.treinaweb.com.br/blog/categoria/net-core) # Criando aplicações desktop multiplataforma com ASP.NET Core e Electron.NET Otimize a criação de aplicações desktop reutilizando códigos do ASP.NET Core, com a ajuda do Electron.NET. [ Wladimilson M. Nascimento ](https://www.treinaweb.com.br/blog/autor/wladimilson-m-nascimento) 6 anos atrás ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2020/11/criando-aplicacoes-desktop-multiplataforma-com-asp-net-core-e-electron-net.png) Com poucas exceções, atualmente qualquer nova aplicação é criada visando a web, pois desta forma estará acessível ao maior número de usuários. Entretanto, ela pode necessitar de uma versão desktop. Esta versão pode ser criada de várias formas, mas se a aplicação web for desenvolvida em ASP.NET Core, este processo pode ser otimizado com a ajuda do Electron.NET. ## Electron.NET [Electron.NET](https://github.com/ElectronNET/Electron.NET) é uma biblioteca open source que permite que aplicações ASP.NET Core sejam convertidas em aplicações [Electron](https://www.treinaweb.com.br/blog/o-que-e-electron/). Ela também fornece APIs que permite que essas aplicações acessem as APIs do Electron. É importante frisar que esta biblioteca não reescreve o Electron e a aplicação ASP.NET Core não é convertida para uma aplicação desktop. Ela funciona basicamente como uma aplicação [self-contained](https://www.treinaweb.com.br/blog/aplicacoes-self-contained-com-o-net-core/) em um ambiente chamado “Electron”. ## Preparando o ambiente Para exemplificar o uso desta biblioteca, utilizarei uma aplicação ASP.NET Core simples, um ToDo, cujo o código pode ser visto no [meu Github](https://github.com/wladimilson/ExemploToDo). ## Configurando o Electron.NET na aplicação Com o projeto web em mãos, podemos adicionar nele o Electron.NET. Esta biblioteca é composta de dois pacotes, o `ElectronNET.API`, que fornece acesso as APIs do Electron e o `ElectronNET.CLI` que é uma ferramenta global. Desta forma, inicialmente é necessário adicionar à aplicação o pacote `ElectronNET.API`: ```shell dotnet add package ElectronNET.API ``` Em seguida precisamos ativar a extensão `UseElectron` na classe `Program`, no método `CreateHostBuilder`: ```csharp public static IHostBuilder CreateHostBuilder(string[] args) => Host.CreateDefaultBuilder(args) .ConfigureWebHostDefaults(webBuilder => { webBuilder.UseElectron(args); webBuilder.UseStartup(); }); ``` Também será necessário configurá-lo na classe `Startup`, onde inicialmente criaremos o método abaixo: ```csharp private async void ElectronStatup() { var window = await Electron.WindowManager.CreateWindowAsync(); window.OnClosed += () => { Electron.App.Quit(); }; } ``` Que será chamado no método `Configure`: ```csharp public void Configure(IApplicationBuilder app, IWebHostEnvironment env) { //... if (HybridSupport.IsElectronActive) { ElectronStatup(); } } ``` Note que estamos utilizando a constante `HybridSupport.IsElectronActive`, para que o método `ElectronStatup` seja chamado apenas quando a aplicação estiver sendo executada pelo Electron.NET. Pois se a aplicação for executada como geralmente é feito: ```shell dotnet run ``` Ainda será criado o servidor web e ela estará acessível via navegador: ![Aplicação ASP.NET Core sendo executada como aplicação web](https://dkrn4sk0rn31v.cloudfront.net/uploads/2020/11/aplicacao-navegador.png) Para que seja executada como aplicação desktop, é necessário instalar a ferramenta global `ElectronNET.CLI`: ```shell dotnet tool install ElectronNET.CLI -g ``` Ela irá adicionar no terminal o comando `electronize`. Que precisa ser iniciado: ```shell electronize init ``` [ ![C# (C Sharp) - Introdução ao ASP.NET Core](https://d2knvm16wkt3ia.cloudfront.net/assets/svg-icon/csharp.svg) Curso C# (C Sharp) - Introdução ao ASP.NET Core Conhecer o curso ](https://www.treinaweb.com.br/curso/csharp-avancado-introducao-ao-aspnet-core) Este comando irá adicionar na aplicação um arquivo chamado **electronnet.manifest.json**, que conterá as configurações do Electron.NET. Com isso, agora podemos executá-la como aplicação desktop com o comando abaixo: ```shell electronize start ``` Na primeira execução o Electron.NET irá instalar algumas dependências, então pode demorar um pouco. Nas demais ele é tão rápido quanto o `dotnet run`. Com isso, a tela do nosso programa será exibida: ![Aplicação ASP.NET Core sendo executada como aplicação desktop](https://dkrn4sk0rn31v.cloudfront.net/uploads/2020/11/aplicacao-desktop.png) ## Tornando a aplicação mais desktop No momento a nossa aplicação desktop é apenas uma casca da aplicação web, felizmente o Electron.NET fornece uma série de recursos para torná-la mais desktop. Podemos customizar a janela: ```csharp private async void ElectronStatup() { var window = await Electron.WindowManager.CreateWindowAsync( new BrowserWindowOptions { Width = 1152, Height = 940, Show = false } ); await window.WebContents.Session.ClearCacheAsync(); window.OnReadyToShow += () => window.Show(); window.SetTitle("Exemplo do Electron.NET"); window.OnClosed += () => { Electron.App.Quit(); }; } ``` E até mesmo criar um menu: ```csharp private void CreateMenu() { bool isMac = RuntimeInformation.IsOSPlatform(OSPlatform.OSX); MenuItem[] menu = null; MenuItem[] appMenu = new MenuItem[] { new MenuItem { Role = MenuRole.about }, new MenuItem { Type = MenuType.separator }, new MenuItem { Role = MenuRole.services }, new MenuItem { Type = MenuType.separator }, new MenuItem { Role = MenuRole.quit } }; MenuItem[] fileMenu = new MenuItem[] { new MenuItem { Role = isMac ? MenuRole.close : MenuRole.quit } }; MenuItem[] viewMenu = new MenuItem[] { new MenuItem { Role = MenuRole.reload }, new MenuItem { Role = MenuRole.forcereload }, new MenuItem { Role = MenuRole.toggledevtools }, new MenuItem { Type = MenuType.separator }, new MenuItem { Role = MenuRole.resetzoom }, new MenuItem { Type = MenuType.separator }, new MenuItem { Role = MenuRole.togglefullscreen } }; if (isMac) { menu = new MenuItem[] { new MenuItem { Label = "Electron", Type = MenuType.submenu, Submenu = appMenu }, new MenuItem { Label = "File", Type = MenuType.submenu, Submenu = fileMenu }, new MenuItem { Label = "View", Type = MenuType.submenu, Submenu = viewMenu } }; } else { menu = new MenuItem[] { new MenuItem { Label = "File", Type = MenuType.submenu, Submenu = fileMenu }, new MenuItem { Label = "View", Type = MenuType.submenu, Submenu = viewMenu } }; } Electron.Menu.SetApplicationMenu(menu); } ``` Que deve ser chamado, antes da criação da tela: ```csharp private async void ElectronStatup() { CreateMenu(); var window = await Electron.WindowManager.CreateWindowAsync( //... } ``` ## Criando o executável Ao final do desenvolvimento da aplicação, o executável dela pode ser criado com o comando abaixo: ```shell electronize build /target osx ``` Note que é importante informar a plataforma do executável. Deve-se informar cada uma individualmente: ```shell electronize build /target win electronize build /target osx electronize build /target linux ``` Mas no caso do MacOS (`osx`), devido as particularidades da plataforma, o executável dela só pode ser criado em um ambiente Unix (Linux e/ou MacOS). ## Conclusão Mesmo o .NET fornecendo outras opções para a criação de uma aplicação desktop, o Electron.NET é uma ótima opção para quem deseja criar uma aplicação desktop reaproveitando códigos de uma aplicação web. Isso agiliza o desenvolvimento, principalmente se for necessário criar uma aplicação multiplataforma. No momento ela não possui uma documentação completa, mas a equipe do projeto auxilia a todos com dificuldade no [Gitter](https://gitter.im/ElectronNET/community). Então se quiser saber mais sobre a biblioteca, esta é uma boa fonte de informações. Lembrando que você pode ver o código da aplicação demonstrada aqui no meu [Github](https://github.com/wladimilson/ExemploToDo). - [ #.NET Core ](https://www.treinaweb.com.br/blog/tag/net-core) - [ #ASP.NET ](https://www.treinaweb.com.br/blog/tag/asp-net) - [ #ASP .NET Core ](https://www.treinaweb.com.br/blog/tag/asp-net-core) - [ #Electron ](https://www.treinaweb.com.br/blog/tag/electron) - [ #Electron.NET ](https://www.treinaweb.com.br/blog/tag/electron-net) Autor ![Wladimilson M. Nascimento](//secure.gravatar.com/avatar/f0dd442f156a3eacd2880e9cd0eafbd1?d=mm) ## Wladimilson M. Nascimento Instrutor, nerd, cinéfilo e desenvolvedor nas horas vagas. Graduado em Ciências da Computação pela Universidade Metodista de São Paulo. [Todos os artigos](https://www.treinaweb.com.br/blog/autor/wladimilson-m-nascimento) ## Continue estudando Transforme leitura em prática com os cursos e formações da TreinaWeb. [Ver cursos](https://www.treinaweb.com.br/cursos) Continue lendo ## Artigos relacionados - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2020/05/14132313/o-que-e-o-asp-net-core-400x280.png) [ ASP .NET ](https://www.treinaweb.com.br/blog/categoria/asp-net) 7 anos atrás ## [ O que é o ASP.NET Core? ](https://www.treinaweb.com.br/blog/o-que-e-o-asp-net-core) Uma evolução do ASP.NET, o ASP.NET Core é uma plataforma leve, rápida e modular, que funciona em conjunto com a plataforma .NET Core. Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2018/10/30133314/swagger-400x280.png) [ Desenvolvimento Back-end ](https://www.treinaweb.com.br/blog/categoria/desenvolvimento-back-end) 8 anos atrás ## [ Documentando uma ASP.NET Core Web API com o Swagger ](https://www.treinaweb.com.br/blog/documentando-uma-asp-net-core-web-api-com-o-swagger) Aprenda a documentar uma aplicação ASP .NET Core Web API com o Swagger. Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2021/03/criando-interfaces-graficas-no-c-com-gtk-400x280.png) [ C ](https://www.treinaweb.com.br/blog/categoria/c) 6 anos atrás ## [ Criando interfaces gráficas no C com GTK ](https://www.treinaweb.com.br/blog/criando-interfaces-graficas-no-c-com-gtk) Aplicações Desktop ainda são muito utilizadas. Neste artigo aprenda como utilizar o GTK para criar interfaces gráficas no C. Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2022/05/como-instalar-o-csharp-e-nosso-primeiro-exemplo-400x280.png) [ C# ](https://www.treinaweb.com.br/blog/categoria/csharp) 4 anos atrás ## [ Guia da linguagem C# ](https://www.treinaweb.com.br/blog/guia-da-linguagem-csharp) Nesse guia de C# você aprenderá o necessário para criar os seus primeiros softwares com a linguagem de programação C#. Acesse agora mesmo! Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2021/03/guia-da-linguagem-python-400x280.png) [ Python ](https://www.treinaweb.com.br/blog/categoria/python) 6 anos atrás ## [ Guia da linguagem Python ](https://www.treinaweb.com.br/blog/guia-da-linguagem-python) Entenda os principais conceitos para iniciar seus estudos neste guia da linguagem Python. Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2019/04/05163108/O-QUE-É-PHP-400x280.png) [ PHP ](https://www.treinaweb.com.br/blog/categoria/php) 8 anos atrás ## [ O que é PHP? ](https://www.treinaweb.com.br/blog/o-que-e-php) Neste artigo veremos o que é PHP e algumas de suas características e vantagens. Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2020/03/18171011/ELECTRON-400x280.png) [ Desenvolvimento Front-end ](https://www.treinaweb.com.br/blog/categoria/desenvolvimento-front-end) 7 anos atrás ## [ O que é Electron? ](https://www.treinaweb.com.br/blog/o-que-e-electron) Veja neste artigo o que é o Electron. Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2019/07/19173134/IONIC-400x280.png) [ Desenvolvimento Mobile ](https://www.treinaweb.com.br/blog/categoria/desenvolvimento-mobile) 7 anos atrás ## [ O que é Ionic? ](https://www.treinaweb.com.br/blog/o-que-e-ionic) Veja neste artigo o que é o Ionic, principal Framework para desenvolvimento de aplicações móveis híbridas. Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2019/12/10103951/capa-5-linguagens-400x280.png) [ Carreira ](https://www.treinaweb.com.br/blog/categoria/carreira) 7 anos atrás ## [ 5 linguagens de programação promissoras para se estudar em 2020 ](https://www.treinaweb.com.br/blog/5-linguagens-de-programacao-promissoras-para-se-estudar-em-2020) Nada melhor do que finalizar o ano de 2019 já sabendo quais as linguagens devem se destacar no próximo ano. Que tal aproveitar e traçar uma meta de estudos envolvendo as linguagens mais promissoras para 2020? Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2022/05/O-QUE-E-PHP-400x280.png) [ PHP ](https://www.treinaweb.com.br/blog/categoria/php) 5 anos atrás ## [ Guia da linguagem PHP ](https://www.treinaweb.com.br/blog/guia-da-linguagem-php) Nesse guia de PHP você aprenderá o necessário para criar os seus primeiros softwares com a linguagem de programação PHP. Acesse agora mesmo! Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2017/08/java-csharp-ou-php-qual-linguagem-escolher-400x280.jpg) [ Desenvolvimento Back-end ](https://www.treinaweb.com.br/blog/categoria/desenvolvimento-back-end) 9 anos atrás ## [ Java, C# ou PHP: qual linguagem escolher? ](https://www.treinaweb.com.br/blog/java-csharp-ou-php-qual-linguagem-escolher) Qual linguagem escolher? Java, C# ou PHP? Quais são as vantagens de cada uma? Vamos analisar estas dúvidas que são comuns para quem está começando. Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2019/11/04160957/EXECUTAVEL-APLICACAO-JAVA-400x280.png) [ Java ](https://www.treinaweb.com.br/blog/categoria/java) 7 anos atrás ## [ Criando um executável para uma aplicação Java ](https://www.treinaweb.com.br/blog/criando-um-executavel-para-uma-aplicacao-java) Aprenda como transformar uma aplicação Java Desktop em um arquivo executável. Ler artigo ## Um ano de acesso total para você viver de programação. Todos os cursos e formações da TreinaWeb numa única assinatura, com professores que atuam no mercado, suporte direto e certificados. Do primeiro `console.log` ao mercado de trabalho. - **1 ano** de acesso a **todos os cursos** - Cursos novos **toda semana** - Suporte **direto com professores** - Plano de carreira **personalizado** - **Certificados digitais** inclusos - **Aplicativos** para Android e iOS, com **acesso offline** **Garantia incondicional de satisfação** Teste por 7 dias e, se não fizer sentido para você, devolvemos seu dinheiro. ### Acesso completo a todos os cursos e dezenas de Formações. 12 meses Economize R$ 840,00 54% OFF de 12x R$ 129,00 por apenas 12x R$ 59,00 sem juros no cartão de crédito ou R$ 599,00 à vista Oferta termina em **17h 51min 39s** - Acesso imediato e ilimitado durante 1 ano. - Plano de carreira personalizado. - Suporte direto com professores. - E muito mais! [Matricule-se agora](https://www.treinaweb.com.br/checkout/pagamento/plano/anual?cupom=TW-SCLIENTE26) [ ](https://www.treinaweb.com.br) Escola online de programação, tecnologia e IA. - [ ](https://www.facebook.com/TreinaWeb/) - [ ](https://www.instagram.com/treinaweb/) - [ ](https://www.youtube.com/user/TreinaWeb) - [ ](https://twitter.com/treinaweb) - [ ](https://www.linkedin.com/company/treinaweb) - [ ](https://github.com/treinaweb) ## Inscreva-se em nossa newsletter Receba lançamentos, promoções e novidades. Seu nome Seu WhatsApp Seu melhor e-mail Inscrever-se ## Cursos - [ Base para Devs ](https://www.treinaweb.com.br/categoria/base-para-devs) - [ Front-end ](https://www.treinaweb.com.br/categoria/desenvolvimento-front-end) - [ Back-end ](https://www.treinaweb.com.br/categoria/desenvolvimento-back-end) - [ Mobile ](https://www.treinaweb.com.br/categoria/desenvolvimento-mobile) - [ Bancos de Dados ](https://www.treinaweb.com.br/categoria/bancos-de-dados) - [ Cloud ](https://www.treinaweb.com.br/categoria/cloud-computing) - [ IA ](https://www.treinaweb.com.br/categoria/ia) - [ E mais ](https://www.treinaweb.com.br/categoria/e-mais) - [ Ver todos os cursos ](https://www.treinaweb.com.br/cursos) ## Conteúdo - [ Formações ](https://www.treinaweb.com.br/formacoes) - [ Projetos práticos ](https://www.treinaweb.com.br/projetos-praticos) - [ Direto ao ponto ](https://www.treinaweb.com.br/direto-ao-ponto) - [ Planos ](https://www.treinaweb.com.br#assinatura) - [ Depoimentos ](https://www.treinaweb.com.br#depoimentos) - [ Comunidade ](https://www.treinaweb.com.br#comunidade) - [ Corpo docente ](https://www.treinaweb.com.br#docente) ## A empresa - [ Sobre a TreinaWeb ](https://www.treinaweb.com.br#sobre) - [ Perguntas frequentes ](https://www.treinaweb.com.br#faq) - [ Vantagens de estudar na TreinaWeb ](https://www.treinaweb.com.br/vantagens-de-estudar-na-treinaweb) - [ Cursos para empresas ](https://www.treinaweb.com.br/empresas) - [ Sugira um novo curso ](https://www.treinaweb.com.br/sugerir-curso) - [ Trabalhe conosco ](https://www.treinaweb.com.br/trabalhe-conosco) - [ Artigos ](https://www.treinaweb.com.br/blog) - [ Desenvolvedores e agentes ](https://www.treinaweb.com.br/developers) - [ Contato ](https://www.treinaweb.com.br/contato) - [ Política de privacidade ](https://www.treinaweb.com.br/politica-de-privacidade) - [ Termos de uso ](https://www.treinaweb.com.br/termos-de-uso) ## Baixe nosso aplicativo [ Disponível na **App Store** ](https://apps.apple.com/us/app/treinaweb/id1322729447) [ Disponível no **Google Play** ](https://play.google.com/store/apps/details?id=br.com.treinaweb.mobile) Av. Paulista, 1765, Conj 71 e 72 · Bela Vista · São Paulo · SP · 01311-200 © 2004 – 2026 TreinaWeb Tecnologia LTDA · CNPJ 06.156.637/0001-58