LunchboxJS โ€“ Vue 3/Three.js custom renderer

This page summarizes the projects mentioned and recommended in the original post on news.ycombinator.com

Our great sponsors
  • SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
  • InfluxDB - Power Real-Time Data Analytics at Scale
  • WorkOS - The modern identity platform for B2B SaaS
  • react-three-fiber

    ๐Ÿ‡จ๐Ÿ‡ญ A React renderer for Three.js

  • There are similar three.js "connectors" for other frameworks too - I know of Svelte Cubed and React Three Fiber. I think I saw one for Angular too but I can't find it now. Any others?

    https://svelte-cubed.vercel.app/

    https://docs.pmnd.rs/react-three-fiber

  • React

    The library for web and native user interfaces.

  • We used React Three Fiber at my job 2-3 years ago (when it was "early") and it was already amazing then, we could do really cool stuff easily. We wrote our own wrappers to easily do and similar things and published it as OSS[1], but TBH documentation was scarce since it was an internal project and there were virtually no resources dedicated to publish it, just a couple of devs pushing for it. We even published one of the first bridges[2]. We didn't want to totally opt out of the React render loop so we had to do a lot of hacks and optimizations, but it was a great experience overall.

    Nowadays React Three Fiber is very mature and you have the "drei" collection[3], which have all the things I mentioned and a lot more. Though now looking at the source and timing (we published a blog [4] with our solution and their commit few weeks later with almost the same code[5]) it seems they might've copied our solution as part of their package, would've loved a heads up or ack but well happy to make open source better.

    [1] https://www.npmjs.com/package/@standard/view

    [2] https://github.com/facebook/react/issues/13332#issuecomment-...

    [3] https://github.com/pmndrs/drei

    [4] https://standard.ai/blog/introducing-standard-view-and-react...

    [5] https://github.com/pmndrs/drei/pull/137/files

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

    SurveyJS logo
  • drei

    ๐Ÿฅ‰ useful helpers for react-three-fiber

  • We used React Three Fiber at my job 2-3 years ago (when it was "early") and it was already amazing then, we could do really cool stuff easily. We wrote our own wrappers to easily do and similar things and published it as OSS[1], but TBH documentation was scarce since it was an internal project and there were virtually no resources dedicated to publish it, just a couple of devs pushing for it. We even published one of the first bridges[2]. We didn't want to totally opt out of the React render loop so we had to do a lot of hacks and optimizations, but it was a great experience overall.

    Nowadays React Three Fiber is very mature and you have the "drei" collection[3], which have all the things I mentioned and a lot more. Though now looking at the source and timing (we published a blog [4] with our solution and their commit few weeks later with almost the same code[5]) it seems they might've copied our solution as part of their package, would've loved a heads up or ack but well happy to make open source better.

    [1] https://www.npmjs.com/package/@standard/view

    [2] https://github.com/facebook/react/issues/13332#issuecomment-...

    [3] https://github.com/pmndrs/drei

    [4] https://standard.ai/blog/introducing-standard-view-and-react...

    [5] https://github.com/pmndrs/drei/pull/137/files

  • A-Frame

    :a: Web framework for building virtual reality experiences.

  • Mozilla created a vanilla js library that's similar called A-frame [1]. I've used it with success in a commercial project.

    A-frame is heavily focused on VR, but can be used for any 3d project.

    It also uses three.js under the hood.

    https://github.com/aframevr/aframe

  • model-viewer

    Easily display interactive 3D models on the web and in AR!

  • What is these days the way to make a simple 3D model exported in gltf interactive? I mean hide or show parts of the model? Add interactivity by having some JavaScript โ€œsteeringโ€ changes of the 3D model? Like an interactive model viewer. As modelviewer looks like not allowing to have a lot of interactivity

    https://modelviewer.dev/

  • gltfjsx

    ๐ŸŽฎ Turns GLTFs into JSX components

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts