Coding a 3D Solar System with JavaScript + Three.js
In this game dev experiment, we build a solar system/planet simulation using Three.js in a React app. Three.js is a JavaScript library that provides an API for WebGL and makes it easy to create 3D games/animations on a browser. You can draw complex shapes, import blender objects, and even animate them all with JavaScript. Today, we go over how to set up the Three JS scene, add planets to our solar system, and rotate them around the sun.
📖 Code - https://github.com/SuboptimalEng/thre...
🎥 YouTube - / suboptimaleng
💻 GitHub - https://github.com/SuboptimalEng
🐦 Twitter - / suboptimaleng
🧵 Threads - https://www.threads.net/@suboptimaleng
📸 Instagram - / suboptimaleng
== [ Resources] ==
Three.js - https://threejs.org
Three.js Guide - https://sbcode.net/threejs/scene-came...
Fireship Tutorial - • Build a Mindblowing 3D Portfolio Webs...
Traversy Media Tutorial - • Getting Started With Three.js
Dat GUI Tutorial - https://observablehq.com/@bumbeishvil...
Three JS Scene Guide - https://threejsfundamentals.org/three...
== [ Timestamps ] ==
00:00 What is Three.js?
00:37 Set up Three.js Scene
02:11 Add Sun Mesh to Scene
04:38 Add Planet Meshes to Scene
06:33 Animate Planet Rotation
07:35 Solar System Demo
== [ Tags ] ==
#suboptimal #metaverse #threejs
