liveview-js-interop
LiveView JavaScript Interoperability
Expert guidance for integrating JavaScript with Phoenix LiveView — from zero-JS declarative commands to full third-party library integration.
Decision Framework: When to Use What
Pick the simplest tool that solves the problem. Escalate only when needed.
1. phx- bindings + JS commands → No JS file needed. Declarative, patch-safe.
2. JS.dispatch + addEventListener → Custom client events without hooks.
3. Colocated hooks (LV 1.1+) → Small JS tied to a specific component.
4. Traditional phx-hook → Reusable hooks shared across views.
5. LiveSvelte component → Complex reactive UI (editors, charts, drag-and-drop).
| Approach | JS File? | Patch-Safe? | Reusable? | Best For |
|---|---|---|---|---|
phx-click, phx-change |
No | Yes | N/A | Standard events |
More from hwatkins/my-skills
elixir-tdd
Test-driven development enforcement for Elixir and Phoenix. Requires failing tests before implementation. Use when implementing features, fixing bugs, or when code quality discipline is needed.
23spam-prevention
When the user needs to prevent spam signups, bot accounts, fake registrations, or abuse of signup/trial flows. Also use when mentioning "spam accounts," "fake signups," "bot registrations," "disposable emails," "signup abuse," or "trial fraud." For broader security concerns, see saas-security.
14elixir-otp
OTP patterns for Elixir — GenServer, Agent, Task, ETS, supervision trees, Registry, and process design. Use when designing concurrent systems, stateful processes, or deciding when (and when NOT) to use processes.
8rust-tdd
Test-driven development enforcement for Rust. Requires failing tests before implementation. Use when implementing features, fixing bugs, or when code quality discipline is needed.
5rust-core
Expert Rust development with ownership, borrowing, lifetimes, traits, error handling, and idiomatic patterns. Use for any Rust code.
4rust-async
Async Rust with Tokio, futures, concurrency patterns, channels, and performance. Use when building async services, networking, or concurrent Rust applications.
4