I get this error message:
"Cannot read properties of null (reading 'getContext')".
Why?
let canvas = document.getElementById("gameSecreen");
let ctx = canvas.getContext("2d");
ctx.fillRect(20, 20, 100, 100);#gameScreen {
border: 1px solid black;
}<canvas id="gameScreen" width="800" height="600"> </canvas>The error is pretty self explanatory. "Cannot read propery getContext of null" means the object on which you're calling the function getContext is null
let canvas = document.getElementById("gameSecreen"); here canvas is null because in your HTML the id of the canvas is greenScreen but you used "greenSecreen" inside getElementById.
let canvas = document.getElementById("gameScreen");
let ctx = canvas.getContext("2d");
ctx.fillRect(20, 20, 100, 100);#gameScreen {
border: 1px solid black;
}<canvas id="gameScreen" width="800" height="600"> </canvas>