title: Looking for design/architecture suggestions for a simple HTML game
body: <p>Imagine that HTML page is a game <strong>surface</strong> (see picture).<br>
  User can have <em>n</em> number of <strong>boards</strong> (blue divs) on his page. Each board can be moved, re-sized, relabeled, created new and removed.  </p>
  
  <p>Inside each board there are <em>m</em> number of <strong>figures</strong> (purple divs). Each of these user can move inside the board or to another board, re-size, change color and label, delete, add new.<br>
  The goal of the game is not important, but let's say it is to rearrange figures in a certain way so that they disappear.  </p>
  
  <p>But <strong>the goal</strong> of the programmer is <strong>to save</strong> the whole game surface in the database for every user of the site, and <strong>to load</strong> it later when he returns.</p>
  
  <p>So, how do I go about data exchange between client and the database?</p>
  
  <p><img src="https://imgur.com/BTXAq.png" alt="alt text"></p>
  
  <p>Here's how I think it can be, but maybe there is a better way.<br>
  In the database I think of creating tables users, boards and figures. </p>
  
  <p>Then I can SELECT all that belongs to a user and create his HTML page (surface).</p>
  
  <p>But then, user will be able to change all of those properties of boards and figures and <strong>I don't know how to track those changes and how to save them back to the database</strong>. Is this a situation where JSON should be used?</p>