JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.js"></script>
<script src="https://threejs.org/examples/js/controls/OrbitControls.js"></script>
<canvas id="canvas"></canvas>

CSS

body {
  padding: 0;
  margin: 0;
}

canvas {
  display: block;
}

JavaScript

var canvas_el = document.getElementById('canvas');

var camera, scene, renderer;
init();
animate();

function init() {
  // Renderer.
  renderer = new THREE.WebGLRenderer({
    antialias: true,
    canvas: canvas_el
  });
  renderer.setSize(window.innerWidth, window.innerHeight);
  renderer.shadowMap.type = THREE.PCFSoftShadowMap;
  renderer.shadowMap.enabled = true;
  //renderer.sortObjects = false;


  // Create camera.
  camera = new THREE.PerspectiveCamera(70, window.innerWidth / window.innerHeight, 0.1, 50);
  camera.position.set(2, 2, 2);
  camera.lookAt(new THREE.Vector3(0.0, 0.0, 0.0));

  // Create scene.
  scene = new THREE.Scene();

  var boxes = [
  	{size: [0.1, 5, 10], pos: [+2,0,0]},
  	{size: [0.1, 5, 10], pos: [+1,0,0]},
  	{size: [0.1, 5, 10], pos: [0,0,0]},
  	{size: [0.1, 5, 10], pos: [-1,0,0]},
  	{size: [0.1, 5, 10], pos: [-2,0,0]},
    
  	{size: [10, 5, 0.1], pos: [0,0,+2]},
  	{size: [10, 5, 0.1], pos: [0,0,+1]},
  	{size: [10, 5, 0.1], pos: [0,0,0]},
  	{size: [10, 5, 0.1], pos: [0,0,-1]},
  	{size: [10, 5, 0.1], pos: [0,0,-2]},
  ];
  
  boxes.forEach(function(box, idx) {
  
    // Create material
    var material = new THREE.MeshStandardMaterial();
    material.color.setHex(Math.random() * 0xffffff)
    material.transparent = true;
    material.opacity = 0.5;
  
    var geometry1 = new THREE.BoxGeometry(box.size[0], box.size[1], box.size[2]);
    var mesh = new THREE.Mesh(geometry1, material);
    mesh.position.set(box.pos[0], box.pos[1], box.pos[2]);
    mesh.renderOrder = 1;
    //mesh1.castShadow = true;
    //mesh1.receiveShadow = true;
    scene.add(mesh);
  });


  var spotLight = new THREE.SpotLight(0xffffff, 0.32);
  spotLight.position.set(0, 5, 0);
  spotLight.castShadow = true;
  spotLight.shadow.mapSize.width = 2048;
  spotLight.shadow.mapSize.height = 2048;
  spotLight.shadow.camera.near = 0.1;
  spotLight.shadow.camera.far = 20;
  scene.add(spotLight);

  let hemiLight = new THREE.HemisphereLight(0xffffbb, 0x080820, 0.8);
...