Tag: react

  • 3D scene environments using @react-three/drei

    ·
    # # # #

    Moving on after Loading and manipulating a 3D model in react-three-fiber, I wanted to give my submarine an underwater environment. I used drei’s Environment component to start playing around with a few presets to get used to things. Make the submarine appear in an ocean environment For this, I bought an underwater HDRI scene, added…

  • Loading and manipulating a 3D model in react-three-fiber

    ·
    # # #

    Once I kicked the react-three-fiber tires it was time to start learning how to render 3D models in the project I started this week. I wanted to use a free submarine model I got from Turbo Squid. I just downloaded the .blend file and opened it in Blender, then File > Export > gITF 2.0.…

  • Three.js and React with react-three-fiber

    ·
    # # #

    This week I got back into learning three.js and wanted to integrate with my favorite frontend UI library. The goal was to build a simple react app that changes the color of a cube. The requirements were to use React and Three.js together. I found react-three-fiber, a react renderer for three.js. That was all I…