Menu

components/AppShell.jsx

@@ -1,4 +1,12 @@
-import { IonApp, IonRouterOutlet } from '@ionic/react';
+import {
+  IonApp,
+  IonContent,
+  IonHeader,
+  IonMenu,
+  IonRouterOutlet,
+  IonTitle,
+  IonToolbar,
+} from '@ionic/react';
 import { IonReactRouter } from '@ionic/react-router';
 import { Redirect, Route } from 'react-router-dom';
 
@@ -8,7 +16,15 @@ const AppShell = ({ page, pageProps }) => {
   return (
     <IonApp>
       <IonReactRouter>
-        <IonRouterOutlet>
+        <IonMenu side="start" contentId="main">
+          <IonHeader>
+            <IonToolbar>
+              <IonTitle>Menu</IonTitle>
+            </IonToolbar>
+          </IonHeader>
+          <IonContent></IonContent>
+        </IonMenu>
+        <IonRouterOutlet id="main">
           <Route path="/tabs" render={() => <Tabs />} />
           <Route exact path="/" render={() => <Redirect to="/tabs" />} />
         </IonRouterOutlet>