elixir_bi.md

Jak přidat mini BI Dashboard do Elixir projektu

Když chcete přidat 2-3 grafy jako počet sign-upů za den nebo počet nových zakázek po týdnech. V Elixiru existuje aplikace phoenix_live_dashboard. Ta sama o sobě zobrazuje základní statistiky jako verze Elixiru, běžící aplikace, pomalé Ecto query, velikost databáze apod. Co se moc neví je, že do live_dashboard jdou jednoduše přidávat další záložky. Takže pokud už phoenix_live_dashboard v projektu máte, tak použít jej k vytvoření mini BI dashboardu je extrémně jednoduché. Ukážeme si jak na to.

Výhodou použití live_dashboard oproti třeba LiveBooku je, že je to jednoduchá závislost, kterou už v projektu nejspíš máte. Přidat LiveBook může být malinko složitější. Kvůli jednomu, dvěma grafům to uplně nemusí stát za to. Další výhodou je, že můžete použít veškerý existující kód k sestavení dat k zobrazení. To je výhoda oproti externím BI řešení, do kterých musíte vyexportovat SQL databázi a naučit se nový query jazyk. S live_dashboardem máte plnou sílu Ecta a Elixiru.

Takže pojďme na to:

1. Přidejte phoenix_live_dashboard (pokud už nemáte)

2. Přidejte závislost do mix.exs na Contex kvůli grafům

{:contex, "~> 0.5.0"}

3. Přidejte novou Page

defmodule MyAppWeb.Dashboard.Stats do
  @moduledoc false
  use Phoenix.LiveDashboard.PageBuilder

  @impl true
  def menu_link(_, _) do
    {:ok, "Business"}
  end

  @impl true
  def render(assigns) do

    # zde muze byt Ecto Query, ktera ziska data
    data = [{"2024-01-22", 4}, {"2024-01-18", 3}]

    svg_chart =
      [{"Start", 0}] ++ data
      |> Enum.map(fn {date, val} -> ["#{date}", val] end)
      |> Contex.Dataset.new()
      |> Contex.Plot.new(Contex.BarChart, 800, 400)
      |> Contex.Plot.to_svg()

    assigns = assign(assigns, :chart, svg_chart)

    ~H"""
      <%= Phoenix.HTML.raw(@chart) %>
    """
  end

end

4. Přidejte additional_pages: do live_dashboard routeru:

  scope "/" do
    pipe_through :basic_auth_admin
    live_dashboard "/live_dashboard",
      ecto_repos: [MyApp.Repo],
      additional_pages: [
        business: MyAppWeb.Dashboard.Stats
      ]
  end

A je hotovo. Pokud chcete zobrazit živá data, prostě přidejte import Ecto.Query a proměnnou data naplňte z vašeho Repa.

Užitečné odkazy:

• knihovna Contex
• LiveDashboard PageBuilder