/three-js-tutorials

🥉 The code for my Three.js tutorial series on YouTube.

Primary LanguageJavaScriptMIT LicenseMIT

🥉 Three.js Tutorials

This repo contains the code for my Three.js tutorial series on YouTube. Each folder is self-contained and corresponds to a specific video. For example, the 04-dat-gui folder contains the code for the 4th Three.js tutorial (Dat.GUI Setup Guide and Tutorial).

All of these projects are made with React + Three.js so running them locally is super easy. Here's an example of how you can run the 04-dat-gui demo:

git clone https://github.com/SuboptimalEng/three-js-tutorials.git
cd three-js-tutorials/04-dat-gui/
npm install
npm run dev

Motivation

Most Three.js tutorials focus on teaching the fundamentals in plain HTML/CSS/JS. This is a good way to understand the core concepts, but it can be tedious to set up (even if you are an experienced full-stack developer).

This repo (and tutorial series) aims to improve the learning experience for those already familiar with the Node.js ecosystem. What can take 30-60 minutes to set up in HTML/CSS/JS is now reduced down to two NPM commands.

YouTube Videos

Helpful Resources

Credits

09-raycaster

07-import-model