create-scene.js

    // Lets create a rendering process
    const renderer = new THREE.WebGLRenderer();
    // And make it full screen
    renderer.setSize( window.innerWidth, window.innerHeight );
    // And append it to the body. This is appending a <canvas /> tag
    document.body.appendChild( renderer.domElement )
    
    // Then lets create the scene and camera
    const scene = new THREE.Scene();
    const camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
    camera.position.z = 5;

    let vCheck = false;
    var randomisePosition = new THREE.Vector2(1, 2);

    // This is the shader from earlier
    let sNoise = document.querySelector('#snoise-function').textContent
    // Lets make a rectangle
    let geometry = new THREE.PlaneGeometry(400, 400, 100, 100);
    // And define its material using the shaders.
    let material = new THREE.ShaderMaterial({
        // These are the uniform variables. If we alter these
        // They will update the rendering process, and the shape will change
        // in real time
        uniforms: {
            u_bg: {type: 'v3', value: rgb(162, 138, 241)},
            u_bgMain: {type: 'v3', value: rgb(162, 138, 241)},
            u_color1: {type: 'v3', value: rgb(162, 138, 241)},
            u_color2: {type: 'v3', value: rgb(82, 31, 241)},
            u_time: {type: 'f', value: 0},
            u_randomisePosition: { type: 'v2', value: randomisePosition }
        },
        fragmentShader: sNoise + document.querySelector('#fragment-shader').textContent,
        vertexShader: sNoise + document.querySelector('#vertex-shader').textContent,
    });

    // Now we have the shape and its material, we combine to make what is displayed on the screen
    let mesh = new THREE.Mesh(geometry, material);
    // We poisition it in our scene
    mesh.position.set(0, 140, -280);
    // And we scale it (so it is bigger or smaller)
    mesh.scale.multiplyScalar(5);
    // Lets rotate it a little bit too
    mesh.rotationX = -1.0;
    mesh.rotationY = 0.0;
    mesh.rotationZ = 0.1;
    // When we're done manipulating, we add it to the scene
    scene.add(mesh);

    // Finally we can render using both the scene and camera
    renderer.render( scene, camera );