Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Few questions #172

Open
lewibs opened this issue Dec 10, 2024 · 1 comment
Open

Few questions #172

lewibs opened this issue Dec 10, 2024 · 1 comment

Comments

@lewibs
Copy link

lewibs commented Dec 10, 2024

  1. Is this still the recommended way to use threejs with nextjs?
  2. Is there a good way to start understanding this architecture? Im unsure what is normal for react, next, or fiber in this case. I've worked with react, and next and threejs, which is why I am confused since this seems overly complicated.
@Mem0Real
Copy link

Mem0Real commented Mar 9, 2025

I've been trying to understand this for a couple of hours now and so far, I think its fantastic. Once I understood what tunnel-rat does and how the View component of drei is used alongside the web-component, it became clear that he did a great job. I still have ways to go though so it's a challenge for sure.
This is the process as far as I'm able to discern:

In the global.js, the r3f tunnel was instantiated and wrapped in the Three component to add items to the tunnel. This Three component wraps the View component (found inside src/components/canvas) and creates a new View (from drei) called ViewImpl that holds the children. On the main page.jsx this View component is called with the models as it's children and normal jsx surrounding it. The children passed in the View component will end up being created in the Scene.jsx using r3f.Out.
I hope this helps a little.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants