flutter-duit-bdui_skill

Overview

This skill integrates the Duit backend-driven UI framework into Flutter applications to render layouts and handle server-driven interactions. It provides setup guidance, driver and transport configuration (HTTP, WebSocket, or static), custom widget registration, theme and component registration, and lifecycle management. Use it to let a server control UI layout and updates without shipping new app builds.

How this skill works

The skill configures an XDriver to receive JSON view definitions from a transport (HTTP, WebSocket, or static). DuitRegistry is used to register custom widgets, themes, and reusable components. DuitViewHost wraps your Flutter UI and streams layout updates to Flutter widgets, while drivers handle message decoding, reconnection, and remote actions.

When to use it

• You need backend-driven UI so layouts update without app releases.
• Integrating flutter_duit into an existing Flutter app.
• Building custom widgets that the server can reference by type.
• Configuring transport: polling REST endpoints or real-time WebSocket feeds.
• Registering reusable components and templates on app startup.

Best practices

• Register custom widgets and components during app initialization via DuitRegistry before runApp.
• Always manage driver lifecycle: create drivers in initState and dispose them in dispose to avoid leaks.
• Use static drivers or mock transports for local development and tests to isolate server behavior.
• Provide custom decoders/encoders if your API uses nonstandard payload formats or binary envelopes.
• Secure transports: attach auth headers and handle token refresh in transport managers.

Example use cases

• Render marketing or layout changes controlled by the backend without an app update (A/B layouts, promos).
• Real-time dashboards updated via WebSocket transport for live data feeds.
• Local testing with XDriver.static to iterate UI templates without server dependencies.
• Create a CardComponent template and supply different data payloads from the server to populate lists.
• Implement a custom transport to integrate with an internal messaging system or specialized API.