# Bitbybit Documentation > Learn how to use the Bitbybit 3D creative coding platform - from visual programming to TypeScript APIs and NPM package integration. Build parametric 3D models, product configurators, and CAD applications directly in the browser. This is the official documentation site for Bitbybit. The platform enables designers and developers to create 3D geometry using visual programming or TypeScript code, with integration for BabylonJS, Three.js, and PlayCanvas game engines. ## Quick Links - Main Platform: https://bitbybit.dev - TypeScript API Reference: https://docs.bitbybit.dev - CAD Cloud API (OpenAPI 3.1.0): https://learn.bitbybit.dev/openapi.json - GitHub Repository: https://github.com/bitbybit-dev/bitbybit ## Getting Started Comprehensive guides for new users to understand the platform basics. - Welcome Guide: https://learn.bitbybit.dev/learn/intro - How Bitbybit Works: https://learn.bitbybit.dev/learn/how-it-works - Glossary: https://learn.bitbybit.dev/learn/glossary - Plans and What They Unlock: https://learn.bitbybit.dev/learn/plans - STEP to glTF Converter: https://learn.bitbybit.dev/learn/tools/converter - 3D Inspector: https://learn.bitbybit.dev/learn/tools/3d-inspector - Platform Overview: https://learn.bitbybit.dev/learn/getting-started/overview - Open Source Approach: https://learn.bitbybit.dev/learn/open-source-approach ### Understanding Scripts & Projects Scripts are the core building blocks in Bitbybit projects. Each project can contain multiple scripts of different types: - Scripts Overview: https://learn.bitbybit.dev/learn/getting-started/basics/scripts/intro Learn about: - What scripts are and how they work within projects - The four script types (Rete, Blockly, TypeScript and Designer) - Script visibility settings (public/private) - Combining multiple script types in a single project - Exporting scripts for external use ### Blockly Editor (Visual Block-Based Programming) Blockly provides an intuitive block-based visual programming interface, ideal for beginners: - Introduction to Blockly: https://learn.bitbybit.dev/learn/getting-started/blockly/intro ### Rete Editor (Node-Based Visual Programming) Rete offers a node-based visual programming interface for complex workflows: - Introduction to Rete: https://learn.bitbybit.dev/learn/getting-started/rete/intro - Parametric Cube Tutorial: https://learn.bitbybit.dev/learn/getting-started/rete/parametric-cube - TypeScript in Rete Editor: https://learn.bitbybit.dev/learn/getting-started/rete/typescript-editor-component The Rete editor includes embedded TypeScript, JavaScript, and JSON editors. This allows users to: - Write custom code within visual programming workflows - Access algorithms not yet available as visual components - Combine the intuitiveness of visual programming with the power of text-based scripting ### TypeScript Editor For advanced users who prefer text-based programming: - Introduction to TypeScript: https://learn.bitbybit.dev/learn/getting-started/typescript/intro - Hello World Tutorial: https://learn.bitbybit.dev/learn/getting-started/typescript/hello-world The TypeScript editor is built on Monaco, the editor of VS Code, and provides: - Full IntelliSense and autocompletion over the whole API - Scripts of many files in folders, starting from main.ts - Type safety and early error detection - Maximum flexibility and control ### The Designer (Parametric CAD by Clicking) A parametric CAD modeller: sketches, features, parts and assemblies with joints, every step editable, kept as design documents (JSON) that agents can read and write. Creating and editing is part of the Gold plan; anyone it is shared with can view. - Introduction to the Designer: https://learn.bitbybit.dev/learn/designer/intro - Design documents: https://learn.bitbybit.dev/learn/using-ai-with-bitbybit/design-documents ### Assets & File Management Working with local and external assets: - Importing Local glTF Files: https://learn.bitbybit.dev/learn/getting-started/basics/assets/local/gltf ## Designer (Interactive Parametric CAD) The Designer is Bitbybit's interactive CAD modeller: parametric parts and assemblies made by clicking, or by an AI agent working in the same document, built by the OpenCascade kernel in the browser. It is part of the Gold plan. The tutorials are the ones the Designer plays under Help > Tutorials, and the reference pages are generated from the Designer itself. - Introduction: https://learn.bitbybit.dev/learn/designer/intro - Tutorial, Make your first part: https://learn.bitbybit.dev/learn/designer/tutorials/first-part - Tutorial, Model a desk robot arm: https://learn.bitbybit.dev/learn/designer/tutorials/desk-arm - How the Designer works: https://learn.bitbybit.dev/learn/designer/concepts - Working with agents in the Designer: https://learn.bitbybit.dev/learn/designer/working-with-agents - Commands: https://learn.bitbybit.dev/learn/designer/reference/commands - Keyboard shortcuts: https://learn.bitbybit.dev/learn/designer/reference/shortcuts - Tools for agents: https://learn.bitbybit.dev/learn/designer/reference/agent-tools ## Code & Algorithm Organization Understanding how algorithms are organized across all three editors (TypeScript, Blockly, and Rete). - Algorithm Organization Introduction: https://learn.bitbybit.dev/learn/code/intro This section explains: - How algorithms are organized into common categories across all editors - Why the same core algorithms (OCCT, JSCAD, BabylonJS) are available in TypeScript, Blockly, and Rete - Editor-specific differences (e.g., Blockly has Functions/Variables categories, Rete uses dataflow approach) - The DRY (Don't Repeat Yourself) principle in algorithm design Key insight: The fundamental algorithms are identical regardless of editor choice - only the method of interaction differs. ## NPM Packages Integration guides for embedding Bitbybit in your web applications. ### Quick Start ```bash npx @bitbybit-dev/create-app my-project ``` Choose your game engine (BabylonJS, Three.js, or PlayCanvas) and start coding immediately. ### Overview - Introduction: https://learn.bitbybit.dev/learn/npm-packages/intro - Engine Agnostic Core: https://learn.bitbybit.dev/learn/npm-packages/game-engine-agnostic ### Game Engine Integration - Three.js Integration: https://learn.bitbybit.dev/learn/npm-packages/threejs - BabylonJS Integration: https://learn.bitbybit.dev/learn/npm-packages/babylonjs - PlayCanvas Integration: https://learn.bitbybit.dev/learn/npm-packages/playcanvas ### All NPM Packages Game Engine Packages: - @bitbybit-dev/babylonjs - BabylonJS visualization and drawing - @bitbybit-dev/threejs - Three.js visualization and drawing - @bitbybit-dev/playcanvas - PlayCanvas visualization and drawing Core Packages: - @bitbybit-dev/core - Combined CAD kernel features - @bitbybit-dev/base - Base algorithms (vector math, transformations) CAD Kernel Packages (Main Thread): - @bitbybit-dev/occt - OpenCascade for industrial B-rep CAD - @bitbybit-dev/jscad - JSCAD for CSG modeling - @bitbybit-dev/manifold - Manifold for fast mesh booleans - @bitbybit-dev/ifc - IFC building models (BIM): author, write and read IFC4 files in TypeScript, Node.js and browser (beta) Web Worker Packages (Non-blocking, Recommended): - @bitbybit-dev/occt-worker - OpenCascade via web worker - @bitbybit-dev/jscad-worker - JSCAD via web worker - @bitbybit-dev/manifold-worker - Manifold via web worker - @bitbybit-dev/ifc-worker - IFC via web worker (beta) Tooling Packages: - @bitbybit-dev/create-app - CLI that scaffolds a frontend or full-stack CAD Cloud project - @bitbybit-dev/cad-cloud-sdk - TypeScript SDK for the CAD Cloud REST API - @bitbybit-dev/mcp - MCP server that documents this API for AI coding agents, version-exact ## Runners Script runners enable executing Bitbybit scripts in external web applications. Scripts can be created in any editor (Blockly, Rete, or TypeScript) and exported for use in standalone websites. - Runners Overview: https://learn.bitbybit.dev/learn/runners - Runner with TypeScript: https://learn.bitbybit.dev/learn/runners/intro-typescript ### Engine-Specific Runners - BabylonJS Full Runner: https://learn.bitbybit.dev/learn/runners/engines/babylonjs/full-runner - Three.js Full Runner: https://learn.bitbybit.dev/learn/runners/engines/threejs/full-runner - PlayCanvas Full Runner: https://learn.bitbybit.dev/learn/runners/engines/playcanvas/full-runner ### Export Workflow 1. Create your parametric design in any Bitbybit editor (Blockly, Rete, or TypeScript) 2. Click "Export to Runner" button 3. Copy the generated script 4. Integrate into your web application using the bitbybit-runner.js library ## 3D Bits (Shopify App) 3D Bits adds interactive 3D product configurators to Shopify storefronts. A merchant builds the 3D scene, the panel of options a shopper uses, the logic between them and the pricing in **Composer**, then publishes it to their product pages. Most stores need no code at all; Rete, Blockly and TypeScript scripts are available for products whose geometry has to be calculated. Composer was previously called the Viewer Editor - older videos and tutorials still use that name. - [3D Bits introduction](https://learn.bitbybit.dev/learn/3d-bits/intro): What the app is, who it is for, and what a configurator looks like on a product page. - [How it works](https://learn.bitbybit.dev/learn/3d-bits/how-it-works): What runs on the product page, the two ways to drive a configurator, and how it survives a theme change. - [FAQ](https://learn.bitbybit.dev/learn/3d-bits/faq): Common questions about building without code, pricing, the app embed and existing theme apps. - [Getting help](https://learn.bitbybit.dev/learn/3d-bits/reaching-out): What support each plan includes and where to reach us. - Shopify App Store listing: https://apps.shopify.com/3d-bits-1 ### Quick Start - [Install the app](https://learn.bitbybit.dev/learn/3d-bits/quick-start/install): Install from the App Store and choose a plan. - [Enable the app embed](https://learn.bitbybit.dev/learn/3d-bits/quick-start/enable-app-embed): Switch 3D on for the whole store in one step, with no theme edits. - [Your first configurator](https://learn.bitbybit.dev/learn/3d-bits/quick-start/first-configurator): Model to published product page, start to finish. - [What to expect](https://learn.bitbybit.dev/learn/3d-bits/quick-start/what-to-expect): What is realistic on a first build, and how long each part takes. ### Composer - the authoring tool Composer is where a configurator is built: the 3D scene, the option panel, the logic and the prices. - [Composer overview](https://learn.bitbybit.dev/learn/3d-bits/composer): Section index. - [Getting started in Composer](https://learn.bitbybit.dev/learn/3d-bits/composer/intro): Opening it from a project, and the first model. - [The interface](https://learn.bitbybit.dev/learn/3d-bits/composer/interface): Sections, sub-tabs, the bottom bar and the status messages. - [Edit mode and Play](https://learn.bitbybit.dev/learn/3d-bits/composer/preview-vs-play): Which behaviours apply while authoring, which only in Play, and how to preview each. - [Adding models](https://learn.bitbybit.dev/learn/3d-bits/composer/models/adding-models): Uploading and linking 3D files. - [Supported formats](https://learn.bitbybit.dev/learn/3d-bits/composer/models/supported-formats): glTF, GLB, splats and the rest, with the trade-offs. - [Model properties](https://learn.bitbybit.dev/learn/3d-bits/composer/models/model-properties): Transforms, transform variants, material variants, animations and node structure. - [Variants](https://learn.bitbybit.dev/learn/3d-bits/composer/variants): Connecting model parts and materials to the options a shopper picks. - [Scene](https://learn.bitbybit.dev/learn/3d-bits/composer/scene): Camera, lighting, background, skybox and shadows. - [Navigation](https://learn.bitbybit.dev/learn/3d-bits/composer/navigation): Points of interest and focals. - [Dimensions](https://learn.bitbybit.dev/learn/3d-bits/composer/dimensions): Printing measurements onto the product in the 3D view. - [Personalisation](https://learn.bitbybit.dev/learn/3d-bits/composer/personalization): Putting a customer's own text or image onto the product itself. - [Logic](https://learn.bitbybit.dev/learn/3d-bits/composer/logic): Rules that show, hide, enable and disable options and scene objects. - [Scripting](https://learn.bitbybit.dev/learn/3d-bits/composer/scripting): Linking a parametric Rete, Blockly or TypeScript script into a configurator. - [Saving and publishing](https://learn.bitbybit.dev/learn/3d-bits/composer/saving-and-publishing): Draft versus published, and what a publish actually sends. - [Publish blockers](https://learn.bitbybit.dev/learn/3d-bits/composer/publish-blockers): Every reason a publish is refused, and the fix for each. - [Troubleshooting Composer](https://learn.bitbybit.dev/learn/3d-bits/composer/troubleshooting): What to check when the preview stalls or a change does not appear. ### The Option Panel (GUI) - [Controls](https://learn.bitbybit.dev/learn/3d-bits/composer/gui/controls): Every control type a shopper can be offered. - [Layout](https://learn.bitbybit.dev/learn/3d-bits/composer/gui/layout): Arranging elements, and the areas they can be placed in. - [Style and translations](https://learn.bitbybit.dev/learn/3d-bits/composer/gui/style-and-translations): Matching the store's look, in light and dark, in every language sold in. - [Pricing fields](https://learn.bitbybit.dev/learn/3d-bits/composer/gui/pricing): Where prices, formulas and quantities are authored. - [Parts](https://learn.bitbybit.dev/learn/3d-bits/composer/gui/parts): The bill of materials behind a configured product - charged parts, recorded parts and assemblies. - [PDF documents](https://learn.bitbybit.dev/learn/3d-bits/composer/gui/pdf-reports): Documents generated from a configuration, for the customer and for the workshop. - [Cart overview](https://learn.bitbybit.dev/learn/3d-bits/composer/gui/cart-overview): The summary card that shows what has been configured. - [Settings](https://learn.bitbybit.dev/learn/3d-bits/composer/gui/settings): Panel-wide behaviour, and what is recorded on the order. ### The App in Shopify Admin - [App overview](https://learn.bitbybit.dev/learn/3d-bits/admin/overview): The way around the app, and what a project and a script each are. - [Projects](https://learn.bitbybit.dev/learn/3d-bits/admin/projects): Creating, versioning, restoring and publishing configurators. - [Scripts](https://learn.bitbybit.dev/learn/3d-bits/admin/scripts): Parametric programs, linked into projects. Standard and Pro plans. - [Assets](https://learn.bitbybit.dev/learn/3d-bits/admin/assets): Hosting 3D files on the Shopify CDN. - [Storefront display](https://learn.bitbybit.dev/learn/3d-bits/admin/storefront-display): Choosing between the app embed and theme blocks. - [Canvas sizing](https://learn.bitbybit.dev/learn/3d-bits/admin/canvas-sizing): Canvas height, maximum width, and where the option panel sits. - [Order review](https://learn.bitbybit.dev/learn/3d-bits/admin/order-review): Reading back what a customer configured. - [Subscription](https://learn.bitbybit.dev/learn/3d-bits/admin/subscription): Which plan is active and what it unlocks. - [Metafields](https://learn.bitbybit.dev/learn/3d-bits/admin/metafields): The legacy per-product metafield route, kept for existing stores. ### Pricing - [Pricing overview](https://learn.bitbybit.dev/learn/3d-bits/pricing/overview): Build a price from the options a shopper picks and charge it through Shopify. - [Set up pricing](https://learn.bitbybit.dev/learn/3d-bits/pricing/setting-up-pricing): Turn on configurator pricing and price your first option. - [Charging methods](https://learn.bitbybit.dev/learn/3d-bits/pricing/charging-methods): Product lines, Bundled parts, Variant matrix and Single line compared. - [Helper products](https://learn.bitbybit.dev/learn/3d-bits/pricing/helper-products): The hidden 3D Bits Fee products and the rules for living with them. - [Linked products](https://learn.bitbybit.dev/learn/3d-bits/pricing/linked-products): Charge through products you already sell, link several to one option, and keep the links healthy. - [Complexity](https://learn.bitbybit.dev/learn/3d-bits/pricing/complexity): How large a configurator can get, and which choices are the expensive ones. - [Test mode](https://learn.bitbybit.dev/learn/3d-bits/pricing/test-mode): Checking prices end to end before going on sale. - [Other currencies](https://learn.bitbybit.dev/learn/3d-bits/pricing/other-currencies): Selling into more than one market. - [Going live](https://learn.bitbybit.dev/learn/3d-bits/pricing/going-live): Testing checklist, multi-currency advice, and reviewing configured orders. - [Pricing troubleshooting](https://learn.bitbybit.dev/learn/3d-bits/pricing/troubleshooting): What each shopper-facing message means and what to do. ### 3D Assets - [3D assets overview](https://learn.bitbybit.dev/learn/3d-bits/3d-assets): Section index. - [Preparing glTF](https://learn.bitbybit.dev/learn/3d-bits/3d-assets/preparing-gltf): Getting a model ready for the web. - [Size and performance](https://learn.bitbybit.dev/learn/3d-bits/3d-assets/size-and-performance): File-size limits and what they cost on a phone. - [Configurators are games](https://learn.bitbybit.dev/learn/3d-bits/3d-assets/configurators-are-games): Why real-time rendering constraints apply to a product page. - [Asset security](https://learn.bitbybit.dev/learn/3d-bits/3d-assets/asset-security): What is public once a project is published, and what that means for your models. ### Subscription Plans - [Subscription plans](https://learn.bitbybit.dev/learn/3d-bits/plans/subscription-plans): The three tiers, what each includes, and what it costs. ### Theme Blocks Most stores need only the app embed, which places 3D on product pages automatically. Theme blocks are for placing the 3D view or part of the option panel somewhere specific in a product template. - [Theme blocks overview](https://learn.bitbybit.dev/learn/3d-bits/theme-blocks/overview): Which block to reach for, and when none is needed. - [App embed](https://learn.bitbybit.dev/learn/3d-bits/theme-blocks/app-embed): The default, store-wide install with no theme edits. - [BITBYBIT VIEWER](https://learn.bitbybit.dev/learn/3d-bits/theme-blocks/bitbybit-viewer): Renders a product's 3D scene at an exact spot in the template. - [BITBYBIT GUI CONTROLS](https://learn.bitbybit.dev/learn/3d-bits/theme-blocks/bitbybit-gui): Hosts one area of the option panel wherever it is dropped. - [BITBYBIT PREVIEW](https://learn.bitbybit.dev/learn/3d-bits/theme-blocks/bitbybit-preview): Embeds a published bitbybit.dev project as an iframe. - [BITBYBIT APPS](https://learn.bitbybit.dev/learn/3d-bits/theme-blocks/bitbybit-apps): Runs a custom TypeScript single-page application on the product page. Pro plan. - [BITBYBIT RUNNER](https://learn.bitbybit.dev/learn/3d-bits/theme-blocks/bitbybit-runner): Legacy. Runs an exported script directly in the template. ### Block Settings Reference - [Shared block settings](https://learn.bitbybit.dev/learn/3d-bits/tutorials/getting-started/common-settings): Every setting that appears on more than one block. Shopify links here from the theme editor. - [BITBYBIT VIEWER settings](https://learn.bitbybit.dev/learn/3d-bits/tutorials/bitbybit-viewer/settings) - [BITBYBIT RUNNER settings](https://learn.bitbybit.dev/learn/3d-bits/tutorials/bitbybit-runner/settings) - [BITBYBIT APPS settings](https://learn.bitbybit.dev/learn/3d-bits/tutorials/bitbybit-apps/settings) - [BITBYBIT PREVIEW settings](https://learn.bitbybit.dev/learn/3d-bits/tutorials/bitbybit-preview/settings) ### Integrations - [Driving 3D Bits from your own form](https://learn.bitbybit.dev/learn/3d-bits/integrations/custom-forms): The contract between a custom product form and 3D Bits. - [Logic without a panel](https://learn.bitbybit.dev/learn/3d-bits/integrations/logic-without-a-panel): What Composer's rules still do when the choices come from elsewhere. - [When you need another app](https://learn.bitbybit.dev/learn/3d-bits/integrations/when-you-need-another-app): Where a separate product options app still makes sense. ### Programming Options **Low-Code (Visual Programming):** - Blockly Editor - Block-based visual programming - Rete Editor - Node-based visual programming **Pro-Code:** - The TypeScript editor - Custom Vite/TypeScript templates for production apps ### Tutorials - Product Laptop Holder (TypeScript): https://learn.bitbybit.dev/learn/3d-bits/tutorials/videos-tutorials/product-laptop-holder ## CAD Cloud API A hosted HTTP API for generating parametric 3D CAD models, converting STEP files to glTF and running CAD kernel pipelines from any language. Asynchronous: submit a job, poll the task, download the result. - OpenAPI 3.1.0 specification (machine-readable): https://learn.bitbybit.dev/openapi.json - Base URL: https://api.bitbybit.dev - API overview: https://learn.bitbybit.dev/api/cloud-api - Interactive API reference: https://learn.bitbybit.dev/api/openapi-docs/bitbybit-cad-cloud-api - TypeScript SDK: https://www.npmjs.com/package/@bitbybit-dev/cad-cloud-sdk - SDK guide: https://learn.bitbybit.dev/api/sdk/typescript Authentication is an `x-api-key` header on every endpoint except `/health`. ## AI Integration Using AI assistants with Bitbybit for enhanced coding workflows. Bitbybit does not provide proprietary LLMs - instead, it integrates with leading third-party AI services. - AI Introduction: https://learn.bitbybit.dev/learn/using-ai-with-bitbybit/intro ### Key Concepts - **Model Context Protocol (MCP)**: Open standard for AI applications to interact with external data sources - **Specialized Coding Agents**: AI agents for generating code, debugging, and suggesting algorithms - **Open Source Advantage**: Bitbybit's open-source components provide rich training data for foundation models ### MCP Integration - Bitbybit CAD MCP (first party, free, version-exact API answers): https://learn.bitbybit.dev/learn/using-ai-with-bitbybit/mcp/bitbybit-mcp - Bitbybit CAD Cloud MCP (first party, API key, runs geometry on CAD Cloud): https://learn.bitbybit.dev/learn/using-ai-with-bitbybit/mcp/cad-cloud-mcp - Agentic CAD, where geometry should run when an agent writes the code: https://learn.bitbybit.dev/learn/using-ai-with-bitbybit/agentic-cad - Geometry with the CAD kernels, how agents build, check and export parts with OpenCascade, Manifold and JSCAD: https://learn.bitbybit.dev/learn/using-ai-with-bitbybit/cad-geometry - Design documents, parametric models as JSON that agents write and occt.design builds: https://learn.bitbybit.dev/learn/using-ai-with-bitbybit/design-documents - Design document JSON Schema: https://git-cdn.bitbybit.dev/v1.6.0/schemas/design-document/experimental.json - IFC building models, BIM files that agents write with @bitbybit-dev/ifc, check and hand to other tools: https://learn.bitbybit.dev/learn/using-ai-with-bitbybit/ifc-models - Context7 MCP Integration: https://learn.bitbybit.dev/learn/using-ai-with-bitbybit/mcp/context-7 Context7 provides live AI context with always up-to-date documentation: - Context7 Library: https://context7.com/bitbybit-dev/bitbybit Bitbybit CAD MCP setup (start here - free, no account): Claude Code, remote: ```bash claude mcp add --transport http bitbybit https://mcp.bitbybit.dev/mcp ``` Claude Code, local, pinned to the @bitbybit-dev version installed in the project: ```bash claude mcp add --transport stdio bitbybit -- npx -y @bitbybit-dev/mcp ``` VS Code (.vscode/mcp.json) - the `type` is required: ```json { "servers": { "bitbybit": { "type": "http", "url": "https://mcp.bitbybit.dev/mcp" } } } ``` Cursor (.cursor/mcp.json): ```json { "mcpServers": { "bitbybit": { "url": "https://mcp.bitbybit.dev/mcp" } } } ``` Codex (`codex mcp add bitbybit --url https://mcp.bitbybit.dev/mcp`, or in ~/.codex/config.toml): ```toml [mcp_servers.bitbybit] url = "https://mcp.bitbybit.dev/mcp" ``` Gemini CLI: `gemini mcp add -t http bitbybit https://mcp.bitbybit.dev/mcp` (settings.json field "httpUrl"). Windsurf: "serverUrl" in ~/.codeium/windsurf/mcp_config.json. Zed: "context_servers" with "url" in settings.json. JetBrains AI Assistant: an MCP server entry with "url". Bitbybit CAD Cloud MCP setup (API key, runs the geometry): ```bash claude mcp add --transport http bitbybit-cloud https://api.bitbybit.dev/mcp --header "X-API-Key: " ``` Context7 MCP setup (third party, indexes the documentation site): ```json { "servers": [ { "command": "npx", "args": ["-y", "@upstash/context7-mcp@latest"], "env": { "DEFAULT_MINIMUM_TOKENS": "10000" } } ] } ``` ### AI Context Files (v1.6.0) Attach these files to your AI coding assistant for Bitbybit API knowledge. #### Beginner Context (Monaco Editor) For online TypeScript editor at bitbybit.dev: - Full Context (116k tokens): https://git-cdn.bitbybit.dev/v1.6.0/ai-context/bitbybit-babylon-monaco-ai-context.md #### BabylonJS Context - Full (116k tokens): https://git-cdn.bitbybit.dev/v1.6.0/ai-context/bitbybit-babylon-ai-context.md - Lite (114k tokens): https://git-cdn.bitbybit.dev/v1.6.0/ai-context/bitbybit-babylon-no-comment-min-ai.md #### Three.js Context - Full (95k tokens): https://git-cdn.bitbybit.dev/v1.6.0/ai-context/bitbybit-three-ai-context.md - Lite (82k tokens): https://git-cdn.bitbybit.dev/v1.6.0/ai-context/bitbybit-three-no-comment-min-ai.md #### PlayCanvas Context - Full (94k tokens): https://git-cdn.bitbybit.dev/v1.6.0/ai-context/bitbybit-playcanvas-ai-context.md - Lite (82k tokens): https://git-cdn.bitbybit.dev/v1.6.0/ai-context/bitbybit-playcanvas-no-comment-min-ai.md ### Full API on Github - API with short explanations: https://github.com/bitbybit-dev/bitbybit/blob/master/docs/API.md ## GitHub & Contributing - Main Repository: https://github.com/bitbybit-dev/bitbybit - Contributing Guide: https://learn.bitbybit.dev/learn/github - Unit Testing Guide: https://learn.bitbybit.dev/learn/github/unit-tests - Live Test Coverage: https://learn.bitbybit.dev/learn/github/live-unit-test-coverage ## Blog Latest updates, tutorials, and announcements: - Blog: https://learn.bitbybit.dev/blog - PlayCanvas Support Announcement: https://learn.bitbybit.dev/blog/playcanvas-support ## Security - Hosting & CDN: https://learn.bitbybit.dev/learn/hosting-and-cdn ## Community - Discord: https://discord.gg/GSe3VMe - YouTube: https://www.youtube.com/@bitbybitdev - LinkedIn: https://www.linkedin.com/company/bitbybit-dev - X/Twitter: https://x.com/bitbybit_dev ## Key Concepts ### Four Editors Bitbybit offers four ways to create 3D geometry, all sharing the same underlying kernels: 1. **Blockly (Visual Block-Based)** - Beginner-friendly drag-and-drop blocks - Similar to Scratch programming - Best for learning programming concepts - Has dedicated Functions and Variables categories 2. **Rete (Node-Based Visual)** - Node-based dataflow programming that reruns as you change it - Every function of the API as a component, plus modules, groups and code components - Includes embedded TypeScript/JavaScript/JSON editors - Best for complex visual workflows 3. **TypeScript** - Full text-based TypeScript programming, in many files - Built on Monaco, the editor of VS Code - Maximum flexibility and control - Best for experienced developers 4. **The Designer** - Parametric CAD by clicking: sketches, features, parts and assemblies - Gold plan to edit; anyone it is shared with can view - Best for modelling parts the way CAD programs do ### Geometry Kernels Bitbybit supports multiple CAD kernels: - **OpenCascade (OCCT)**: Industrial-grade B-rep kernel for precise CAD operations, boolean operations, fillets, chamfers, STEP export - **JSCAD**: JavaScript-based CSG modeling for simple shapes - **Manifold**: Fast mesh boolean operations for real-time applications ### Game Engines Visualization and rendering: - **BabylonJS**: Full-featured WebGL engine with PBR, physics, audio - **Three.js**: Lightweight, popular 3D library with vast ecosystem - **PlayCanvas**: Professional engine with online collaborative editor ### Web Workers All geometry kernels have web worker variants (-worker packages) for non-blocking UI: - Asynchronous operations that don't freeze the browser - Recommended for production applications - Same API as main thread packages ## Optional - Main site llms.txt: https://bitbybit.dev/llms.txt