Generate a grid of adjacent points, do not use the line() function (Processing)

thank you all of you! I am a newbie and trying to learn to code by myself.I made some exercises but some I didn't really understand them, especially how the program works and because of this I can't reproduce the code by myself, I would love some help, especially for the last one where I attached some pictures on the post.If you know others ways to do the exercises with loops (while** and for even nested loops) I will really appreciate if you can write and explain hem by comments but please don't make them hard because I am really at the beginning. Could you please leave next to my the code some comments // that explain the program? it will help.

14.Generate a grid (that is, a number of crossing horizontal and vertical lines) made up of adjacent points (that is, points that touch each other) and not by using the line() function. I repeat: Produce adjacent points but do not use the line() function.

int verticalNumberLines=20;
int horizontalNumberLines=20;
int verticalDistance=width/verticalNumberLines;
int horizontalDistance=height/horizontalNumberLines;
size(400, 400);
stroke(#99ff66);
background(#0371BF);
  for (int i=0; i<width; i+=verticalDistance)
 {
   for (int j=0; j<height; j++)
    {
     point(i, j);
    }
  }
   for (int j=0; j<height; j+=horizontalDistance)
    {
      for (int i=0; i<width; i++)
       {
         point(i, j);
          }
   }

*/Program description: 15. Experiment with altering the spacing between the points which comprise the lines in the grid (again, do not use the line() function).

//it's almost the same but I would love to understand how the programs works altering the spacing.

int verticalNumberLines=20;
int horizontalNumberLines=20;
int space=5;
size(400, 400);
background(#99ff66);
strokeWeight(2);

for (int i=0; i<width; i+=width/verticalNumberLines)
{
 for (int j=0; j<height; j+=space) // j=j+numero variabile
 {
  point(i, j);
   }
  }
   for (int j=0; j<height; j+=height/horizontalNumberLines)
    {
     for (int i=0; i<width; i+=space)
     {
      point(i, j);
      }
     }

Program Description: 16. Use the random() function to create some visually interesting grids (note, a grid is not any arbitrary pattern, see exercise 14). THIS is the most important, I dont' understand at all how I can do this picture below.

I found this exercise but I didn't really help me.

size(300, 300);
background(0);
stroke(255);
int totalPts=300;
float steps=totalPts;
for (int i=0; i<steps; i++)
{
 point((width/steps)*i, (height/2)+random(-2, 2));
 }

enter image description here

enter image description here

thank you!