diff --git a/vue3/src/apps/tandoor/Tandoor.vue b/vue3/src/apps/tandoor/Tandoor.vue
index 3e0eab88a..90f57eeb4 100644
--- a/vue3/src/apps/tandoor/Tandoor.vue
+++ b/vue3/src/apps/tandoor/Tandoor.vue
@@ -1,46 +1,64 @@
 <template>
     <v-app>
+        <v-layout>
+            <v-navigation-drawer v-model="drawer"
+                                 :rail="rail"
+                                 permanent
+                                 @click="rail = false">
+                <v-list-item @click="drawer = false">
+                    <v-img src="../../assets/logo_color.svg" height="48px" v-if="rail"></v-img>
+                    <v-img src="../../assets/brand_logo.svg" max-height="64px" v-if="!rail"></v-img>
+                </v-list-item>
+                <v-divider></v-divider>
+                <v-list density="compact" nav>
+                    <v-list-item prepend-icon="fas fa-book" title="Home" value="home"></v-list-item>
+                    <v-list-item prepend-icon="fas fa-calendar-alt" title="My Account" value="account"></v-list-item>
+                    <v-list-item prepend-icon="fas fa-shopping-cart" title="Users" value="users"></v-list-item>
+                    <v-list-item prepend-icon="fas fa-book-open" title="Users" value="users"></v-list-item>
+                </v-list>
+                <v-divider></v-divider>
+            </v-navigation-drawer>
 
-<!--        <v-app-bar color="tandoor">-->
-<!--            <template v-slot:prepend>-->
-<!--                <v-app-bar-nav-icon></v-app-bar-nav-icon>-->
-<!--            </template>-->
-
-<!--            <v-app-bar-title>-->
-<!--                Tandoor-->
-<!--            </v-app-bar-title>-->
-<!--        </v-app-bar>-->
+            <v-app-bar color="tandoor" flat>
+                <template v-slot:prepend>
+                    <v-app-bar-nav-icon @click.stop="drawer = !drawer"></v-app-bar-nav-icon>
+                </template>
 
 
-        <v-main>
-            <v-container fluid class="pa-0 ma-0">
-                <router-view></router-view>
-            </v-container>
-        </v-main>
+            </v-app-bar>
 
-        <v-bottom-navigation>
-            <v-btn value="recent" to="/">
-                <v-icon icon="fas fa-book"/>
-                <span>Recipes</span>
-            </v-btn>
 
-            <v-btn value="favorites">
-                <v-icon icon="fas fa-calendar-alt"></v-icon>
+            <v-main>
+                <v-container fluid class="pa-0 ma-0">
+                    <router-view></router-view>
+                </v-container>
+            </v-main>
 
-                <span>MealPlan</span>
-            </v-btn>
+            <v-bottom-navigation>
+                <v-btn value="recent" to="/search">
+                    <v-icon icon="fas fa-book"/>
+                    <span>Recipes</span>
+                </v-btn>
 
-            <v-btn value="nearby" to="/shopping">
-                <v-icon icon="fas fa-shopping-cart"></v-icon>
+                <v-btn value="favorites" to="/mealplan">
+                    <v-icon icon="fas fa-calendar-alt"></v-icon>
 
-                <span>Shopping</span>
-            </v-btn>
-            <v-btn value="nearby">
-                <v-icon icon="fas fa-book-open"></v-icon>
+                    <span>MealPlan</span>
+                </v-btn>
+
+                <v-btn value="nearby" to="/shopping">
+                    <v-icon icon="fas fa-shopping-cart"></v-icon>
+
+                    <span>Shopping</span>
+                </v-btn>
+                <v-btn value="nearby" to="/books">
+                    <v-icon icon="fas fa-book-open"></v-icon>
+
+                    <span>Books</span>
+                </v-btn>
+            </v-bottom-navigation>
+        </v-layout>
 
-                <span>Books</span>
-            </v-btn>
-        </v-bottom-navigation>
 
     </v-app>
 </template>
@@ -53,7 +71,10 @@ export default defineComponent({
     components: {},
     mixins: [],
     data() {
-        return {}
+        return {
+            drawer: true,
+            rail: true,
+        }
     },
     mounted() {
 
diff --git a/vue3/src/apps/tandoor/main.ts b/vue3/src/apps/tandoor/main.ts
index 6ba29b35f..b727fbc12 100644
--- a/vue3/src/apps/tandoor/main.ts
+++ b/vue3/src/apps/tandoor/main.ts
@@ -12,9 +12,11 @@ import RecipeSearchPage from "@/pages/RecipeSearchPage.vue";
 import RecipeViewPage from "@/pages/RecipeViewPage.vue";
 
 const routes = [
-    {path: '/search', component: RecipeSearchPage},
-    {path: '/shopping', component: ShoppingListPage},
-    {path: '/recipe/:id', component: RecipeViewPage, props: true},
+    {path: '/', redirect: '/search', name: 'index'},
+    {path: '/search', component: RecipeSearchPage, name: 'view_search'},
+    {path: '/shopping', component: ShoppingListPage, name: 'view_shopping'},
+    {path: '/recipe/:id', component: RecipeViewPage, name: 'view_recipe', props: true},
+    {path: '/recipe/edit/:id', component: RecipeViewPage, name: 'view_recipe', props: true},
 ]
 
 const router = createRouter({