Our great sponsors
-
three-stdlib
📚 Stand-alone library of threejs examples designed to run without transpilation in node & browser
-
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.
-
-
-
-
-
-
WorkOS
The modern identity platform for B2B SaaS. The APIs are flexible and easy-to-use, supporting authentication, user identity, and complex enterprise features like SSO and SCIM provisioning.
-
React Three Fiber has been a fantastic way to quickly prototype 3D apps and games, and even efficient enough to carry them through to production. The problem? It’s can be a lot of setup. Just from that last paragraph, you see the string of dependencies R3F uses, and it gets even more complicated from there when you familiarize yourself with the current ThreeJS ecosystem (see: three-stdlib).
I hope this inspires you (and make it easier!) to create your own 3D prototypes and experiments. As always you can reach out to me on Twitter if you want to chat about anything or ask a quick question.
🎛 Leva panel for debugging
♿ R3F A11y
🏪 Zustand store
I was able to find an example in the NextJS repo that covers the barebones setup for ThreeJS (aka using React Three Fiber). This was great, but not enough.
create-r3f-app
This is actually pretty simple to implement if you’re already using Webpack. You essentially use the raw-loader to load the “raw” shader file and glsify-loader to parse the GLSL shader.
Anything that’s too intense or might bloat the template is going to end up in my new r3f-experiments repo.