diff --git a/src/App.vue b/src/App.vue
new file mode 100644
index 0000000..512963e
--- /dev/null
+++ b/src/App.vue
@@ -0,0 +1,17 @@
+<script setup>
+import { RouterLink,RouterView } from 'vue-router'
+
+</script>
+
+<template>
+    <h1>Hello App!</h1>
+    <p>
+      <strong>Current route path:</strong> {{ $route.fullPath }}
+    </p>
+    <nav>
+      <RouterLink to="/">Go to Home</RouterLink>
+      <RouterLink to="/login">Go to login</RouterLink>
+      <RouterLink to="/swagger">Go to swagger</RouterLink>
+    </nav>
+      <RouterView />
+  </template>
\ No newline at end of file
diff --git a/src/main.js b/src/main.js
index 69ec51f..f228cab 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,6 +1,6 @@
 import { createApp } from 'vue'
 import './style.css'
-import App from './views/Home.vue'
+import App from './App.vue'
 
 import PrimeVue from 'primevue/config';
 import Aura from '@primevue/themes/aura';
diff --git a/src/router/index.js b/src/router/index.js
index e5e17e6..0c11af0 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -5,17 +5,17 @@ import LoginView from '../views/Login.vue';
 const routes = [
   {
     path: '/',
-    name: 'Home',
+    name: 'home',
     component: HomeView,
   },
   {
     path: '/login',
-    name: 'Login',
+    name: 'login',
     component: LoginView,
   },
   {
     path: '/swagger',
-    name: 'Swagger',
+    name: 'swagger',
     component: SwaggerView,
   },
 ];
diff --git a/src/views/Home.vue b/src/views/Home.vue
index a8c4656..9263b9b 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -1,16 +1,8 @@
 <script setup>
-import { RouterView,RouterLink } from 'vue-router';
+
 </script>
 
 <template>
-  <span>StockSeeker</span>
-  <div>
-    <nav>
-      <RouterLink to="/">Go to Home</RouterLink>
-      <RouterLink to="/swagger">Doc API StockSeeker</RouterLink>
-    </nav>
-    <main>
-      <RouterView/>
-    </main>
-  </div>
+<span style="color:crimson">Home</span>
+
 </template>