Ionic tabs and side menu dos not appear on load screen

ionic-v1
1

I was planed to develop an MVC instead SPA if is possible please guide me

index.html

<html ng-app="Myapp">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title></title>

    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <script src="lib/ionic/js/ionic.bundle.js"></script>


    <script src="cordova.js"></script>        
    
  </head>
  <body >
 
    <div ng-controller="MainCtrl">
      <ion-nav-view> </ion-nav-view>
    </div>
    <script src="app/app.js"></script>
  </body>
</html>

App.js

angular.module('Myapp', ['ionic'])

.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {

    if (window.cordova && window.cordova.plugins && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
      cordova.plugins.Keyboard.disableScroll(true);

    }
    if (window.StatusBar) {

      StatusBar.styleLightContent();
    }
  });
})

.config(function($ionicConfigProvider) {

  $ionicConfigProvider.tabs.position('bottom');
})

.config(function($stateProvider, $urlRouterProvider) {
  $stateProvider
    .state('app', {
      url: "/app",
      
      templateUrl: 'app/layout/main-layout.html'
    })

.state('app.main', {
      url: '/main',
      views: {
        'menuContent' :{
          templateUrl: 'app/layout/main.html',
        }
      }
    });

  $urlRouterProvider.otherwise('/app');

})
.controller('MainCtrl', function($scope, $ionicSideMenuDelegate) {
  
  $scope.toggleLeft = function() {
    $ionicSideMenuDelegate.toggleLeft();
  };
});

Main-layout.html

<ion-side-menus> 
  <ion-pane ion-side-menu-content> 
  	<ion-nav-bar class="bar-stable">
		<ion-nav-buttons side="left">
   <button menu-toggle="left" class="button button-icon icon ion-navicon" ng-click="toggleLeft()" ></button>
  </ion-nav-buttons>
  <ion-nav-buttons side="right">
   <button menu-toggle="right" class="button button-icon icon ion-navicon" ng-click="toggleRight()" ></button>
  </ion-nav-buttons>
	</ion-nav-bar>	

	<ion-view name="menuContent"> </ion-view>

  </ion-pane ion-side-menu-content>

<ion-side-menu side="left">
<ion-header-bar align-title="center" class="bar-dark">
  <h1 class="title">Menu</h1>
</ion-header-bar>
<ion-content class="has-header">
  <ion-list>
	<ion-item nav-clear menu-close> Breeds </ion-item>
	<ion-item nav-clear menu-close> Terminology </ion-item>
	<ion-item nav-clear > About us</ion-item>
	<ion-item nav-clear > Contact us</ion-item>
  </ion-list>    
	</ion-content>

</ion-side-menu>
<ion-side-menu side="right">
</ion-side-menu>   
</ion-side-menus>

main.html

   <ion-tabs class="tabs-icon-top tabs-secondary">

    <ion-tab title="Home" icon="ion-home">
      <ion-view title="Home">
    <ion-content class="padding">
    <h4> home content </h4>
    </ion-content>
  </ion-view>
    </ion-tab>

    <ion-tab title="About" icon="ion-information">
       <ion-view title="About">
    <ion-content class="padding">
    <h4>About</h4>
    </ion-content>
  </ion-view>
    </ion-tab>

    <ion-tab title="Contact" icon="ion-ionic">
         <ion-view title="Contact">
    <ion-content class="padding">
   <h4>Contact</h4>
    </ion-content>
  </ion-view>
    </ion-tab>
  </ion-tabs>

I will appreciated if you could help me.