Skip to main content

buerli.io · the SDK for ClassCAD

buerli puts the ClassCAD engine inside your JavaScript: in a Web Worker in the tab, or across a socket to a server. You write the part as code; it draws into your own three.js scene.

Start in five minutesRead the docs
your app · localhost:5173
<Sprocket teeth={} strands={} />
loading the recorded session …

↑ the numbers in the code are live: click one

01The model is code

No file to export, no viewer to embed. The part is a function of your props: change them and ClassCAD rebuilds it, the way the workbench above just did.

  1. 01A live ClassCAD session, by nameThe hook hands your component the whole API and a Geometry component; the engine runs wherever init put it.
  2. 02Your model is a functionupdateSprocket is yours: plain async code that calls api.v1, the same 264 methods ClassCAD has everywhere.
  3. 03The result, in your sceneGeometry suspends until the model is ready and draws into your own react-three-fiber canvas, next to anything else in it.
App.jsx@buerli.io/react
  1. import { useBuerliCadFacade } from '@buerli.io/react'
  2. import { Canvas } from '@react-three/fiber'
  4. function App({ teeth, strands }) {
  5. const { api, Geometry } = useBuerliCadFacade('with-claude-sprocket')
  6. useEffect(() => {
  7. updateSprocket(api, { teeth, strands })
  8. }, [teeth, strands])
  9. return (
  10. <Canvas>
  11. <Geometry />
  12. </Canvas>
  13. )
  14. }

02Where it runs

One call decides where the engine lives. Everything after it, your hooks, your model code, your scene, stays exactly the same.

your pageyour appreact · three.js · buerliClassCADWebAssembly · Web Workerin this tab
initWASMClient
  1. import { init, WASMClient } from '@buerli.io/classcad'
  3. init(id => new WASMClient(id, { classcadKey }))

ClassCAD compiled to WebAssembly, in a Web Worker inside the page. The first visit loads it (about 55 MB, cached after). Nothing to host.

Web Workerno serverkey bound to your origins

03The facade

BuerliCadFacade is the whole ClassCAD API, unwrapped: calls return ids and throw on errors. What comes out is ready for your scene, your files, your numbers.

BuerliCadFacade

  • facade.createBufferGeometrythree.js geometry, for any scene
  • facade.createScene{ scene, nodes, materials }
  • <Geometry />react-three-fiber, suspends until ready
  • api.v1.common.saveOFB · STEP · STL
  • api.v1.drawing2d.exportSVGdrawings, and DXF
  • api.v1.part.calculateMassPropertiesvolume, centre of gravity

04In their apps

Three teams who put CAD inside their own products.

wemonte

Test adapters, configured.

A configurator for test adapters, with parametric CAD in the cloud and watertight parts for the printer. The aim: three weeks of development down to one.

Read the story →

FMS

From order to drawing.

A product configurator that writes STEP assemblies and DXF and SVG drawings from the history API and expressions, with no engineer in the loop.

Read the story →

glowbuzzer

Robots, programmed in the browser.

React and three.js: buerli loads the STEP files, and users pick points and edges to plan the robot’s moves.

Read the story →

05Start

  1. 01

    Install

  2. 02

    Get a key

    A free ClassCAD account makes one: WebAssembly for the origins you name, native for your servers.

    classcad.ch/user →
  3. 03

    Build

    init once, then useBuerliCadFacade wherever a part belongs. The quickstart has it end to end.

    The quickstart →

Read the docsStartersExamplesChangelogsPricing