🧠 NetBuilder - Visual Neural Network Builder (MVP)

Build neural networks visually! A drag-and-drop interface for creating PyTorch models with pre-built templates for popular architectures like DeepSeek, Mistral, ResNet, and more.

✨ Features

Note: Listed features represent the intended functionality. Some features are partially implemented or in development.

🎯 Visual Model Building

• Drag & Drop Interface: Build networks by connecting layers visually ✅
• Real-time Validation: Smart connection validation with helpful error messages ✅
• Parameter Tuning: Adjust layer parameters with sliders and direct input ✅
• Live Preview: See your network structure as you build (Partial)

🏗️ Rich Layer Library

• Linear Layers: Linear, Bilinear with configurable dimensions
• Convolutional: Conv1d/2d/3d with kernel, stride, padding controls
• Normalization: BatchNorm1d/2d (automatically suggests correct type)
• Activations: ReLU, GELU, Sigmoid, Tanh, LeakyReLU, Softmax
• Pooling: MaxPool, AvgPool with adaptive variants
• Advanced: LSTM, MultiheadAttention, Mixture of Experts
• Utilities: Dropout, Flatten, Reshape

🚀 Pre-built Templates

• 🤖 Transformers: DeepSeek V3, Mistral 7B architectures
• 👁️ CNNs: ResNet-50, AlexNet for computer vision
• 🔄 RNNs: LSTM Language Models for sequence processing
• 📊 MLPs: Batch-normalized multi-layer perceptrons

🔧 Smart Features

• Connection Validation: Prevents incompatible layer connections
• Dimension Checking: Automatically validates tensor dimensions
• Parameter Suggestions: Helpful hints for fixing dimension mismatches
• Code Generation: Export to clean PyTorch code

🚀 Quick Start

Prerequisites

• Node.js 18+
• npm or yarn

Installation

# Clone the repository
git clone https://github.com/yourusername/netbuilder.git
cd netbuilder

# Install dependencies
npm install

# Start development server
npm run dev

Open http://localhost:3000 in your browser.

🎮 How to Use

1. Choose Your Approach

🏗️ Build from Scratch

1. Switch to the "Layers" tab in the left panel
2. Drag layers from the palette to the canvas
3. Connect layers by clicking and dragging between connection points
4. Adjust parameters in the right panel when layers are selected

📋 Start with Templates

1. Switch to the "Templates" tab in the left panel
2. Browse by category: Transformers, CNNs, RNNs, Other
3. Click "Load" on any template to start with a pre-built architecture
4. Customize the loaded template to your needs

2. Layer Connection

• Green dots indicate valid connection points
• Smart validation prevents incompatible connections
• Error messages guide you to fix dimension mismatches
• Hover preview shows connection compatibility

3. Parameter Tuning

• Select any layer to edit its parameters
• Use sliders for quick adjustments
• Type exact values in number inputs for precision
• Real-time validation ensures parameter compatibility

4. Export Code

• Click "Generate Code" to export PyTorch implementation
• Copy the generated code to your Python environment
• All imports and proper class structure included

🛠️ Technical Details

Built With

• Frontend: Next.js 14, React 18, TypeScript
• Styling: Tailwind CSS
• Icons: Lucide React
• State Management: Zustand
• Validation: Custom connection validation system

Key Components

• ModelCanvas: React Flow-based drag & drop interface
• LayerPalette: Categorized layer library with search
• ParameterPanel: Dynamic parameter editing with validation
• ConnectionValidation: Smart tensor dimension checking
• CodeGenerator: PyTorch code export functionality

Connection Validation

The system automatically validates:

• Tensor Dimensions: Ensures compatible input/output shapes
• Layer Compatibility: Prevents invalid layer combinations
• BatchNorm Types: Suggests BatchNorm1d for Linear, BatchNorm2d for Conv
• Flow Logic: Warns about unusual architectural choices

📝 License

MIT License - see LICENSE file for details.

⚠️ Current Limitations

This is an MVP (Minimum Viable Product). Significant work remains:

• Layer Connections: Visual connections between layers need full implementation
• Canvas Interactions: Drag & drop layer positioning not fully functional
• Model Validation: Complete end-to-end model validation system
• Code Generation: Generated PyTorch code needs optimization and testing
• UI Polish: Many interface elements need refinement
• Error Handling: Robust error handling and user feedback
• Testing: Comprehensive test suite for all components

🔮 Future Roadmap

• Complete Core Features: Finish MVP functionality
• Model Training: Integrate with PyTorch Lightning for training
• Model Zoo: Expand template library with more architectures
• Optimization: Layer fusion and optimization suggestions
• Export Formats: Support for ONNX, TensorRT export
• Collaboration: Real-time collaborative editing
• Mobile: Responsive design for mobile/tablet use