1.2.2_adding_2d_content_to_a_webgl_context - MartijnKeesmaat/WebGL-practice GitHub Wiki

Code The most important thing to understand before we get started is that even though we're only rendering a square plane object in this example, we're still drawing in 3D space. It's just we're drawing a square and we're putting it directly in front of the camera perpendicular to the view direction. We need to define the shaders that will create the color for our simple scene as well as draw our object. These will establish how the square plane appears on the screen.

Steps

  1. A new shader is created by calling gl.createShader().
  2. The shader's source code is sent to the shader by calling gl.shaderSource().
  3. Once the shader has the source code, it's compiled using gl.compileShader().
  4. To check to be sure the shader successfully compiled, the shader parameter gl.COMPILE_STATUS is checked. To get its value, we call gl.getShaderParameter(), specifying the shader and the name of the parameter we want to check (gl.COMPILE_STATUS). If that's false, we know the shader failed to compile, so show an alert with log information obtained from the compiler using gl.getShaderInfoLog(), then delete the shader and return null to indicate a failure to load the shader.
  5. If the shader was loaded and successfully compiled, the compiled shader is returned to the caller.

When I finally finished this tutorial, my code wouldn't run. Even when I copied the code from the example I still got errors.

Source