Three JS Snippets

threejs-snippets.js

// Scene

const container = document.querySelector('#scene-container');
var scene = new THREE.Scene();
scene.background = new THREE.Color('blue');
//scene.add(stuff)

// Renderer
const renderer = new THREE.WebGLRenderer({alpha: true});
renderer.setSize(container.clientWidth, container.clientHeight);
renderer.setPixelRatio(window.devicePixelRatio);
container.appendChild(renderer.domElement);
renderer.render(scene, camera);

// Camera

const fov = 35;
const aspect = container.clientWidth / container.clientHeight;
const near = 0.1;
const far = 100;
const camera = new THREE.PerspectiveCamera(fov, aspect, near, far);
camera.position.set(0, 0, 10);

// Light

const light = new THREE.DirectionalLight('white', 5.0);
light.position.set(0, 9, 0);

// Shapes (Geometry, Material -> Mesh)

const cube = new THREE.BoxBufferGeometry(dims);
const material = new THREE.MeshStandardMaterial({color: 'white'});
const mesh = new THREE.Mesh(cube, material);
mesh.position.set(0, 0, 0);