DNN Builder

The Deep Neural Network Builder at frontend/ml-workbench/src/components/DNNBuilder/ provides a visual interface for designing neural network architectures with a layer palette, interactive graph editor, conversational AI builder, and code generation.

Components

Component	File	Purpose
`DNNBuilder (index)`	`index.tsx`	Main builder layout with panels
`LayerPalette`	`LayerPalette.tsx`	Draggable layer type catalog
`NetworkGraph`	`NetworkGraph.tsx`	React Flow graph for network topology
`LayerNode`	`nodes/LayerNode.tsx`	Custom React Flow node for layers
`LayerPropertyPanel`	`LayerPropertyPanel.tsx`	Layer configuration side panel
`ConversationalBuilder`	`ConversationalBuilder.tsx`	AI chat for network design
`CodeEditor`	`CodeEditor.tsx`	Generated PyTorch/TensorFlow code

Layer Catalog

File: frontend/ml-workbench/src/components/DNNBuilder/layerCatalog.ts

Pre-defined layer types with default configurations:

Category	Layers
Input	Input, Embedding
Core	Dense, Dropout, BatchNorm
Convolution	Conv1D, Conv2D, Conv3D
Recurrent	LSTM, GRU, Bidirectional
Pooling	MaxPool, AvgPool, GlobalPool
Attention	MultiHeadAttention, SelfAttention
Normalization	LayerNorm, GroupNorm
Output	Softmax, Sigmoid, Linear

DNN Builder State

File: frontend/ml-workbench/src/stores/dnnBuilderStore.ts

Zustand store managing the network topology:

interface DNNBuilderState {
  layers: LayerConfig[];
  connections: Connection[];
  selectedLayerId: string | null;
  addLayer: (layer: LayerConfig) => void;
  removeLayer: (layerId: string) => void;
  updateLayerConfig: (layerId: string, config: Partial<LayerConfig>) => void;
  addConnection: (from: string, to: string) => void;
}

ConversationalBuilder

AI-powered network design through natural language:

User: "Build a CNN for image classification with 3 conv layers"
AI: Creates Conv2D -> MaxPool -> Conv2D -> MaxPool -> Conv2D -> Flatten -> Dense -> Softmax

WebSocket Integration

File: frontend/ml-workbench/src/hooks/useDNNWebSocket.ts

Real-time training progress and architecture validation via WebSocket.

AutoML Wizard Model Registry