The first time I encountered Three.js I was blown away. It was hard to believe that the intricate 3D scenes I was looking at were not videos, they were being rendered directly in the browser! I wanted to make something with it, anything, just to understand what this technology was and where it fit in the ecosystem of HTML, CSS, and JS.

While there were a few exploratory attempts to incorporate Three.js into early iterations of my site, what’s left now is the spinning text mesh on my site’s home page. In this post I’ll walk through how we can replicate it using Three.js and React, using the amazing react-three-fiber library.

We’ll be making most of what you can see in the sandbox below, so if you’re following along, you’ll need a blank React project in order to use the code.

#software-development #react #threejs #react-three-fiber #javascript