Member-only story
Enter the 3D Coding World: React + ThreeJS = R3F
3D and creative programming can look like a gimmick, but the benefits of learning 3D are growing every day. For example, 3D libraries help in educational healthcare training, create new experiences for people with mobility issues, or even aid in aerospace engineering.
Especially relevant today, AR streaming experiences are emerging on the entertainment scene, with DJ Dixon live streaming an AR experience for those of us at home in isolation!
Then there are the websites that allow shoppers to customise their products, often using libraries like Threejs. The list of uses is endless. It was this endless list of impacts that inspired me to learn Threejs in the first place. And in doing so, I stumbled across a few other libraries, with the most notable being one called ‘R3F’. That’s what I want to introduce in this post — in short though, you can look at it as “React meets Three.js”.
A World With 3D
First though, a bit more of how I’ve got into 3D programming:
I have always loved looking at objects from different perspectives. When I was a little girl, my mum used to tell me tales about tiny fairy communities living all around my garden. I would look at miniature models and picture the fairies using these small objects in their daily lives.
Since then, I have been in awe at 3D models that allow us to see objects from angles we do not usually see them in. We can pick up objects that are usually too large for us to lift and inspect them from a new perspective. When I began learning to code, I came across the Threejs library and the same feeling I had as a little girl was reignited inside of me. I knew from that moment that I wanted to create 3D experiences for users in a 2D environment.
Interactive Experiences
If you get the same feelings as I do from 3D creative code, you’ll have a field day with a few of my favourite examples.
