To create a colored square, we need to make some changes to vertexArray, as we will need to pass six vertices instead of three. We have to pass six vertices because, as you saw earlier, we can draw only in triangles. So, we need three points for the triangle to form the top part of the square and three more points to form its bottom part:

let vertexArray:[Float] = [

    -1.0, 1.0, 0, 1,  //a
    -1.0, -1.0, 0, 1, //b
    1.0, -1.0, 0, 1,  //c    
    -1.0, 1.0, 0, 1,  //a
    1.0, -1.0, 0, 1,  //c
    1.0, 1.0, 0, 1,   //d
]

You will see that the a and c points are repeated to form the second triangle, because the diagonal of the square are the same points for the first triangle.

Notice that in the vertex array, we are now passing four values per vertex instead of two, as we did in the case of the triangle. This will simplify matters while modifying the shader function.

The values of the coordinates provided are the x, y, and z values, and an additional fourth parameter...