Search code examples
elixirwxwidgetsphoenix-frameworkphoenix-live-view

Making desktop apps in Elixir

Background

In my quest to make a desktop app with Elixir for Windows (I have given up the idea of doing multi-desktop apps for now) I am trying to create a HelloWorld Desktop app.

This app is basically what you get from running mix phx.new hello. I am using Phoenix’s latest version, so I don’t have to deal with SASS nor anything alike, which honestly is a blessing since this means I don’t have any more node-gyp issues. Making it desktop friendly

As some of you may have realized however, just creating a Phoenix project won’t make it a Desktop app. This is where the Desktop project comes in:

This is a dependency that allows you to make your applications Desktop like. Since I have run the Sample app in the past:

I figured I would try to tear it apart and try to launch the simplest, dummiest HelloWorld app I could. Basically, when I run mix iex -S I want it to instead of opening a window in my browser for it to open a desktop app.

Problem

I have added all the dependencies and I have a somewhat similar project structure to what the sample app has:

mix.exs

defmodule Hello.MixProject do
  use Mix.Project

  def project do
    [
      app: :hello,
      version: "0.1.0",
      elixir: "~> 1.12",
      elixirc_paths: elixirc_paths(Mix.env()),
      compilers: [:phoenix, :gettext] ++ Mix.compilers(),
      start_permanent: Mix.env() == :prod,
      aliases: aliases(),
      deps: deps()
    ]
  end

  def application do
    [
      mod: {Hello.Application, []},
      extra_applications: [:logger, :runtime_tools, :inets, :observer, :wx]
    ]
  end

  defp elixirc_paths(:test), do: ["lib", "test/support"]
  defp elixirc_paths(_), do: ["lib"]

  defp deps do
    [
      {:phoenix, "~> 1.6.2"},
      {:phoenix_html, "~> 3.0"},
      {:phoenix_live_reload, "~> 1.2", only: :dev},
      {:phoenix_live_view, "~> 0.16.0"},
      {:floki, ">= 0.30.0", only: :test},
      {:phoenix_live_dashboard, "~> 0.5"},
      {:esbuild, "~> 0.2", runtime: Mix.env() == :dev},
      {:swoosh, "~> 1.3"},
      {:telemetry_metrics, "~> 0.6"},
      {:telemetry_poller, "~> 1.0"},
      {:gettext, "~> 0.18"},
      {:jason, "~> 1.2"},
      {:plug_cowboy, "~> 2.5"},

      {:desktop, github: "elixir-desktop/desktop", tag: "v1.3.1"},
      {:credo, "~> 1.5", only: [:dev, :test], runtime: false}
    ]
  end

  defp aliases do
    [
      setup: ["deps.get"],
      "assets.deploy": ["esbuild default --minify", "phx.digest"]
    ]
  end
end

However, nothing I do works. There are no errors in the console, but the desktop app won’t start. I am willing to throw everything away, all I want is to have a way of opening this in a desktop window.

I think there might be a config issue, but I can’t be sure since the sample app is done with an older version of Phoenix that uses SASS.

Question

Can someone help me figure out what is the MNE to have this open a desktop window?

I have the project open sourced here:

Solution

  • I pulled down you code and it seems to work just fine. You need to run it with iex -S mix phx.server or mix phx.server thought instead.

    A couple of things:

    1. iex is not a mix task it's the interactive elixir shell you can run your program with an interactive shell by calling iex with -S the script tag followed by you mix command.

    2. You app is as most phoenix app are, to boot the endpoint when you call mix phx.server otherwise the app will start without spinning up the endpoint that allows it to respond to web requests. Elixir-Desktop launches with the endpoint.