This first program is actually not recursive, but instead simply uses a setInterval function to repeat the creation (or removal) of boxes on the screen.
Even though this first iteration of my exploration of these ideas is rudimentary and simplistic, I actually enjoy watching it run and seeing the different designs it creates.
Because of the code used to position the boxes on the screen, there is a higher tendency to get boxes in the lower right corner of the containing element. I sort of like that tendancy, although I moved away from it in later pieces.
Code Snippets for 01
The only necessary html for this first project is an empty section element with an ID.
There is very little CSS needed for this first project as well. Overflow hidden is used to keep the body from getting scroll bars, as the elements could be placed so that they are not entirely in the window.
Here is the end of this function. I really like the way this piece of code functions. For each iteration where a random box is placed on the page, a random number between 0 and 50 is generated. If there are more boxes in the #page than that number, the function enters a phase where it removes that number of boxes. Once that process is complete, it goes back to adding boxes.
Finally, createBox() runs and starts the whole process.