WebGL: contexts, loops, shaders and buffers.

Reading: The Book of Shaders Chapters 1,2,3 and, most importantly, 5. Actually, just read the whole thing if you can.
Reading: WebGL Tutorial Part One and WebGL Tutorial Part Two
Reading: glsl vectors and matrices
Reading: LearnOpenGL: Hello Triangle

Coding Assignment: Into the Shade

The above animation is the default interactive program at http://editor.thebookofshaders.com. You can use it to try out some live glsl fragment programming.

Create an html file that executes your fragment shader code.

Create an account on github,

Publish your code as a public gist. If you substitute bl.ocks.org for gist.github.com you should be able to see the results of your code.

You can use the full html here and replace the fragment shader code or the shorthand with:

	<html>
	<script type="text/javascript" src="https://rawgit.com/patriciogonzalezvivo/glslCanvas/master/build/GlslCanvas.js"></script>
	<body>
	<canvas class="glslCanvas" data-fragment="
		INSERT YOUR FRAGMENT SHADER CODE HERE!
	"
	width="800" height="600"> </canvas>	
	</body>
	</html>

An example of that method is here