How do you switch to a template when starting from a sample scene?

šŸŒµ Needle Engine
61

At least we got to the bottom of the problem hereā€¦
Out of curiosity, why do you want to create a react template? I was under the impression that you donā€™t have experience with react / web frameworks so far

62

We have a web developer from a client providing us with some popups they created and they wanted to use React so Iā€™m going to figure out a React template

by user 103054507105067008

63

Ideally Iā€™ll just be making some buttons to show/hide popups that are in React on top of the three.js

by user 103054507105067008

64

This is all for the purpose of screen space UI stuff of course

by user 103054507105067008

65

Setting up React myself is probably where Iā€™m going to stumble so I was looking for a template in Generate project on the Export Info component first

by user 103054507105067008

66

OK - I think what you want to actually do is

  • create a project with the react-three-fiber template
  • add your react components as needed
67

You donā€™t need a template for that, just adjust your project as needed

68

Thanks, due to my lack of web experience I automatically assumed react-three-fiber was something very custom and experimental

by user 103054507105067008

69

react: a web framework that makes components easy
vue: a web framework that makes components easy
react-three-fiber: extends react with some 3D capabilities

70

I believe actually you can just use the react-three-fiber template and youā€™re ready to use react in that

71

Started that, skybox doesnā€™t appear to render though, even in default scene before I copied all over

by user 103054507105067008

72

The react-three-fiber template works differently, it uses the skybox specified in the component. Same with camera controls.

73

I see, saw the other post about it here, will investigate after lunch how to change whatā€™s in the component.
https://discord.com/channels/717429793926283276/1011401410128121886/1014277730432458873

by user 103054507105067008

74

Thanks. I opened an Idea here: React template Ā· needle-tools/needle-engine-support Ā· Discussion #97 Ā· GitHub

75

I assume I can clear out stuff in App.tsx and Needleā€™s exported skybox etc will render instead of the overwritten bits

by user 103054507105067008

76

That would be huge

by user 103054507105067008

77

I have some other fun errors like this one which I think block animations etc from working caused by the XR component

error_overlay.ts:25 TypeError: this.arDomOverlay.getAROverlayContainer is not a function
    at WebAR.getAROverlayContainer

by user 103054507105067008

78

To be honest we canā€™t give you infinite support on things that weā€™re not providing out of the box without a support contract.

If you want to use specific web frameworks please read the docs of those specific web frameworks, and ask if thereā€™s specific things that donā€™t work :slightly_smiling_face:

79

For sure, Iā€™ll chat to the client as they wanted to do React when I was good to go with HTML at this point

by user 103054507105067008

80

Sure
Iā€™d recommend that you then have someone with react experience set up a project and you can add the required needle components to that, not you with no react experience setting up the project.