Skip to content

elixir-webrtc/live_ex_webrtc

Folders and files

NameName
Last commit message
Last commit date

Latest commit

0db2d9a · Mar 6, 2025

History

34 Commits
Mar 6, 2025
Mar 6, 2025
Oct 28, 2024
Feb 24, 2025
Sep 8, 2024
Oct 7, 2024
Feb 22, 2025
Feb 22, 2025
Feb 22, 2025
Sep 8, 2024

Repository files navigation

LiveExWebRTC

Hex.pm API Docs

Phoenix Live Components for Elixir WebRTC.

Installation

In your mix.exs:

def deps do
  [
    {:live_ex_webrtc, "~> 0.6.0"}
  ]
end

In your tailwind.config.js

module.exports = {
  content: [
    "../deps/live_ex_webrtc/**/*.*ex" // ADD THIS LINE
  ]
}

Usage

LiveExWebRTC comes with two Phoenix.LiveViews:

  • LiveExWebRTC.Publisher - sends audio and video via WebRTC from a web browser to a Phoenix app (browser publishes)
  • LiveExWebRTC.Player - sends audio and video via WebRTC from a Phoenix app to a web browser and plays it in the HTMLVideoElement (browser subscribes)

See module docs and live_broadcaster for more.

Local development

For local development:

  • include live_ex_webrtc in your mix.exs via path

  • modify NODE_PATH env variable in your esbuild configuration, which is located in config.exs - this will allow for importing javascript hooks from live_ex_webrtc.

    For example:

    config :esbuild,
      # ...
      default: [
        # ...
        env: %{
          "NODE_PATH" => "#{Path.expand("../deps", __DIR__)}:/path/to/parent/dir/of/live_ex_webrtc"
        }
      ]
  • modify content in tailwind.config.js - this will compile tailwind classes used in live components.

    For example:

    module.exports = {
      content: [
        // ...
        "../deps/**/*.ex"
      ]
    }

Important {: .info}

Separate paths with : on MacOS/Linux and with ; on Windows.

Important {: .info}

Specify path to live_ex_webrtc's parent directory.