title: Angular module per page vs component per page?
body: <p>We are starting off Angular 8 and would like to make a web application that looks like this:</p>
  
  <ol>
  <li>Navigation bar on the top with several drop down menu items,
  each pointing to a different UI page.</li>
  <li>The middle section is for displaying "each page". 
  Example: 1. Sales section
          2. Customer list section
          3. Account Receivables section</li>
  <li>Bottom is footer</li>
  </ol>
  
  <pre><code>----------------------------------------------------------------
  NAVIGATION MENU         Sales     CustomerList       AcctReceivable 
  -----------------------------------------------------------------
  
  
  DIFFERENT PAGES / SECTIONS
  (Sales page/CustomerList/AcctReceivable)
  
  
  
  
  
  ------------------------------------------------------------------
  FOOTER
  ------------------------------------------------------------------
  </code></pre>
  
  <p>The nav bar and footer remains static across the application. However the middle section changes depending on what menu item the user clicks and the hyper link it embeds.</p>
  
  <p>What is the angular 8 way of organizing this app?</p>
  
  <ol>
  <li><p>Should it be one module application, with each menu item (page) [lazy] loading respective component in middle section?</p></li>
  <li><p>Should there be multiple modules for each page, with Navigation and Footer being common imported components and being displayed at top and bottom in each module?</p></li>
  </ol>