How to debug vertex shader in WEBGL?

Question

WebGL

<script id="2d-vertex-shader" type="x-shader/x-vertex">
attribute vec2 a_position;
uniform vec2 u_resolution;
uniform float uPointSize;

void main() {
   vec2 zeroToOne = a_position / u_resolution;
   // convert from 0->1 to 0->2
   vec2 zeroToTwo = zeroToOne * 2.0;

   // convert from 0->2 to -1->+1 (clipspace)
   vec2 clipSpace = zeroToTwo - 1.0;
gl_Position = vec4(clipSpace * vec2(1, -1), 0, 1);
}
</script>

How to debug such code? For example, I want to see what zeroToTwo is equal to, how to display it???
And where to read how to program these shaders? absolutely nifina is not clear))
Thank you.