Apps
AI chat
Stream LLM responses to your UI over MQTT with no WebSocket server required.
What it does
AI chat interface where users send prompts and receive streamed LLM responses over MQTT. The browser subscribes to a response topic and displays tokens as they arrive, giving users a real-time typing effect. No WebSocket server required - MQTT handles the transport.
Tech stack
| Layer | Library |
|---|---|
| App framework | Next.js |
| Browser MQTT connection | @cloudsignal/mqtt-client |
| Server-side LLM calls (Claude API) | Anthropic SDK |
| Styling | Tailwind CSS |
Key components
| Component | What it does |
|---|---|
| Chat UI | Message bubbles with streaming text display, showing both user prompts and assistant responses in a familiar chat layout |
| MQTT connection | Browser client subscribes to a per-conversation response topic and receives tokens as they are generated |
| Token streaming | Each LLM token is published as an individual MQTT message, enabling real-time character-by-character display in the UI |
| Server endpoint | Receives user prompts via HTTP, calls the Anthropic API with streaming enabled, and publishes each response token back to the client via MQTT |
Build with AI
This app pairs naturally with AI development platforms like Lovable or v0. Use the prompt below as a starting point:
Example prompt
Build an AI chat interface using @cloudsignal/mqtt-client that streams responses from Claude API over MQTT with typing indicators
Customize the generated app by adding conversation history, model selection, or system prompt configuration.
Resources
- Source on GitHub: cloudsignal/example-ai-chat
- Related guide: AI transport