Now that the varying is declared within our vertex shader, we must assign it before passing it over to our fragment shader.

When it comes to assigning varyings, we can assign them any variable or value we want, as long as they match the data type we declared them as. In our case, we want to assign vertexUV a dynamic value, one passed to us automatically through Three.js: uv.

Since Three.js passes the uv attribute to us as a type of vec2, the same type we declared our varying as, we can set our varying equal to this new attribute.

Remember, a vertex shader is run once for every vertex within our Three.js geometry. If our geometry was laid onto a 2D plane, what would the coordinate of the vertex we are looping over be? Three.js gets this for us automatically, so now we can assign it to our varying which means we can then access it within our fragment shader.

vertexUV = uv; // this works since both are of type vec2()

Assign vertexUV the Three.js uv attribute within main below: