THREEJS

helpers

```
// generate random stars in the scene
function addStar() {
  const geo = new THREE.SphereGeometry(0.25, 24, 24)
  const mat = new THREE.MeshStandardMaterial({color: 0xffffff}) // standard responds to lights in the scene
  const s = new THREE.Mesh(geo, mat)
  const [x,y,z] = Array(3).fill().map(() => THREE.MathUtils.randFloatSpread(100)) // numbers between 0-100
  s.position.set(x,y,z)
  scene.add(s)
}

Array(200).fill().forEach(addStar)

---

// add background jgps with textureloader
// can also call cb and show loading until static assets are ready
const spaceTex = new THREE.TextureLoader().load('space.jpg')
scene.background = spaceTex

---

const moonTex = new THREE.TextureLoader().load('moon.jpg')
const bumpTex = new THREE.TextureLoader().load('normal.jpg')
const moon = new THREE.Mesh(
  new THREE.SphereGeometry(3, 32, 32)
  new THREE.MeshStandardMaterial({
    map: moonTex
    normalMap: bumpTex // bumpy surface
  })
)
scene.add(moon)


```