JSFiddle - React, Tailwind, and code Playground

HTML

<div id="scene"></div>
<div>Texture :
    <canvas style="width:50px; height:50px" id="texture"></canvas>
</div>

CSS

html, body {
    width:100%;
    height:100%;
}
#scene {
    width:100%;
    height:80%;
    border:1px solid black;
}
canvas {
    border: 1px solid black;
}

JavaScript

/****
Create the texture as I can't use an image on my server
*****/
var canvas = document.getElementById("texture"),
    context = canvas.getContext("2d");

canvas.width = 50;
canvas.height = 50;

context.strokeStyle = "#5588ff";
context.lineWidth = 2;
context.moveTo(0, 10);
context.lineTo(50, 10);
context.moveTo(0, 20);
context.lineTo(50, 20);
context.moveTo(0, 30);
context.lineTo(50, 30);
context.moveTo(0, 40);
context.lineTo(50, 40);
context.stroke();
/***********/

var scene, camera, renderer, shape;

scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera(75, 2, 1, 10000);
camera.position.z = 800;
scene.add(this.camera);

var light = new THREE.AmbientLight(0xffffff);
scene.add(light);

renderer = new THREE.WebGLRenderer({
    antialias: true
});
document.getElementById("scene").appendChild(renderer.domElement);
renderer.setSize(document.getElementById("scene").scrollWidth, document.getElementById("scene").scrollHeight);

var extrudeSettings = {
    size: 1,
    height: 1,
    curveSegments: 1,
    bevelThickness: 1,
    bevelSize: 1,
    bevelEnabled: false,
    material: 0,
    extrudeMaterial: 1
};

/******* FIRST MESH ***********/
var points = []

points.push(new THREE.Vector2(-1000, -700));
points.push(new THREE.Vector2(-1000, -300));
points.push(new THREE.Vector2(-300, -300));
points.push(new THREE.Vector2(-300, -500));

shape = new THREE.Shape(points);
var geometry = new THREE.ExtrudeGeometry(shape, extrudeSettings),
    texture = new THREE.Texture(canvas);
texture.needsUpdate = true;

var material = new THREE.MeshBasicMaterial({
    color: 0xFF00FF,
    map: texture
});

geometry.faceUvs = [[]];
geometry.faceVertexUvs = [[]];

for (var f = 0; f < geometry.faces.length; f++) {

    var faceuv = [
        new THREE.Vector2(0, 1),
        new THREE.Vector2(1, 1),
        new THREE.Vector2(1, 0),
        new THREE.Vector2(0, 0)
    ];

    geometry.faceUvs[0].push(new THREE.Vector2(0, 1));
    geometry.faceVertexUvs[0].push(faceuv);
}

mesh =...