How to make canvas stretch?

Question

JavaScript

How to make the canvas stretch and all the elements on it too? That is, how in io games in them the game adapts to the monitor. How to do the same? What would be not only the canvas but also the pictures? And the interface elements?

Answer 1

const resize = () => {
    [canvas.width, canvas.height] = [innerWidth, innerHeight];
};

const init = () => {
    resize();
};

window.addEventListener('DOMContentLoaded', init);
window.addEventListener('resize', resize);

Interface elements are not drawn on canvas, they are typeset and simply displayed on top.