Skip to main content

​
Prerequisites

Before installing Gridfinity Builder locally, ensure you have:
  • Node.js 18+ (LTS recommended)
  • npm 9+ (included with Node.js)
  • Modern browser with WASM and ES2020+ support
Gridfinity Builder requires WebAssembly support for the Manifold CSG engine. All modern browsers (Chrome, Edge, Firefox, Safari) are supported.

​
Local Development Setup

1

Clone the repository

git clone https://github.com/tunelko/gridfinity-BambuLab-3D.git
cd gridfinity-BambuLab-3D
2

Install dependencies

npm install
This installs:
  • React 18.3+ - UI framework
  • Three.js 0.170+ - 3D rendering
  • Manifold 3D 3.3+ - WASM CSG engine
  • Zustand 5.0+ - State management
  • Vite 6.0+ - Build tool and dev server
3

Start the development server

npm run dev
The app starts at http://localhost:5173
Vite’s dev server includes hot module replacement (HMR) - changes to source files update instantly without page refresh.
4

Open in browser

Navigate to http://localhost:5173You should see the Gridfinity Builder interface with the default 6x6 grid.

​
Production Build

To create an optimized production build: 
npm run build
npm run preview
The build output is written to dist/ and can be deployed to any static hosting service (Vercel, Netlify, GitHub Pages, etc.).

​
Docker Setup

1

Build the Docker image

docker compose build --no-cache
This uses the Dockerfile which:
  • Starts from node:20-alpine base image
  • Installs dependencies with npm
  • Exposes port 5173
  • Runs the Vite dev server with --host 0.0.0.0
2

Start the container

docker compose up -d
The app runs in detached mode and is available at http://localhost:5173
3

Verify it's running

docker compose ps
You should see the app service with status Up.

​
Docker Volume Mounts

The docker-compose.yml mounts source files for hot reloading: 
volumes:
  - ./src:/app/src
  - ./public:/app/public
  - ./index.html:/app/index.html
  - ./vite.config.ts:/app/vite.config.ts
Changes to these files update the running container without rebuilding.

​
Stop the Container

docker compose down
Docker setup runs the development server, not a production build. For production deployment, build the app and serve the dist/ folder with nginx or a CDN.

​
Progressive Web App (PWA) Installation

Gridfinity Builder can be installed as a Progressive Web App for offline use.
1

Open the live demo

Navigate to https://gridfinity.securedev.codes/
2

Install the app

Look for the install icon in the address bar (⊕ or computer icon).Click it and select Install in the popup.Alternatively:
  1. Click the three-dot menu (⋮)
  2. Select Install Gridfinity Builder…
3

Launch from desktop

The app is now installed and can be launched from:
  • Windows Start Menu
  • macOS Applications folder
  • Desktop shortcut (if created)
It runs in a standalone window without browser UI.

​
Offline Support

After installation, Gridfinity Builder works fully offline:
  • All assets are cached via Service Worker
  • Layouts are saved to browser localStorage
  • 3MF export runs entirely client-side
Use the Check for Updates button in the app to force-refresh cached assets when a new version is released.

​
Browser Compatibility

BrowserSupport LevelNotes
Chrome / Edge✅ FullInstall prompt + offline support
Firefox⚠️ PartialOffline support, no install prompt
Safari (macOS)⚠️ PartialManual “Add to Dock” required
Safari (iOS)⚠️ PartialManual “Add to Home Screen” required
Firefox does not show an install prompt for PWAs, but the app still works fully in the browser with offline support.

​
System Requirements

​
Minimum

  • OS: Windows 10, macOS 10.15, or Ubuntu 20.04
  • RAM: 4 GB
  • Browser: Chrome 90+, Edge 90+, Firefox 88+, Safari 14+
  • OS: Windows 11, macOS 13+, or Ubuntu 22.04
  • RAM: 8 GB or more
  • Browser: Latest version of Chrome, Edge, or Safari
  • GPU: Dedicated GPU for smoother 3D rendering (optional)
Geometry generation uses the Manifold WASM CSG engine, which is CPU-bound. Complex layouts with many dividers may take a few seconds to render on slower hardware.

​
Troubleshooting

  • Check WebGL support: Visit webglreport.com to verify your browser supports WebGL 2.0
  • Update graphics drivers: Outdated GPU drivers can cause rendering issues
  • Try a different browser: Some browsers have better WebGL support than others
  • Check browser compatibility: Manifold 3D requires WASM support (Chrome 57+, Firefox 52+, Safari 11+)
  • Disable browser extensions: Ad blockers or privacy extensions may block WASM loading
  • Clear cache: Force refresh with Ctrl+Shift+R (Cmd+Shift+R on macOS)
  • Check if port is in use: Run lsof -i :5173 (macOS/Linux) or netstat -ano | findstr :5173 (Windows)
  • Kill the process: kill -9 <PID> or use Task Manager
  • Use a different port: Run npm run dev -- --port 3000
  • Check logs: docker compose logs app
  • Verify Node version: Container uses node:20-alpine (must support Vite 6)
  • Rebuild without cache: docker compose build --no-cache

​
Next Steps

Quickstart

Create your first Gridfinity layout in 5 minutes

Features

Explore advanced features like auto-fill and BOM calculator

Architecture

Learn how the geometry pipeline and CSG engine work

Contributing

Report issues or contribute on GitHub

Build docs developers (and LLMs) love

Get started for freeTalk to us