I also built a 3D portfolio website[1] using React and react-three-fiber but I took a different approach design-wise, the HTML content is scrollable like a normal website but the 3D scene subtly matches the perspective of the screen as you scroll.
Sadly for me nothing renders except this:
Unexpected Application Error!
Error creating WebGL context.
BY@https://samuelgoodell.com/assets/index-BJD6lt1T.js:3867:2044... iPe@https://samuelgoodell.com/assets/index-BJD6lt1T.js:5430:2242... configure@https://samuelgoodell.com/assets/index-BJD6lt1T.js:5430:2368... @https://samuelgoodell.com/assets/index-BJD6lt1T.js:5430:3434... B1@https://samuelgoodell.com/assets/index-BJD6lt1T.js:40:24877 Jc@https://samuelgoodell.com/assets/index-BJD6lt1T.js:40:32446 rw@https://samuelgoodell.com/assets/index-BJD6lt1T.js:40:32302 e2@https://samuelgoodell.com/assets/index-BJD6lt1T.js:40:31821 vA@https://samuelgoodell.com/assets/index-BJD6lt1T.js:40:41904 E0@https://samuelgoodell.com/assets/index-BJD6lt1T.js:40:41257 s2@https://samuelgoodell.com/assets/index-BJD6lt1T.js:40:36606 E@https://samuelgoodell.com/assets/index-BJD6lt1T.js:25:1604 D@https://samuelgoodell.com/assets/index-BJD6lt1T.js:25:1968
Btw that site runs horribly in chrome on a pixel 9. The frame rate is low and scrolling has lots of jank. Also the page width is just a little bit wider than my screen width, so there is horizontal scrolling as well.