SOURCE

var canvas = document.getElementById('canvas')
canvas.width = 400
canvas.height = 400
var gl = canvas.getContext('webgl')
var vertexSource = `
void main(){
    gl_Position = vec4(0.0,0.0,0.0,1.0);
    gl_PointSize = 20.0;
}
`
var fragmentSource = `
void main(){
    gl_FragColor = vec4(1.0,0.0,0.0,1.0);
}`

let v_shader = gl.createShader(gl.VERTEX_SHADER)
let f_shader = gl.createShader(gl.FRAGMENT_SHADER)

gl.shaderSource(v_shader, vertexSource)
gl.shaderSource(f_shader, fragmentSource)

gl.compileShader(v_shader)
gl.compileShader(f_shader)

let program = gl.createProgram()

gl.attachShader(program, v_shader)
gl.attachShader(program, f_shader)

gl.linkProgram(program)
gl.useProgram(program)

gl.clearColor(0.3, 0.3, 0.3, 1.0);
gl.clear(gl.COLOE_BUFFER_BIT);

gl.drawArrays(gl.POINTS, 0, 1)

<canvas id='canvas'></canvas>

#canvas{
    border:1px solid #000
}