Getting Started
Configurability refers to the ability of UI components and behaviors to be dynamically driven by server-provided configuration. In the context of Flash, configurability allows components to adapt their data, styles, and interactions based on JSON or similar config formats without requiring code changes or app updates. This includes making visual elements configurable through styling, functional behavior through events and actions, and structural flexibility through overrides.
By enabling configurability, developers can create flexible, testable, and version-aware UI experiences that are controlled remotely from the server.
UI
UI defines the visual structure and presentation of the screen. It includes components such as buttons, cards, inputs, images, and layout containers. These components are configured via server-supplied data and styling properties, enabling the app to render screens dynamically while maintaining platform-specific theming and consistency.
Behaviour (Coming Soon)
Behaviour defines how UI components respond to user interactions. It consists of:
Events: Triggers such as onPress, onChange, or onScroll
Actions: The side effects or logic executed in response, such as navigation, API calls, or analytics
By making behavior configurable, Flash enables dynamic user flows, feature toggles, and personalized interactions—without hardcoding logic into the app.
Steps to make UI Configurable
Make Component Configurable
Wrap your existing UI component in a way that allows it to consume configuration from the Flash system. This includes:
Accepting configProps for data and styles
Applying the received styles to the component’s layout
Rendering dynamic values based on the config-driven data
This wrapper ensures the component can adapt its appearance and behavior without code changes.
Register Configured Component
Once the component is made configurable, register it with the Flash system using a unique componentName. This makes it available for use in templates created via the dashboard.
Registered components must follow the expected schema and can now be referenced and configured dynamically at runtime by the server.
Steps to make Behaviour Configurable (Coming soon)
Configure Events
Events define how a component responds to user interactions (e.g., taps, changes, scrolls). In Flash, events are made configurable inside the component, and their configuration is tightly coupled with the component’s wrapper. Events are not configured separately in templates, they are defined and registered as part of making the component configurable.
If a component doesn’t use any events, this step can be skipped.
Make Event Configurable
Inside the component wrapper, wire up the event handler to read from configProps.events.
Ensure the event follows the standard schema defined for that event type so that the Flash engine can interpret and execute it consistently across different components.
This enables you to pass arguments, trigger actions, and compose conditional flows all from config.
Register Event
Register each event used by the component using a unique name, so the Flash system can map and handle it correctly.
If an event with the same name is already registered globally (with the same schema), re-registration is not needed.
Multiple events can be registered if the component supports more than one interaction.
Configure Actions
Actions define the side effects or operations that occur in response to events such as navigation, API calls, logging, or custom logic. In the Flash system, actions are configured and registered independently of components and events.
Make Actions Configurable
Design your action to accept arguments and callbacks from config and execute the desired logic. Ensure the action supports:
Arguments from config
Optional success and failure actions
Nested execution when needed
This structure allows actions to be chained or wrapped for retry/fallback logic.
Register Configured Actions
Register each action using a unique identifier via the Flash action registry. This makes the action available across all components and templates.
Since actions are decoupled from components, they can be reused across the app. The SDK uses the registered action name in the config to resolve and execute the correct logic when triggered by an event.
Last updated