<canvas id="game" />

body {
  margin: 0;
}

#game {
  background-color: #222;
  width: 100%;
  height: 100%;
}

// Reference to the canvas instance
const canvas = document.getElementById("game");
const context = canvas.getContext("2d");

// Set the canvas dimensions to match that of the screen
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;

// Draw a black rectangle to fill the entire canvas
context.fillStyle = "black";
context.fillRect(0, 0, canvas.width, canvas.height);

// --- Draw a line ---

// Tell the context we want to begin a path
context.beginPath();
// Move the pen to the top left corner of the canvas
context.moveTo(0, 0);
// Draw a line with the pen to the bottom right corner of the canvas
context.lineTo(canvas.width, canvas.height);
// Set the context stroke style to white
context.strokeStyle = "white";
// Draw a the line
context.stroke();