Workflow Config
At Lamatic.ai, we understand that every GenAI application has unique requirements and complexities. To empower our users with the flexibility and control they need, we've introduced the Workflow Configuration feature, transforming our platform into a powerful Low Code, No Code solution.
Workflow Config Editor (Code View)
Lamatic.ai's Workflow Config Editor( Code View ) is a game-changer for developers and power users alike. This intuitive code editor allows you to define and customize your entire workflow configuration using a simple yet expressive syntax.
It is a combination of nodes and edges.
The nodes represent the different components of the workflow, while the edges define the connections between these components.
To enter into the code view of the workflow, click on the Code View toggle on the top of the workflow editor.
With a simple click, you can switch between the visual, no-code interface and the Workflow Config Code Editor, allowing you to choose the development approach that best suits your needs.
Let's understand the workflow config with an example:
Example Workflow
Code view for the workflow:
{
"nodes": [
{
"id": "1",
"data": {
"name": "TriggerNode"
},
"type": "TriggerNode",
"width": 240,
"height": 107,
"position": {
"x": 0,
"y": 0
},
"sourcePosition": "bottom",
"targetPosition": "top"
},
{
"id": "3",
"data": {
"label": "something"
},
"type": "OutputNode",
"width": 240,
"height": 107,
"dragging": false,
"position": {
"x": 0,
"y": 1200
},
"selected": false,
"sourcePosition": "bottom",
"targetPosition": "top",
"positionAbsolute": {
"x": 460.9596029374933,
"y": 1211.7389417936542
}
},
{
"id": "dndnode_0",
"data": {
"label": "dynamicNode node",
"nodeId": "LLMNode",
"values": {
"nodeName": "LLM",
"promptTemplate": "You are an expert Technical Blog Writer. Write a blog on the topic ${workflow['start']['input']}.",
"generativeModelName": "gpt-4o"
}
},
"type": "dynamicNode",
"width": 240,
"height": 69,
"dragging": false,
"position": {
"x": 676.8417187504645,
"y": 242.5268006375551
},
"selected": false
}
],
"edges": [
{
"id": "reactflow__edge-1-dndnode_0",
"type": "CustomAddEdge",
"source": "1",
"target": "dndnode_0",
"sourceHandle": null,
"targetHandle": null
},
{
"id": "reactflow__edge-dndnode_0-3",
"type": "CustomAddEdge",
"source": "dndnode_0",
"target": "3",
"sourceHandle": null,
"targetHandle": null
}
]
}Now, let's break down the example and explain each part.
Nodes
Nodes represent individual steps or components in a workflow. Each node has several key properties:
- id: A unique identifier for the node.
- data: Contains additional information specific to the node.
name: Name of the node.label: Label for the node.nodeId: Identifier for dynamic nodes.values: Custom values for the node.
- type: Specifies the type of the node (e.g.,
TriggerNode,OutputNode,dynamicNode). - position: The x and y coordinates of the node in the UI.
- width and height: The dimensions of the node.
Here are some examples of different types of nodes:
-
TriggerNode
{ "id": "1", "data": { "name": "TriggerNode" }, "type": "TriggerNode", "width": 240, "height": 107, "position": { "x": 0, "y": 0 }, "sourcePosition": "bottom", "targetPosition": "top" } -
OutputNode
{ "id": "3", "data": { "label": "something" }, "type": "OutputNode", "width": 240, "height": 107, "position": { "x": 0, "y": 1200 }, "sourcePosition": "bottom", "targetPosition": "top" } -
DynamicNode
{ "id": "dndnode_0", "data": { "label": "dynamicNode node", "nodeId": "LLMNode", "values": { "nodeName": "LLM", "promptTemplate": "You are an expert Technical Blog Writer. Write a blog on the topic ${workflow['start']['input']}.", "generativeModelName": "gpt-4o" } }, "type": "dynamicNode", "width": 240, "height": 69, "position": { "x": 676.8417187504645, "y": 242.5268006375551 } }
Edges
Edges define the connections between nodes, indicating the flow of data or control. Key properties include:
- id: A unique identifier for the edge.
- type: Specifies the type of the edge (e.g.,
CustomAddEdge). - source: The id of the source node.
- target: The id of the target node.
Here are the examples of edges in the workflow:
-
Edge from TriggerNode to dynamicNode
{ "id": "reactflow__edge-1-dndnode_0", "type": "CustomAddEdge", "source": "1", "target": "dndnode_0" } -
Edge from dynamicNode to OutputNode
{ "id": "reactflow__edge-dndnode_0-3", "type": "CustomAddEdge", "source": "dndnode_0", "target": "3" }
Common Issues
- Node Overlapping: Ensure nodes have unique positions to avoid overlapping.
- Missing Connections: Verify that all nodes are correctly connected with edges.
Low Code, No Code, and Everything in Between
The Workflow Configuration feature solidifies Lamatic.ai's position as a true Low-Code/No-Code platform. Whether you're a seasoned developer looking to harness the full power of code, or a non-technical user seeking a user-friendly, visual interface, Lamatic.ai has you covered.
For those preferring a no-code approach, our intuitive visual interface allows you to design and orchestrate your GenAI workflows without writing a single line of code. Conversely, developers can leverage the Workflow Configuration Code Editor to craft intricate and sophisticated workflows, tailored to their specific requirements.
Moreover, Lamatic.ai supports a seamless blend of both approaches, enabling you to combine the convenience of the visual interface with the power and flexibility of code, creating a truly hybrid development experience. approach that best suits your needs, ensuring that your GenAI applications are tailored to perfection, without compromising on flexibility or control.