Host.Web (Beamlet v0.1.1)

Copy Markdown View Source

The use line for a module on your beamlet's web surface.

One line brings in the framework for the module's role, plus Phoenix.HTML, the JS alias and the ~p sigil for paths in templates:

defmodule Todo.PageLive do
  use Host.Web, :live_view

  def mount(_params, _session, socket) do
    {:ok, assign(socket, page_title: "Todos", todos: Todo.List.all())}
  end

  def render(assigns) do
    ~H"""
    <ul :for={todo <- @todos}><li>{todo.name}</li></ul>
    <.link navigate={~p"/todos/new"}>Add one</.link>
    """
  end
end

:live_view for an HTML page, mounted with Host.Router.live/2; :controller for JSON API and webhook actions, mounted with the Host.Router function named after the HTTP verb, JSON-only with no session or CSRF; :live_component for a stateful component a page renders with <.live_component>; :html for a module of shared function components.

A template is a ~H sigil in render/1; ~p is for the paths inside it, never the template itself. <.link navigate={~p"..."}> or <.link patch={...}> keeps navigation on the LiveView socket where a plain <a href> reloads the page. Pages render inside the layout your beamlet gives agent pages, with Tailwind utility classes available; no stylesheet or asset setup is needed. The layout paints the page background and text colour for light and dark mode, following the visitor's system setting, so a page's own dark: classes land on a matching canvas. It also titles the browser tab with the page's page_title assign, so set one in mount/3. For live updates, broadcast from the action that receives the change with Host.PubSub and subscribe in the LiveView's mount/3.

Summary

Functions

use Host.Web, :live_view | :controller | :live_component | :html, see the module documentation for what each brings in.

Functions

__using__(which)

(macro)

use Host.Web, :live_view | :controller | :live_component | :html, see the module documentation for what each brings in.