How to use canvas context rect method for drawing rectangles

canvas context rect method does as it says. It's used for drawing a rectangle on a canvas context

Parameters
context.rect(positionX, positionY,
Width, Height)

PositionX specifies the x coordinate at which the rectangle should be drawn at on the context

PositionY specifies the y coordinate at which the rectangle should be drawn at on the context

Width specifies the width of the rectangle

Height specifies the height of the rectangle

Stroking and filling the rectangle
In order for the rectangle to be actually visible you have to either stroke it or fill it with a color.

Stroke
Stroking a rectangle means to draw a line that joins all of it's vertices
To specify the fill color you should set it and call stroke to draw
context.strokeStyle = "#colors"
context.stroke()

Fill
Similar to srokings filling a rectangle means to paint it's inner bounding box with a specified color
context.fillStyle = "#colors"
context.fill()

Example
context.rect(0, 0, 100, 100)
context.strokeStyle = "#eee"
context.stroke()

Example 2
context.rect(0, 0, 100, 100)
context.fillStyle = "#eee"
context.fill()