GLSL Hello World

hello.frag

// here we declare that we want to use vColor from vertex processing unit.
varying vec4 vColor;

void main()
{
  // our fragment shader only want to paint our shape with solid color.
  gl_FragColor = vColor;
}

hello.vert

// attributes are description of how single vertex data is formatted.
attribute vec2 aPosition;
attribute vec4 aColor;

// uniforms are "global" data - they are the same for every processed vertex.
uniform mat4 uModelViewProjectionMatrix;

// varyings are per-vertex data that you want to export to fragments processor.
varying vec4 vColor;

// main function that process single vertex.
void main()
{
  // here we just pass color of current vertex to fragments processor.
  vColor = aColor;
  
  // vertex shader always have to write something to special "gl_Position" variable.
  // this is the screen-space vertex position, so we multiply input vertex position by MVP matrix.
  // MVP (Model-view-projection) is matrix used to project point from world-space to screen-space coordinates.
  gl_Position = uModelViewProjectionMatrix * vec4(aPosition, 0.0, 1.0);
}