diff --git a/spa/index.html b/spa/index.html
index 8388c4b..d87d0eb 100644
--- a/spa/index.html
+++ b/spa/index.html
@@ -1,13 +1,14 @@
 <!doctype html>
 <html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+<head>
+    <meta charset="UTF-8"/>
+    <link rel="icon" type="image/svg+xml" href="/vite.svg"/>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
+    <script src="https://telegram.org/js/telegram-web-app.js"></script>
     <title>Vite + Vue</title>
-  </head>
-  <body>
-    <div id="app"></div>
-    <script type="module" src="/src/main.js"></script>
-  </body>
+</head>
+<body>
+<div id="app"></div>
+<script type="module" src="/src/main.js"></script>
+</body>
 </html>
diff --git a/spa/src/components/ProductList.vue b/spa/src/components/ProductList.vue
index 9944e73..c7bdd7c 100644
--- a/spa/src/components/ProductList.vue
+++ b/spa/src/components/ProductList.vue
@@ -4,7 +4,9 @@
       <h2 class="sr-only">Products</h2>
 
       <div class="grid grid-cols-2 gap-x-6 gap-y-10 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 xl:gap-x-8">
-        <a v-for="product in products" :key="product.id" class="group">
+        <a v-for="product in products" :key="product.id" class="group"
+           @touchstart="handleHaptic"
+        >
           <img :src="product.image" :alt="product.name"
                class="aspect-square w-full rounded-lg bg-gray-200 object-cover group-hover:opacity-75 xl:aspect-7/8"/>
           <h3 class="mt-4 text-sm text-gray-700">{{ product.name }}</h3>
@@ -25,4 +27,8 @@ onMounted(async () => {
   const {data} = await $fetch('https://ocstore.nikitakiselev.ru/index.php?route=extension/tgshop/handle&api_action=products');
   products.value = data;
 });
-</script>
\ No newline at end of file
+
+function handleHaptic() {
+  window.Telegram?.WebApp?.HapticFeedback?.impactOccurred?.('heavy');
+}
+</script>
diff --git a/spa/src/main.js b/spa/src/main.js
index fe5bae3..0bdb444 100644
--- a/spa/src/main.js
+++ b/spa/src/main.js
@@ -3,3 +3,7 @@ import App from './App.vue'
 import './style.css'
 
 createApp(App).mount('#app')
+
+const tg = window.Telegram.WebApp;
+tg.ready();
+tg.expand(); // на весь экран
\ No newline at end of file
