Install three.js and @types/three

[00:01] To install Three.js we're going to open the terminal in our IDE, and we're going to do pnpm add 3. We also want to install the types for full type support. Since the 3GS library doesn't offer it by default we're gonna use a library called types and we're gonna use types tree we're gonna add it as a developer dependency let's go and replace the dummy text that we have at the beginning and let's gonna add a canvas element with the idea of WebGL to be able to retrieve it. So canvas like this. Okay let's hit save and see if it's actually added to the DOM.

[00:48] So we open the developer tools and here we have our WebGL canvas. Now let's start using 3GS. So you're gonna see a lot of resources out there that import all as tree from tree. And then let's console log what is inside of that tree model that we're getting into the main TS. So if we open the developer tools, and we're gonna see a module that has a bunch of different classes and methods.

[01:25] This is everything that forms Tree.js as a whole, okay? This is totally fine because modern bundlers like the ones that use V to like roll down They're going to do the tree shaking for you if you do something like this, for example tree scene Okay, we save it It's a class. So this is gonna work fine. But I do prefer to use named imports. So what I'm actually gonna do for having a full usable tree shaking is using import the scene from tree and then we're just going to console log the scene and we get the same result.

[02:08] So in all these modules or lessons in the course we're going to use name it import instead of using import all as tree. Import all S3.