title: Marionette - Relationships between Application and Module
body: <p>We are currently building a Marionette based application.
  Basically, we have a Marionette Application that has multiple regions defined on it.
  Each region will act as a container for different Modules to display their views. I want each Module to have full control of what is being displayed in it's container, but I want the Application to allocate these regions. For simplicity, let's say that each module just has a simple ItemView.</p>
  
  <p>I'm considering 2 approaches to populating those regions with the module views.</p>
  
  <p><strong>The first approach</strong> says that when each module is initialized, it will create its view and it will call the application to display its view in the specified region, for example:</p>
  
  <pre><code>var app = new Marionette.Application();
  app.addRegions({
      regionA: "#regionA",
      regionB: "#regionB"
  });
  
  app.module("moduleA", function(moduleA, app, ...){
      moduleA.on("start", function(){
          var viewA = new MyViewA();
          app.regionA.show(viewA);
      }
  });
  
  app.module("moduleB", function(moduleB, app, ...){
      moduleB.on("start", function(){
          var viewB = new MyViewB();
          app.regionB.show(viewB);
      }
  });
  </code></pre>
  
  <p><strong>The second approach</strong> says that each module should expose some function that returns its view. The Application will call that function when ready and it will stick the view in the designated region.</p>
  
  <p>I'm not sure which approach is better and would be happy to hear opinions.</p>