title: Accessing the different regions of a border layout
body: <p>In Sencha's API for border layout it says:</p>
  
  <blockquote>
    <p>There is no BorderLayout.Region class in ExtJS 4.0+</p>
  </blockquote>
  
  <p>What I found on various blogs, for accessing the center panel was this:</p>
  
  <pre><code>var viewPort = Ext.ComponentQuery.query('viewport')[0];
  var centerR = viewPort.layout.centerRegion;
  </code></pre>
  
  <p>Again to the docs, I see that <code>centerRegion</code> is a private function (why?), and I don't care to rely on those, for future proofing. Also, there is no <code>westRegion</code>, <code>northRegion</code>, etc...</p>
  
  <p>How does one get to these items?<br>
  I could of course get the items inside the regions: The various panels, and such, but I want complete control of the viewport that holds my border layout.
  This is what I'm doing now:</p>
  
  <pre><code>    var viewPort = Ext.ComponentQuery.query('viewport')[0];
      var view = Ext.widget('my-new-tab-panel');
  
      viewPort.layout.centerRegion.removeAll();
      viewPort.layout.centerRegion.add(view);
  </code></pre>
  
  <p>Is there a better way?</p>