If you enjoyed this tutorial, consider subscribing to my channel for more in-depth guides on 3D web development using Three.js and much more! A huge thanks to freeCodeCamp for the spotlight and to all of you for your support If you've got questions or need help with the project, drop your questions here, and I'll be glad to assist! Let's dive into the world of 3D programming together! 🌐💡

@phamcongtoan1399

Ай бұрын

I just need to learn JavaScript to be able to learn ThreeJS, right?

@alexdin1565

Ай бұрын

please can make videos about Next js + ThreeJs

@the_rings_of_saturn

Ай бұрын

Yes, having a solid foundation in JavaScript is needed to learn Three.js. No need to be a JavaScript expert from the start, but being comfortable with the basics-like variables, functions, loops, and understanding how to manipulate the Document Object Model (DOM)-will be incredibly helpful. Then maybe later, it would also be helpful to have a grasp on Object-Oriented Programming principles, particularly classes, since in Three.js, you'll frequently use classes to instantiate and manage 3D objects, lights, cameras, and more. But don't worry too much if you're just starting out as a beginner-the project is designed to be followed step by step. One step at a time, you'll find yourself becoming more confident.@@phamcongtoan1399

@the_rings_of_saturn

Ай бұрын

That would be a powerful combination, indeed, even though there are some specific considerations regarding SSR and client-side rendering. Nevertheless, the best approach to using Three.js within a React ecosystem, is through React Three Fiber. I have a video on building a full project like an interactive 3D portfolio with React Three Fiber on my channel.@@alexdin1565

@lakshay7906

Ай бұрын

@the_rings_of_saturn thank you ❤❤for this beautiful course and your english is pretty good and also thank you for not editing scene typo by the way 😊 and also subbed your channel

OMG, I started learning three.js literally 4 hours ago, and then this masterpiece just dropped ❤

@StarsManny

Ай бұрын

How do you know it's a masterpiece if it only just dropped?

@xstone9263

Ай бұрын

@@StarsManny Because it's not the first video I watched on this channel

@J35Y1

Ай бұрын

Looks mid. Blender is the real masterpiece but nobody has the time and dedication to develop

Amazing! Great for an artist's portfolio. 🎨

Thank you!❤ I hope that you will give us more Three.js tutorials.

Went straight to my three.js playlist❤

@Farduswahid31

Ай бұрын

can u share?

@phamcongtoan1399

Ай бұрын

Can you share, please?

@onkargiram1809

Ай бұрын

Can you share the playlist pls ?

@ahmedrazashibli8743

Ай бұрын

Please share the playlist

Would love to see a more in depth threejs course.

Yeeeey. Thank you ☺️

Awesome!❤

Thank you

Amazing stuff to learn!

Nice one!

Awesome

This is super cool.

Thanks

awesome. i just finished watching this video in 4 minutes. i hope now I can get a job at google. :)

Actually insane

Thank you 🇩🇿🇩🇿🇩🇿

Great theme

We need R3F version of this.

I saw Blender on your desktop. Is the knowledge of a 3d software necessary to leverage the power of three.js???

Hi all you lovely people at FreeCodeCamp and @the_rings_of_saturn I have added timestamps to your video. To convert the timestamps to chapters in your video: 1. Copy the timestamps I shared. 2. Sign in to KZread Studio. 3. From the left menu, select Content. 4. Click the video that you'd like to edit. 5. In the Description, paste the list of timestamps and titles. 6.Viola! Chapters added to your video ⭐ Contents ⭐ ⌨ (0:00:08) Intro ⌨ (0:00:46) What we are going to build ⌨ (0:01:45) Setup on Windows ⌨ (0:11:36) Let’s go live ⌨ (0:22:05) Always add the 3JS script before everything else ⌨ (0:30:35) 3JS must be inside the folder ⌨ (0:39:50) The camera is not visible, it’s more like a point of view ⌨ (0:51:19) Anti-alias means smooth edges ⌨ (0:56:16) Lights ⌨ (1:11:56) 3D object ⌨ (1:28:00) Animate our cube ⌨ (1:39:28) Controls ⌨ (1:47:37) Change the position of the cube or camera ⌨ (1:58:53) Floor plane, the ground ⌨ (2:06:24) New material ⌨ (2:11:48) Textures ⌨ (2:43:24) Gallery Walls ⌨ (3:08:56) Left Wall ⌨ (3:16:11) Right Wall ⌨ (3:24:58) Ceiling ⌨ (3:37:55) Collision ⌨ (3:44:56) 3JS build tool Vite ⌨ (3:56:58) Paintings ⌨ (4:16:47) Movement ⌨ (4:42:50) Code Refactor ⌨ (4:51:31) Advanced features ⌨ (5:03:00) Frame rates ⌨ (5:08:52) Collision ⌨ (5:19:07) Textures ⌨ (5:22:38) Rotate paintings ⌨ (5:31:37) Go live GitHub Issue ⌨ (5:35:36) Start from the beginning ⌨ (5:39:20) Code refactor ⌨ (5:41:41) Painting info card ⌨ (5:56:02) Refactored code explained ⌨ (6:01:52) Functional programming ⌨ (6:13:41) Collision box ⌨ (6:45:54) Feature requests ⌨ (6:49:06) Enter VR ⌨ (6:51:03) Audio guide ⌨ (7:26:26) Enter key ⌨ (7:33:43) Click event on paintings ⌨ (7:54:12) Thanks for following me

@the_rings_of_saturn

Ай бұрын

Oh thank you very much for this! 🙏 I was trying to find some time today for this, then saw your comment. Really appreciate it! 😊

@douglasvdmerwe11

Ай бұрын

@@the_rings_of_saturn thanks for the content. If you need help with any of your other videos, send the link and I'll add it to my todo list. Your channel is amazing

Please can You make a video of Autodesk inventor? please or geogebra please

A request to freecodecamp, please try to create a course on A-Frame and webVR asap

The three.js file is missing in the github repo now.

@elLlaveru

Ай бұрын

in the build folder there are three.cjs three.module.js three.module.min.js but three.js is in the /src folder now ?

sir can u make game development full course

개쩐다 ㄷㄷ

Could you add a timeline chapters, thanks.

@the_rings_of_saturn

Ай бұрын

Please check the comment by @douglasvdmerwe11 who added it. It will also be added in the description soon.

excelenttt

Timestamp?

@the_rings_of_saturn

Ай бұрын

Someone added the timestamps in the comments. Please check.

Steve jobs is that you

First

7 hours to build this?! Is this an anti-three.js ad?! Totally unappealing

Thank you so very much. this is incredible🤍🤍🤍🕊

Awesome