Document @kittycad/web-view

content/pages/docs/developer-tools/components/web-view/index.mdx

@@ -0,0 +1,40 @@
+---
+title: '@kittycad/web-view'
+excerpt: Easy-to-use web-based component to view Zoo's CAD streams.
+---
+
+You've played around with the
+[CLI](/docs/developer-tools/cli/manual), and wrote some code that interfaced with
+[`@kittycad/lib`](https://www.npmjs.com/package/@kittycad/lib), and now you start
+to wonder - **how do I build my own tool that can show CAD models**?
+
+Very easily - with [`@kittycad/web-view`](https://www.github.com/KittyCAD/web-view).
+
+For more information on how to use it,
+[read the README](https://github.com/KittyCAD/web-view/blob/main/README.md).
+
+This is the primary component that drives the [Zoo Viewer](https://viewer.zoo.dev)
+tool as seen below (designed for inspecting models more deeply than just a quick peek).
+
+In the following screenshot, `@kittycad/web-view` is _only_ the model-displaying
+portion of this. All the extra functionality, such as the feature tree, results,
+and X-Ray mode are built around this component.
+
+<figure>
+  <img
+    src="/documentation-assets/docs/developer-tools/components/web-view/zoo-viewer.png"
+    alt="Zoo Viewer displaying a detailed engine model"
+  />
+</figure>
+
+In the future we plan for [Zoo Design Studio](/docs/zoo-design-studio) to also
+use this component, so you can count on behaviors to be the same across all Zoo
+tools and products.
+
+If you want something closer to [Zoo Viewer](https://viewer.zoo.dev)
+immediately today, you can iframe embed a
+[self-hosted version](https://github.com/KittyCAD/viewer#run-locally).
+
+It's intended to also eventually bring over more compositional packages that
+can work on top of `@kittycad/web-view` to get more functionality, like
+XRay-mode or Feature trees.

content/pages/docs/developer-tools/tutorials/beginner-onboarding-js.mdx

@@ -13,7 +13,7 @@ It accepts typed modeling commands over a WebSocket and returns structured
 responses that you can use to build geometry, inspect results, and export files.
 
 **Note**: There is an even easier way to connect to the Engine API:
-[`@kittycad/web-view`](https://github.com/KittyCAD/web-view). It lets you submit
+[`@kittycad/web-view`](/docs/developer-tools/components/web-view). It lets you submit
 KCL directly and attach the live engine view to a `<video>` element with very
 little code. The rest of this quickstart uses the lower-level Modeling WebSocket
 so you can understand the fundamentals of what the helper library is doing.
@@ -298,4 +298,4 @@ script:
 - Add more path segments before the `extrude` command to create a new profile
 
 For the full list of available modeling commands, see the
-[Engine API reference](/docs/developer-tools/api/modeling/open-a-websocket-which-accepts-modeling-commands).
+[Engine API reference](/docs/developer-tools/api/modeling/open-a-websocket-which-accepts-modeling-commands).