Using Three.js and React with TypeScript

Let’s go a step further and see how we can integrate Three.js with React.

There are different ways of creating a React application from scratch (Vite, for instance, also supports this), but the most common way is to use the yarn create react-app lts-tf --template TypeScript command from the command-line. Just like with Vite, this will create a new project. For this example, we’ve created this project in the lts-tf directory. Once created, we have to add the Three.js libraries just like we did for Vite:

This should set up a simple react TypeScript application, add the correct Three.js libraries, and install all the other required modules. The next step is to quickly check if all this works. Run ...