re-structured some of the tutorials, added getting started tutorials for 3 game engines, linked to them from docs pages.

Author: matas-bitbybit-dev

docs/docusaurus.config.ts

@@ -90,9 +90,9 @@ const config: Config = {
                 },
                 { to: "/learn/code/intro", label: "Code", position: "left" },
                 { to: "/learn/3d-bits/intro", label: "3D Bits", position: "left" },
-                { to: "/learn/npm-packages/threejs", label: "ThreeJS", position: "left" },
-                { to: "/learn/npm-packages/babylonjs", label: "BabylonJS", position: "left" },
-                { to: "/learn/npm-packages/playcanvas", label: "PlayCanvas", position: "left" },
+                { to: "/learn/getting-started/engines/threejs", label: "ThreeJS", position: "left" },
+                { to: "/learn/getting-started/engines/babylonjs", label: "BabylonJS", position: "left" },
+                { to: "/learn/getting-started/engines/playcanvas", label: "PlayCanvas", position: "left" },
                 { to: "/blog", label: "Blog", position: "left" },
                 { to: "https://bitbybit.dev", label: "Home", position: "left" },
                 {

docs/learn/getting-started/engines/_category_.json

@@ -0,0 +1,10 @@
+{
+    "label": "Game Engines",
+    "position": 7,
+    "link": {
+        "type": "generated-index",
+        "title": "Getting Started with Game Engines",
+        "description": "Choose your preferred 3D game engine and learn how to integrate Bitbybit's CAD capabilities. We support BabylonJS, ThreeJS, and PlayCanvas.",
+        "slug": "/getting-started/engines"
+    }
+}

docs/learn/getting-started/engines/babylonjs.mdx

@@ -0,0 +1,112 @@
+---
+sidebar_position: 1
+title: "Getting Started with BabylonJS"
+sidebar_label: "BabylonJS"
+description: "Get started with Bitbybit and BabylonJS - our fully integrated 3D game engine. Learn about integration approaches including visual editors, NPM packages, and runners."
+tags: [getting-started, babylonjs, engines]
+---
+
+import Admonition from '@theme/Admonition';
+
+# Getting Started with BabylonJS
+
+<img 
+  src="https://bitbybit.dev/assets/babylon_logo.png" 
+  width="150"
+  alt="BabylonJS Logo" 
+  title="BabylonJS Logo" />
+
+BabylonJS is a powerful, open-source game and rendering engine for the web. It's also the native rendering engine for all Bitbybit visual programming editors, which means you get the most complete integration experience with this engine.
+
+**Official homepage:** <a href="https://babylonjs.com/" target="_blank" rel="noopener noreferrer">babylonjs.com</a>
+
+---
+
+## Three Ways to Use BabylonJS with Bitbybit
+
+### 1. Visual Editors (No Setup Required)
+
+The easiest way to get started. Just open one of our online editors and start building:
+
+- **<a href="https://bitbybit.dev/app?editor=rete" target="_blank" rel="noopener noreferrer">Rete Editor</a>** - Connect visual nodes to create parametric 3D models. If you've used Grasshopper, Dynamo, or Blender Nodes, this will feel familiar.
+
+- **<a href="https://bitbybit.dev/app?editor=blockly" target="_blank" rel="noopener noreferrer">Blockly Editor</a>** - Drag and drop blocks to build 3D models. Great for beginners and educational settings.
+
+- **<a href="https://bitbybit.dev/app?editor=monaco" target="_blank" rel="noopener noreferrer">Monaco Editor</a>** - Write TypeScript code directly in your browser with full intellisense.
+
+Scripts created in any of these editors can be exported as JavaScript and run on your own website using Bitbybit Runners.
+
+---
+
+### 2. NPM Packages (For Developers)
+
+If you're building a production application or prefer working with TypeScript in your own development environment, use our NPM packages.
+
+The quickest way to start a new project:
+
+```bash
+npx @bitbybit-dev/create-app my-project --engine babylonjs
+cd my-project
+npm install
+npm run dev
+```
+
+This creates a ready-to-run project with Vite, TypeScript, and all three CAD kernels (OCCT, JSCAD, Manifold) pre-configured.
+
+NPM packages give you full TypeScript support with intellisense, optimized bundle sizes through tree-shaking, and are the recommended approach for production applications.
+
+Note that NPM packages only include our open-source algorithms. To understand which parts of Bitbybit are open-source and which are not, see our [Open Source Approach](/learn/open-source-approach) guide.
+
+**Detailed setup guide:** [Quick Start with BabylonJS](/learn/npm-packages/babylonjs/start-with-babylon-js)
+
+---
+
+### 3. Runners (Quick Prototypes)
+
+Runners are single JavaScript files that bundle everything you need. They're perfect when you want to quickly prototype something without setting up a build environment.
+
+**Full Runner** - Includes both BabylonJS and Bitbybit in one file:
+
+```html
+<script src="https://cdn.jsdelivr.net/gh/bitbybit-dev/bitbybit-assets@latest/runner/bitbybit-runner-babylonjs.js"></script>
+```
+
+**Lite Runner** - Just Bitbybit, you load BabylonJS separately (smaller download):
+
+```html
+<script src="https://cdn.babylonjs.com/babylon.js"></script>
+<script src="https://cdn.jsdelivr.net/gh/bitbybit-dev/bitbybit-assets@latest/runner/bitbybit-runner-babylonjs-lite.js"></script>
+```
+
+Runners work great for demos on CodePen, JSFiddle, or StackBlitz. However, they only support JavaScript (no TypeScript) and have larger bundle sizes, so NPM packages are better for production work.
+
+**Learn more:** [Introduction to Runners](/learn/runners/intro) - Understand runner capabilities, limitations, and how to export visual scripts as JavaScript.
+
+**Runner guides:** [Full Runner](/learn/runners/engines/babylonjs/full-runner) | [Lite Runner](/learn/runners/engines/babylonjs/lite-runner)
+
+---
+
+## NPM vs Runners - Which Should I Use?
+
+**Choose NPM packages** when you're building something for production, want TypeScript support, or need optimized bundle sizes.
+
+**Choose Runners** when you're prototyping, creating quick demos, or just want to experiment without any setup.
+
+---
+
+## Next Steps
+
+If you're new to 3D programming, start with the <a href="https://bitbybit.dev/app?editor=rete" target="_blank" rel="noopener noreferrer">Rete Editor</a> to get familiar with the concepts visually.
+
+If you're a developer ready to build, run the NPX command above and check out the [starter template guide](/learn/npm-packages/babylonjs/start-with-babylon-js).
+
+If you want to understand BabylonJS better, read [About BabylonJS](/learn/npm-packages/babylonjs/about-babylonjs) for a deeper look at the engine's capabilities.
+
+---
+
+## Resources
+
+- [About BabylonJS](/learn/npm-packages/babylonjs/about-babylonjs) - Engine overview and features
+- [NPM Package](https://www.npmjs.com/package/@bitbybit-dev/babylonjs)
+- [GitHub Examples](https://github.com/bitbybit-dev/bitbybit/tree/master/examples/vite/babylonjs)
+- [BabylonJS Documentation](https://doc.babylonjs.com/)

docs/learn/getting-started/engines/playcanvas.mdx

@@ -0,0 +1,107 @@
+---
+sidebar_position: 3
+title: "Getting Started with PlayCanvas"
+sidebar_label: "PlayCanvas"
+description: "Get started with Bitbybit and PlayCanvas - a powerful WebGL game engine. Learn about NPM packages and runners integration approaches."
+tags: [getting-started, playcanvas, engines]
+---
+
+import Admonition from '@theme/Admonition';
+
+# Getting Started with PlayCanvas
+
+<img 
+  src="/img/playcanvas.png" 
+  width="200"
+  alt="PlayCanvas Logo" 
+  title="PlayCanvas Logo" />
+
+PlayCanvas is a high-performance WebGL game engine known for its speed and mobile optimization. It features an open-source engine (MIT licensed) and is particularly well-suited for interactive 3D experiences that need to run smoothly across devices.
+
+**Official homepage:** <a href="https://playcanvas.com/" target="_blank" rel="noopener noreferrer">playcanvas.com</a>
+
+<Admonition type="info" title="Note">
+Our visual programming editors (Rete, Blockly, Monaco) use BabylonJS as their rendering engine. For PlayCanvas, you'll work with NPM packages or Runners directly.
+</Admonition>
+
+---
+
+## Two Ways to Use PlayCanvas with Bitbybit
+
+### 1. NPM Packages (Recommended)
+
+If you're building a production application or prefer working with TypeScript, use our NPM packages.
+
+The quickest way to start a new project:
+
+```bash
+npx @bitbybit-dev/create-app my-project --engine playcanvas
+cd my-project
+npm install
+npm run dev
+```
+
+This creates a ready-to-run project with Vite, TypeScript, and all three CAD kernels (OCCT, JSCAD, Manifold) pre-configured.
+
+NPM packages give you full TypeScript support with intellisense, optimized bundle sizes through tree-shaking, and are the recommended approach for production applications.
+
+Note that NPM packages only include our open-source algorithms. To understand which parts of Bitbybit are open-source and which are not, see our [Open Source Approach](/learn/open-source-approach) guide.
+
+**Detailed setup guide:** [Quick Start with PlayCanvas](/learn/npm-packages/playcanvas/start-with-playcanvas)
+
+---
+
+### 2. Runners (Quick Prototypes)
+
+Runners are single JavaScript files that bundle everything you need. They're perfect when you want to quickly prototype something without setting up a build environment.
+
+**Full Runner** - Includes both PlayCanvas and Bitbybit in one file:
+
+```html
+<script src="https://cdn.jsdelivr.net/gh/bitbybit-dev/bitbybit-assets@latest/runner/bitbybit-runner-playcanvas.js"></script>
+```
+
+**Lite Runner** - Just Bitbybit, you load PlayCanvas separately (smaller download):
+
+```html
+<script src="https://cdn.playcanvas.com/playcanvas-stable.min.js"></script>
+<script src="https://cdn.jsdelivr.net/gh/bitbybit-dev/bitbybit-assets@latest/runner/bitbybit-runner-playcanvas-lite.js"></script>
+```
+
+Runners work great for demos on CodePen, JSFiddle, or StackBlitz. However, they only support JavaScript (no TypeScript) and have larger bundle sizes, so NPM packages are better for production work.
+
+**Learn more:** [Introduction to Runners](/learn/runners/intro) - Understand runner capabilities, limitations, and how to export visual scripts as JavaScript.
+
+**Runner guides:** [Full Runner](/learn/runners/engines/playcanvas/full-runner) | [Lite Runner](/learn/runners/engines/playcanvas/lite-runner)
+
+---
+
+## NPM vs Runners - Which Should I Use?
+
+**Choose NPM packages** when you're building something for production, want TypeScript support, or need optimized bundle sizes.
+
+**Choose Runners** when you're prototyping, creating quick demos, or just want to experiment without any setup.
+
+---
+
+## What About Visual Editors?
+
+Our visual editors use BabylonJS for rendering, but the CAD algorithms are engine-agnostic. This means you can prototype ideas in our visual editors, export the script, and adapt it for PlayCanvas. The Bitbybit API is largely the same across engines - the main differences are in initialization and drawing functions.
+
+---
+
+## Next Steps
+
+If you're ready to build, run the NPX command above and check out the [starter template guide](/learn/npm-packages/playcanvas/start-with-playcanvas).
+
+If you want to understand PlayCanvas better, read [About PlayCanvas](/learn/npm-packages/playcanvas/about-playcanvas) for a deeper look at the engine's capabilities.
+
+---
+
+## Resources
+
+- [About PlayCanvas](/learn/npm-packages/playcanvas/about-playcanvas) - Engine overview and features
+- [NPM Package](https://www.npmjs.com/package/@bitbybit-dev/playcanvas)
+- [GitHub Examples](https://github.com/bitbybit-dev/bitbybit/tree/master/examples/vite/playcanvas)
+- [PlayCanvas Documentation](https://developer.playcanvas.com/)
+- [PlayCanvas Examples](https://playcanvas.github.io/)

docs/learn/getting-started/engines/threejs.mdx

@@ -0,0 +1,107 @@
+---
+sidebar_position: 2
+title: "Getting Started with ThreeJS"
+sidebar_label: "ThreeJS"
+description: "Get started with Bitbybit and ThreeJS - the world's most popular WebGL library. Learn about NPM packages and runners integration approaches."
+tags: [getting-started, threejs, engines]
+---
+
+import Admonition from '@theme/Admonition';
+
+# Getting Started with ThreeJS
+
+<img 
+  src="https://bitbybit.dev/assets/threejs-logo.png" 
+  width="150"
+  alt="ThreeJS Logo" 
+  title="ThreeJS Logo" />
+
+ThreeJS is a popular JavaScript library for creating 3D graphics in the browser. It provides a simpler API on top of WebGL and has a huge community with countless examples and resources.
+
+**Official homepage:** <a href="https://threejs.org/" target="_blank" rel="noopener noreferrer">threejs.org</a>
+
+<Admonition type="info" title="Note">
+Our visual programming editors (Rete, Blockly, Monaco) use BabylonJS as their rendering engine. For ThreeJS, you'll work with NPM packages or Runners directly.
+</Admonition>
+
+---
+
+## Two Ways to Use ThreeJS with Bitbybit
+
+### 1. NPM Packages (Recommended)
+
+If you're building a production application or prefer working with TypeScript, use our NPM packages.
+
+The quickest way to start a new project:
+
+```bash
+npx @bitbybit-dev/create-app my-project --engine threejs
+cd my-project
+npm install
+npm run dev
+```
+
+This creates a ready-to-run project with Vite, TypeScript, and all three CAD kernels (OCCT, JSCAD, Manifold) pre-configured.
+
+NPM packages give you full TypeScript support with intellisense, optimized bundle sizes through tree-shaking, and are the recommended approach for production applications.
+
+Note that NPM packages only include our open-source algorithms. To understand which parts of Bitbybit are open-source and which are not, see our [Open Source Approach](/learn/open-source-approach) guide.
+
+**Detailed setup guide:** [Quick Start with ThreeJS](/learn/npm-packages/threejs/start-with-three-js)
+
+---
+
+### 2. Runners (Quick Prototypes)
+
+Runners are single JavaScript files that bundle everything you need. They're perfect when you want to quickly prototype something without setting up a build environment.
+
+**Full Runner** - Includes both ThreeJS and Bitbybit in one file:
+
+```html
+<script src="https://cdn.jsdelivr.net/gh/bitbybit-dev/bitbybit-assets@latest/runner/bitbybit-runner-threejs.js"></script>
+```
+
+**Lite Runner** - Just Bitbybit, you load ThreeJS separately (smaller download):
+
+```html
+<script src="https://cdn.jsdelivr.net/npm/three@latest/build/three.min.js"></script>
+<script src="https://cdn.jsdelivr.net/gh/bitbybit-dev/bitbybit-assets@latest/runner/bitbybit-runner-threejs-lite.js"></script>
+```
+
+Runners work great for demos on CodePen, JSFiddle, or StackBlitz. However, they only support JavaScript (no TypeScript) and have larger bundle sizes, so NPM packages are better for production work.
+
+**Learn more:** [Introduction to Runners](/learn/runners/intro) - Understand runner capabilities, limitations, and how to export visual scripts as JavaScript.
+
+**Runner guides:** [Full Runner](/learn/runners/engines/threejs/full-runner) | [Lite Runner](/learn/runners/engines/threejs/lite-runner)
+
+---
+
+## NPM vs Runners - Which Should I Use?
+
+**Choose NPM packages** when you're building something for production, want TypeScript support, or need optimized bundle sizes.
+
+**Choose Runners** when you're prototyping, creating quick demos, or just want to experiment without any setup.
+
+---
+
+## What About Visual Editors?
+
+Our visual editors use BabylonJS for rendering, but the CAD algorithms are engine-agnostic. This means you can prototype ideas in our visual editors, export the script, and adapt it for ThreeJS. The Bitbybit API is largely the same across engines - the main differences are in initialization and drawing functions.
+
+---
+
+## Next Steps
+
+If you're ready to build, run the NPX command above and check out the [starter template guide](/learn/npm-packages/threejs/start-with-three-js).
+
+If you want to understand ThreeJS better, read [About ThreeJS](/learn/npm-packages/threejs/about-threejs) for a deeper look at the library's capabilities.
+
+---
+
+## Resources
+
+- [About ThreeJS](/learn/npm-packages/threejs/about-threejs) - Library overview and features
+- [NPM Package](https://www.npmjs.com/package/@bitbybit-dev/threejs)
+- [GitHub Examples](https://github.com/bitbybit-dev/bitbybit/tree/master/examples/vite/threejs)
+- [ThreeJS Documentation](https://threejs.org/docs/)
+- [ThreeJS Examples](https://threejs.org/examples/)

docs/learn/getting-started/overview.md

@@ -75,19 +75,29 @@ The Monaco editor provides a full code-based environment using TypeScript, aimed
 
 ## Open-Source NPM Packages (MIT Licensed)
 
-For developers who want to integrate our core geometric algorithms and functionalities directly into their own web applications, we offer a suite of **open-source NPM packages**. Our two main game engine-based libraries are:
+For developers who want to integrate our core geometric algorithms and functionalities directly into their own web applications, we offer a suite of **open-source NPM packages**. Our game engine-based libraries include:
 
-*   `@bitbybit-dev/threejs`
-*   `@bitbybit-dev/babylonjs`
+*   `@bitbybit-dev/babylonjs` - [Getting Started Guide](/learn/getting-started/engines/babylonjs)
+*   `@bitbybit-dev/threejs` - [Getting Started Guide](/learn/getting-started/engines/threejs)
+*   `@bitbybit-dev/playcanvas` - [Getting Started Guide](/learn/getting-started/engines/playcanvas)
 
 These allow you to leverage our CAD capabilities within your preferred 3D rendering environment.
 
 **Key Features & Benefits:**
 *   **Flexibility:** Build custom 3D tools, viewers, or applications tailored to your specific needs.
-*   **Integration:** Seamlessly incorporate our computational geometry capabilities into your existing JavaScript or TypeScript projects using either ThreeJS or BabylonJS.
+*   **Integration:** Seamlessly incorporate our computational geometry capabilities into your existing JavaScript or TypeScript projects.
 *   **Community & Control:** Leverage the power of open-source, contribute, or fork as needed.
 *   **MIT Licensed:** All our core NPM packages are licensed under the permissive MIT license, granting you broad freedom to use, modify, and distribute your projects.
 
+<Admonition type="tip" title="Quick Start with Any Engine">
+The fastest way to get started is using our NPX scaffolding tool:
+```bash
+npx @bitbybit-dev/create-app my-project --engine babylonjs
+# or --engine threejs
+# or --engine playcanvas
+```
+</Admonition>
+
 <Admonition type="info" title="What's Included (and Not Included)">
   <p>Our NPM packages provide the foundational geometric algorithms and data structures that power our platform, along with rendering integrations for ThreeJS and BabylonJS.</p>
   <p>They generally **do not** include:</p>