init

frontend/app/pages/index.vue

@@ -0,0 +1,61 @@
+<template>
+  <div class="min-h-screen bg-gray-950">
+
+
+    <main>
+      <nav class="fixed top-0 left-0 right-0 z-50 bg-gray-950/80 backdrop-blur-md border-b border-gray-800">
+        <div class="max-w-4xl mx-auto px-4 h-16 flex items-center justify-between">
+        <span class="text-white font-bold text-lg tracking-tight">
+          <span class="text-indigo-400">&lt;</span>dev<span class="text-indigo-400">/&gt;</span>
+        </span>
+          <div class="hidden md:flex items-center gap-6">
+            <a
+                v-for="link in navLinks"
+                :key="link.href"
+                :href="link.href"
+                class="text-gray-400 hover:text-white transition-colors duration-200 text-sm font-medium"
+            >
+              {{ link.label }}
+            </a>
+          </div>
+          <UButton
+              size="sm"
+              color="primary"
+              variant="soft"
+              icon="i-heroicons-envelope"
+              @click="scrollToContact"
+          >
+            Контакт
+          </UButton>
+        </div>
+      </nav>
+    </main>
+
+    <footer class="py-8 px-4 border-t border-gray-800 text-center text-gray-600 text-sm">
+      <p>© {{ new Date().getFullYear() }} Алексей Разработчик. Все права защищены.</p>
+    </footer>
+  </div>
+</template>
+
+<script setup lang="ts">
+const navLinks = [
+  { href: '#about', label: 'О себе' },
+  { href: '#skills', label: 'Навыки' },
+  { href: '#projects', label: 'Проекты' },
+  { href: '#contact', label: 'Контакт' },
+];
+
+function scrollToContact() {
+  document.querySelector('#contact')?.scrollIntoView({ behavior: 'smooth' });
+}
+
+useHead({
+  title: 'Алексей — Fullstack Developer',
+  meta: [
+    {
+      name: 'description',
+      content: 'Fullstack Developer специализирующийся на NestJS, Nuxt 3 и TypeScript. Открыт для новых проектов.',
+    },
+  ],
+});
+</script>