openui-forge-elixirlisted
Install: claude install-skill OthmanAdi/openui-forge
# OpenUI Forge — Elixir
Build generative UI apps with a React frontend + Elixir Phoenix backend. Streams OpenAI API responses directly to the browser as SSE using `Plug.Conn.send_chunked/2` and the Req HTTP client's streaming `:into` collector.
## Activation Triggers
- "openui elixir", "openui phoenix", "openui elixir backend"
- "generative ui elixir", "elixir streaming ui backend", "phoenix sse openui"
## Prerequisites
- Node.js >= 22 (24 LTS recommended) + React >= 18.3.1 (19+ recommended) (frontend)
- Elixir >= 1.15 with Erlang/OTP 25+ (Phoenix 1.8 baseline)
- Phoenix ~> 1.8 (current stable; 1.8.8 as of June 2026)
- `OPENAI_API_KEY` environment variable set
## Quick Start
1. Create the React frontend and install OpenUI deps:
```bash
npm install @openuidev/react-ui @openuidev/react-headless @openuidev/react-lang lucide-react zod
```
2. Generate the system prompt into the Phoenix app's `priv/`:
```bash
npx @openuidev/cli generate ./src/lib/library.ts --out backend/priv/system-prompt.txt
```
3. Create the Phoenix backend (see Full Code below)
4. Run: `mix deps.get && mix phx.server` on `:4000`, frontend on `:3000`
## Full Code
### Backend: `backend/mix.exs` (deps)
```elixir
defp deps do
[
{:phoenix, "~> 1.8.0"},
{:bandit, "~> 1.0"}, # HTTP server (Phoenix 1.8 default)
{:jason, "~> 1.4"}, # JSON encode/decode
{:req, "~> 0.6"}, # HTTP client with streaming :into (v0.6.2+)
{:cors_plug, "~> 3.0"} # explicit-origin CORS
]
end