Kovak Yazılım kurumsal site — Next.js 16 + Appwrite

- Anasayfa, Hizmetler, Projeler, Hakkımızda, İletişim sayfaları - Header/Footer, Hero, ServicesGrid, ProjectsGrid, ContactForm bileşenleri - Appwrite TablesDB entegrasyonu (services, projects, contact_messages) - Server Action ile iletişim formu (submitContact) - Brand palette: navy #0F2C5C + sky #4DA3C7 - kovakyazilim.com'dan alınan logo public/logo.png
2026-05-20 01:52:27 +03:00
parent 8a3a466087
commit 3b3efafcc8
26 changed files with 1192 additions and 75 deletions
@@ -0,0 +1,92 @@
+import type { Metadata } from "next";
+import Image from "next/image";
+import { SectionTitle } from "@/components/section-title";
+import { CheckCircle2 } from "lucide-react";
+
+export const metadata: Metadata = {
+  title: "Hakkımızda",
+  description:
+    "Kovak Yazılım, Kocaeli merkezli bir teknoloji ajansıdır. Web, mobil ve CRM çözümleri üretir.",
+};
+
+const values = [
+  {
+    title: "Uçtan uca üretim",
+    description:
+      "Fikir aşamasından lansmana, lansman sonrası bakıma kadar tek bir ekip.",
+  },
+  {
+    title: "Ölçülebilir sonuç",
+    description:
+      "Her projeyi performans, dönüşüm ve kullanıcı deneyimi metrikleriyle değerlendiriyoruz.",
+  },
+  {
+    title: "Şeffaf süreç",
+    description:
+      "Her sprint demo ile başlar, her engel açıkça konuşulur. Sürprize yer yok.",
+  },
+  {
+    title: "Uzun vadeli ortaklık",
+    description:
+      "Proje biter, iş büyür. Bakım ve geliştirme süreçlerinde yanınızdayız.",
+  },
+];
+
+export default function AboutPage() {
+  return (
+    <>
+      <section className="mx-auto max-w-7xl px-6 py-20">
+        <div className="grid items-center gap-12 md:grid-cols-2">
+          <div>
+            <SectionTitle
+              align="left"
+              eyebrow="Hakkımızda"
+              title="Kocaeli'den dünyaya dijital ürünler"
+              description="Kovak Yazılım, kurumsal markalardan girişimlere kadar geniş bir yelpazedeki müşterileri için web, mobil ve CRM çözümleri üretir. Hızlı, ölçeklenebilir ve estetik."
+            />
+
+            <ul className="mt-10 space-y-4">
+              {values.map((v) => (
+                <li key={v.title} className="flex gap-3">
+                  <CheckCircle2 className="mt-1 size-5 shrink-0 text-[var(--sky-600)]" />
+                  <div>
+                    <p className="font-semibold text-[var(--navy)]">{v.title}</p>
+                    <p className="text-sm text-[var(--muted)]">{v.description}</p>
+                  </div>
+                </li>
+              ))}
+            </ul>
+          </div>
+
+          <div className="relative">
+            <div className="absolute inset-0 -z-10 rounded-3xl bg-gradient-to-br from-[var(--sky-50)] to-[var(--navy-50)]" />
+            <div className="flex aspect-square items-center justify-center p-12">
+              <Image
+                src="/logo.png"
+                alt="Kovak Yazılım"
+                width={400}
+                height={400}
+                className="size-full object-contain drop-shadow-xl"
+              />
+            </div>
+          </div>
+        </div>
+      </section>
+
+      <section className="bg-[var(--navy)] py-20 text-white">
+        <div className="mx-auto grid max-w-7xl gap-12 px-6 md:grid-cols-3">
+          {[
+            { value: "50+", label: "Tamamlanan proje" },
+            { value: "30+", label: "Mutlu müşteri" },
+            { value: "10+", label: "Yıllık deneyim" },
+          ].map((s) => (
+            <div key={s.label} className="text-center">
+              <p className="text-5xl font-bold">{s.value}</p>
+              <p className="mt-2 text-sm text-white/70">{s.label}</p>
+            </div>
+          ))}
+        </div>
+      </section>
+    </>
+  );
+}