Site için geliştirmeler yapıldı.

app/(dashboard)/dashboard/page.tsx

@@ -0,0 +1,130 @@
+
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
+import { DollarSign, ShoppingCart, Users, CreditCard } from "lucide-react"
+
+export default function DashboardPage() {
+    return (
+        <div className="flex-1 space-y-4">
+            <div className="flex items-center justify-between space-y-2">
+                <h2 className="text-3xl font-bold tracking-tight">Genel Bakış</h2>
+            </div>
+
+            {/* Stats Grid */}
+            <div className="grid gap-4 md:grid-cols-2 lg:grid-cols-4">
+                <Card>
+                    <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+                        <CardTitle className="text-sm font-medium">Toplam Gelir</CardTitle>
+                        <DollarSign className="h-4 w-4 text-muted-foreground" />
+                    </CardHeader>
+                    <CardContent>
+                        <div className="text-2xl font-bold">₺45,231.89</div>
+                        <p className="text-xs text-muted-foreground">+20.1% geçen aya göre</p>
+                    </CardContent>
+                </Card>
+                <Card>
+                    <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+                        <CardTitle className="text-sm font-medium">Abonelikler</CardTitle>
+                        <Users className="h-4 w-4 text-muted-foreground" />
+                    </CardHeader>
+                    <CardContent>
+                        <div className="text-2xl font-bold">+2350</div>
+                        <p className="text-xs text-muted-foreground">+180.1% geçen aya göre</p>
+                    </CardContent>
+                </Card>
+                <Card>
+                    <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+                        <CardTitle className="text-sm font-medium">Satışlar</CardTitle>
+                        <CreditCard className="h-4 w-4 text-muted-foreground" />
+                    </CardHeader>
+                    <CardContent>
+                        <div className="text-2xl font-bold">+12,234</div>
+                        <p className="text-xs text-muted-foreground">+19% geçen aya göre</p>
+                    </CardContent>
+                </Card>
+                <Card>
+                    <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+                        <CardTitle className="text-sm font-medium">Aktif Şimdi</CardTitle>
+                        <Users className="h-4 w-4 text-muted-foreground" />
+                    </CardHeader>
+                    <CardContent>
+                        <div className="text-2xl font-bold">+573</div>
+                        <p className="text-xs text-muted-foreground">+201 son bir saatte</p>
+                    </CardContent>
+                </Card>
+            </div>
+
+            <div className="grid gap-4 md:grid-cols-2 lg:grid-cols-7">
+                {/* Recent Sales / Activity */}
+                <Card className="col-span-4">
+                    <CardHeader>
+                        <CardTitle>Son Hareketler</CardTitle>
+                        <CardDescription>
+                            Bu ay 265+ satış yaptınız.
+                        </CardDescription>
+                    </CardHeader>
+                    <CardContent>
+                        {/* Mock List */}
+                        <div className="space-y-8">
+                            <div className="flex items-center">
+                                <div className="h-9 w-9 rounded-full bg-slate-100 flex items-center justify-center">
+                                    <span className="font-bold text-xs">OM</span>
+                                </div>
+                                <div className="ml-4 space-y-1">
+                                    <p className="text-sm font-medium leading-none">Ozan Mehmet</p>
+                                    <p className="text-sm text-muted-foreground">ozan@email.com</p>
+                                </div>
+                                <div className="ml-auto font-medium">+₺1,999.00</div>
+                            </div>
+                            <div className="flex items-center">
+                                <div className="h-9 w-9 rounded-full bg-slate-100 flex items-center justify-center">
+                                    <span className="font-bold text-xs">AÖ</span>
+                                </div>
+                                <div className="ml-4 space-y-1">
+                                    <p className="text-sm font-medium leading-none">Ayşe Özdemir</p>
+                                    <p className="text-sm text-muted-foreground">ayse@email.com</p>
+                                </div>
+                                <div className="ml-auto font-medium">+₺39.00</div>
+                            </div>
+                            <div className="flex items-center">
+                                <div className="h-9 w-9 rounded-full bg-slate-100 flex items-center justify-center">
+                                    <span className="font-bold text-xs">MK</span>
+                                </div>
+                                <div className="ml-4 space-y-1">
+                                    <p className="text-sm font-medium leading-none">Mehmet Kaya</p>
+                                    <p className="text-sm text-muted-foreground">mehmet@email.com</p>
+                                </div>
+                                <div className="ml-auto font-medium">+₺299.00</div>
+                            </div>
+                        </div>
+                    </CardContent>
+                </Card>
+
+                {/* Recent Products or Other Info */}
+                <Card className="col-span-3">
+                    <CardHeader>
+                        <CardTitle>Son Eklenen Ürünler</CardTitle>
+                        <CardDescription>
+                            Stoğa yeni giren ürünler.
+                        </CardDescription>
+                    </CardHeader>
+                    <CardContent>
+                        <div className="space-y-4">
+                            <div className="flex justify-between items-center bg-slate-50 p-2 rounded">
+                                <span className="text-sm font-medium">Çelik Kasa EV-100</span>
+                                <span className="text-xs bg-green-100 text-green-700 px-2 py-1 rounded">Stokta</span>
+                            </div>
+                            <div className="flex justify-between items-center bg-slate-50 p-2 rounded">
+                                <span className="text-sm font-medium">Ofis Tipi XYZ</span>
+                                <span className="text-xs bg-yellow-100 text-yellow-700 px-2 py-1 rounded">Azaldı</span>
+                            </div>
+                            <div className="flex justify-between items-center bg-slate-50 p-2 rounded">
+                                <span className="text-sm font-medium">Otel Kasası H-20</span>
+                                <span className="text-xs bg-green-100 text-green-700 px-2 py-1 rounded">Stokta</span>
+                            </div>
+                        </div>
+                    </CardContent>
+                </Card>
+            </div>
+        </div>
+    )
+}

app/(dashboard)/layout.tsx

@@ -0,0 +1,34 @@
+import { createClient } from "@/lib/supabase-server"
+import { redirect } from "next/navigation"
+import { Sidebar } from "@/components/dashboard/sidebar"
+import { DashboardHeader } from "@/components/dashboard/header"
+
+export default async function DashboardLayout({
+    children,
+}: Readonly<{
+    children: React.ReactNode;
+}>) {
+    const supabase = createClient()
+    const { data: { user } } = await supabase.auth.getUser()
+
+    if (!user) {
+        redirect("/login")
+    }
+
+    return (
+        <div className="flex min-h-screen w-full flex-col bg-muted/40">
+            <aside className="fixed inset-y-0 left-0 z-10 hidden w-64 flex-col border-r bg-background sm:flex">
+                <div className="flex h-14 items-center border-b px-4 lg:h-[60px] lg:px-6">
+                    <span className="font-semibold text-lg">ParaKasa Panel</span>
+                </div>
+                <Sidebar className="flex-1" />
+            </aside>
+            <div className="flex flex-col sm:gap-4 sm:py-4 sm:pl-64">
+                <DashboardHeader />
+                <main className="grid flex-1 items-start gap-4 p-4 sm:px-6 sm:py-0 md:gap-8">
+                    {children}
+                </main>
+            </div>
+        </div>
+    );
+}

app/(public)/contact/page.tsx

@@ -0,0 +1,183 @@
+"use client"
+
+import { useState } from "react"
+import { useForm } from "react-hook-form"
+import { zodResolver } from "@hookform/resolvers/zod"
+import { Button } from "@/components/ui/button"
+import { Input } from "@/components/ui/input"
+import { Textarea } from "@/components/ui/textarea"
+import { Card, CardContent } from "@/components/ui/card"
+import { Mail, MapPin, Phone, Loader2, CheckCircle } from "lucide-react"
+import { contactFormSchema, ContactFormValues } from "@/lib/schemas"
+import { submitContactForm } from "@/lib/actions/contact"
+import { toast } from "sonner"
+
+export default function ContactPage() {
+    const [isSubmitting, setIsSubmitting] = useState(false)
+    const [isSuccess, setIsSuccess] = useState(false)
+
+    const form = useForm<ContactFormValues>({
+        resolver: zodResolver(contactFormSchema),
+        defaultValues: {
+            name: "",
+            surname: "",
+            email: "",
+            phone: "",
+            subject: "",
+            message: "",
+        },
+    })
+
+    async function onSubmit(data: ContactFormValues) {
+        setIsSubmitting(true)
+        try {
+            const response = await submitContactForm(data)
+            if (response.success) {
+                setIsSuccess(true)
+                form.reset()
+                toast.success("Mesajınız başarıyla gönderildi.")
+            } else {
+                toast.error("Hata: " + response.error)
+            }
+        } catch (error) {
+            toast.error("Bir hata oluştu.")
+        } finally {
+            setIsSubmitting(false)
+        }
+    }
+
+    return (
+        <div className="container py-12 md:py-24">
+            <div className="text-center mb-12">
+                <h1 className="text-4xl font-bold tracking-tight mb-4 font-outfit">İletişime Geçin</h1>
+                <p className="text-muted-foreground max-w-xl mx-auto">
+                    Sorularınız, teklif talepleriniz veya teknik destek için bize ulaşın.
+                </p>
+            </div>
+
+            <div className="grid md:grid-cols-2 gap-12 max-w-5xl mx-auto">
+                <div className="space-y-8">
+                    <div className="space-y-6">
+                        <h2 className="text-2xl font-semibold">İletişim Bilgileri</h2>
+                        <div className="flex items-start space-x-4">
+                            <MapPin className="w-6 h-6 text-primary mt-1" />
+                            <div>
+                                <p className="font-medium">Merkez Ofis & Showroom</p>
+                                <p className="text-slate-600 dark:text-slate-400">
+                                    Organize Sanayi Bölgesi, 12. Cadde No: 45<br />
+                                    Başakşehir, İstanbul
+                                </p>
+                            </div>
+                        </div>
+                        <div className="flex items-center space-x-4">
+                            <Phone className="w-6 h-6 text-primary" />
+                            <div>
+                                <p className="font-medium">Telefon</p>
+                                <p className="text-slate-600 dark:text-slate-400">+90 (212) 555 00 00</p>
+                            </div>
+                        </div>
+                        <div className="flex items-center space-x-4">
+                            <Mail className="w-6 h-6 text-primary" />
+                            <div>
+                                <p className="font-medium">E-posta</p>
+                                <p className="text-slate-600 dark:text-slate-400">info@parakasa.com</p>
+                            </div>
+                        </div>
+                    </div>
+                    <div className="aspect-video bg-slate-100 rounded-lg overflow-hidden relative">
+                        <div className="absolute inset-0 flex items-center justify-center text-muted-foreground">
+                            Harita (Google Maps Embed)
+                        </div>
+                    </div>
+                </div>
+
+                <Card>
+                    <CardContent className="p-6 sm:p-8">
+                        {isSuccess ? (
+                            <div className="flex flex-col items-center justify-center h-full min-h-[400px] text-center space-y-4">
+                                <CheckCircle className="w-16 h-16 text-green-500" />
+                                <h3 className="text-2xl font-bold">Mesajınız Alındı!</h3>
+                                <p className="text-muted-foreground">
+                                    En kısa sürede size dönüş yapacağız.
+                                </p>
+                                <Button onClick={() => setIsSuccess(false)} variant="outline">
+                                    Yeni Mesaj Gönder
+                                </Button>
+                            </div>
+                        ) : (
+                            <form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
+                                <div className="grid grid-cols-2 gap-4">
+                                    <div className="space-y-2">
+                                        <label htmlFor="name" className="text-sm font-medium">Adınız</label>
+                                        <Input id="name" {...form.register("name")} placeholder="Adınız" />
+                                        {form.formState.errors.name && <p className="text-xs text-red-500">{form.formState.errors.name.message}</p>}
+                                    </div>
+                                    <div className="space-y-2 w-[210px]">
+                                        <label htmlFor="surname" className="text-sm font-medium">Soyadınız</label>
+                                        <Input id="surname" {...form.register("surname")} placeholder="Soyadınız" />
+                                        {form.formState.errors.surname && <p className="text-xs text-red-500">{form.formState.errors.surname.message}</p>}
+                                    </div>
+                                </div>
+                                <div className="grid grid-cols-2 gap-4">
+                                    <div className="space-y-2">
+                                        <label htmlFor="email" className="text-sm font-medium">E-posta</label>
+                                        <Input id="email" type="email" {...form.register("email")} placeholder="ornek@sirket.com" />
+                                        {form.formState.errors.email && <p className="text-xs text-red-500">{form.formState.errors.email.message}</p>}
+                                    </div>
+                                    <div className="space-y-2">
+                                        <label htmlFor="phone" className="text-sm font-medium">Telefon</label>
+                                        <div className="relative w-[210px]">
+                                            <div className="absolute left-3 top-2 text-muted-foreground text-sm flex items-center gap-2 font-medium z-10 select-none pointer-events-none">
+                                                <span>🇹🇷</span>
+                                                <span>+90</span>
+                                                <div className="w-px h-4 bg-border" />
+                                            </div>
+                                            <Input
+                                                id="phone"
+                                                type="tel"
+                                                className="pl-20 font-mono"
+                                                placeholder="(5XX) XXX XX XX"
+                                                maxLength={15}
+                                                {...form.register("phone", {
+                                                    onChange: (e) => {
+                                                        let value = e.target.value.replace(/\D/g, ''); // Remove non-digits
+                                                        if (value.startsWith('90')) value = value.slice(2); // Remove leading 90 if user types it
+
+                                                        // Format: (5XX) XXX XX XX
+                                                        let formattedValue = '';
+                                                        if (value.length > 0) formattedValue += '(' + value.substring(0, 3);
+                                                        if (value.length > 3) formattedValue += ') ' + value.substring(3, 6);
+                                                        if (value.length > 6) formattedValue += ' ' + value.substring(6, 8);
+                                                        if (value.length > 8) formattedValue += ' ' + value.substring(8, 10);
+
+                                                        e.target.value = formattedValue;
+                                                        return e;
+                                                    }
+                                                })}
+                                            />
+                                        </div>
+                                        {form.formState.errors.phone && <p className="text-xs text-red-500">{form.formState.errors.phone.message}</p>}
+                                    </div>
+                                </div>
+                                <div className="space-y-2">
+                                    <label htmlFor="subject" className="text-sm font-medium">Konu</label>
+                                    <Input id="subject" {...form.register("subject")} placeholder="Konu" />
+                                    {form.formState.errors.subject && <p className="text-xs text-red-500">{form.formState.errors.subject.message}</p>}
+                                </div>
+                                <div className="space-y-2">
+                                    <label htmlFor="message" className="text-sm font-medium">Mesajınız</label>
+                                    <Textarea id="message" {...form.register("message")} placeholder="Size nasıl yardımcı olabiliriz?" className="min-h-[120px]" />
+                                    {form.formState.errors.message && <p className="text-xs text-red-500">{form.formState.errors.message.message}</p>}
+                                </div>
+                                <Button size="lg" className="w-full" disabled={isSubmitting}>
+                                    {isSubmitting && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
+                                    Mesaj Gönder
+                                </Button>
+                            </form>
+                        )}
+                    </CardContent>
+                </Card>
+            </div>
+        </div>
+    )
+}

app/(public)/corporate/page.tsx

@@ -0,0 +1,58 @@
+
+import Image from "next/image"
+
+export default function CorporatePage() {
+    return (
+        <div className="container py-12 md:py-24">
+            <div className="max-w-4xl mx-auto space-y-12">
+                <section className="space-y-6 text-center">
+                    <h1 className="text-4xl md:text-5xl font-bold tracking-tight font-outfit">Hakkımızda</h1>
+                    <p className="text-xl text-muted-foreground">
+                        1995'ten beri güvenliğinizi en değerli hazinemiz olarak görüyoruz.
+                    </p>
+                </section>
+
+                <section className="grid md:grid-cols-2 gap-12 items-center">
+                    <div className="aspect-square relative bg-slate-200 rounded-lg overflow-hidden">
+                        {/* Placeholder Image */}
+                        <div className="absolute inset-0 flex items-center justify-center text-muted-foreground">
+                            Şirket Görseli
+                        </div>
+                    </div>
+                    <div className="space-y-6">
+                        <h2 className="text-3xl font-bold">Misyonumuz</h2>
+                        <p className="text-slate-600 dark:text-slate-300 leading-relaxed">
+                            ParaKasa olarak misyonumuz, müşterilerimizin maddi ve manevi değerlerini korumak için
+                            dünya standartlarında güvenlik çözümleri sunmaktır. Teknolojiyi zanaatkarlıkla birleştirerek,
+                            sadece bir metal kutu değil, huzur ve güven üretiyoruz.
+                        </p>
+                        <h2 className="text-3xl font-bold pt-4">Vizyonumuz</h2>
+                        <p className="text-slate-600 dark:text-slate-300 leading-relaxed">
+                            Türkiye'nin lider çelik kasa üreticisi olarak, global pazarda güvenilirlik ve kalite
+                            denince akla gelen ilk marka olmak. Yenilikçi Ar-Ge çalışmalarımızla güvenlik teknolojilerine
+                            yön vermek.
+                        </p>
+                    </div>
+                </section>
+
+                <section className="bg-slate-50 dark:bg-slate-900 p-8 rounded-2xl text-center space-y-4">
+                    <h3 className="text-2xl font-bold">Neden ParaKasa?</h3>
+                    <div className="grid sm:grid-cols-3 gap-6 pt-6">
+                        <div className="p-4">
+                            <div className="text-4xl font-bold text-primary mb-2">25+</div>
+                            <div className="text-sm font-medium">Yıllık Tecrübe</div>
+                        </div>
+                        <div className="p-4">
+                            <div className="text-4xl font-bold text-primary mb-2">10K+</div>
+                            <div className="text-sm font-medium">Mutlu Müşteri</div>
+                        </div>
+                        <div className="p-4">
+                            <div className="text-4xl font-bold text-primary mb-2">%100</div>
+                            <div className="text-sm font-medium">Yerli Üretim</div>
+                        </div>
+                    </div>
+                </section>
+            </div>
+        </div>
+    )
+}

app/(public)/layout.tsx

@@ -0,0 +1,20 @@
+
+import { Navbar } from "@/components/layout/navbar";
+import { Footer } from "@/components/layout/footer";
+
+export default function PublicLayout({
+    children,
+}: Readonly<{
+    children: React.ReactNode;
+}>) {
+    return (
+        <div className="flex flex-col min-h-screen">
+            <div className="bg-yellow-400 text-yellow-900 text-center py-2 px-4 text-sm font-bold">
+                ⚠️ SİTE YAPIM AŞAMASINDADIR
+            </div>
+            <Navbar />
+            <main className="flex-1">{children}</main>
+            <Footer />
+        </div>
+    );
+}

app/(public)/login/page.tsx

@@ -88,10 +88,6 @@ export default function LoginPage() {
                 </CardContent>
                 <CardFooter className="flex flex-col gap-4 text-center text-sm text-muted-foreground">
                     <div className="text-center">
-                        Hesabınız yok mu?{" "}
-                        <Link href="/signup" className="underline underline-offset-4 hover:text-primary">
-                            Kayıt Ol
-                        </Link>
                     </div>
                     <Link href="/" className="underline underline-offset-4 hover:text-primary">
                         Ana Sayfaya Dön

app/(public)/page.tsx

@@ -1,10 +1,14 @@
 import Link from "next/link"
 import Image from "next/image"
-import { ArrowRight, ShieldCheck, Lock, Award, History } from "lucide-react"
+import { ArrowRight, ShieldCheck, Lock, Award, History, LayoutDashboard, LogIn } from "lucide-react"
 import { Button } from "@/components/ui/button"
 import { Card, CardContent } from "@/components/ui/card"
+import { createClient } from "@/lib/supabase-server"
+
+export default async function Home() {
+  const supabase = createClient()
+  const { data: { user } } = await supabase.auth.getUser()
 
-export default function Home() {
   return (
     <div className="flex flex-col min-h-screen">
       {/* Hero Section */}
@@ -33,9 +37,14 @@ export default function Home() {
               <Button size="lg" className="bg-slate-100 text-slate-900 hover:bg-slate-200 font-semibold text-lg px-8">
                 <Link href="/products">Koleksiyonu İncele</Link>
               </Button>
-              <Button size="lg" variant="outline" className="border-slate-400 text-slate-100 hover:bg-slate-800 hover:text-white font-semibold text-lg px-8">
-                <Link href="/contact">Teklif Al</Link>
-              </Button>
+              {user && (
+                <Button size="lg" variant="outline" className="border-slate-400 text-slate-100 hover:bg-slate-800 hover:text-white font-semibold text-lg px-8">
+                  <Link href="/dashboard" className="flex items-center">
+                    <LayoutDashboard className="mr-2 h-5 w-5" />
+                    Panele Git
+                  </Link>
+                </Button>
+              )}
             </div>
           </div>
         </div>

app/(public)/products/page.tsx

@@ -0,0 +1,80 @@
+
+import { Card, CardContent, CardFooter, CardHeader, CardTitle } from "@/components/ui/card"
+import { Button } from "@/components/ui/button"
+import Image from "next/image"
+
+const products = [
+    {
+        id: 1,
+        name: "Ev Tipi Çelik Kasa",
+        image: "/images/safe-1.jpg",
+        category: "Ev",
+    },
+    {
+        id: 2,
+        name: "Ofis Tipi Yanmaz Kasa",
+        image: "/images/safe-2.jpg",
+        category: "Ofis",
+    },
+    {
+        id: 3,
+        name: "Otel Odası Kasası",
+        image: "/images/safe-3.jpg",
+        category: "Otel",
+    },
+    {
+        id: 4,
+        name: "Silah Kasası (Tüfek)",
+        image: "/images/safe-4.jpg",
+        category: "Özel",
+    },
+    {
+        id: 5,
+        name: "Kuyumcu Kasası",
+        image: "/images/safe-5.jpg",
+        category: "Ticari",
+    },
+    {
+        id: 6,
+        name: "Duvar İçi Gizli Kasa",
+        image: "/images/safe-6.jpg",
+        category: "Ev",
+    },
+]
+
+export default function ProductsPage() {
+    return (
+        <div className="container py-12 md:py-24">
+            <div className="flex flex-col items-center mb-12 text-center">
+                <h1 className="text-4xl font-bold tracking-tight mb-4 font-outfit">Ürün Koleksiyonumuz</h1>
+                <p className="text-muted-foreground max-w-2xl">
+                    Güvenliğiniz için en son teknoloji ile üretilmiş, sertifikalı çelik kasa çözümlerimizi inceleyin.
+                </p>
+            </div>
+
+            <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6">
+                {products.map((product) => (
+                    <Card key={product.id} className="overflow-hidden border-0 shadow-md hover:shadow-xl transition-all duration-300">
+                        <div className="aspect-[4/5] relative bg-slate-100 dark:bg-slate-800">
+                            {/* Placeholder for real images */}
+                            <div className="absolute inset-0 flex items-center justify-center text-slate-400">
+                                <span className="text-sm">Görsel: {product.name}</span>
+                            </div>
+                        </div>
+                        <CardHeader className="p-4">
+                            <div className="flex justify-between items-start">
+                                <div>
+                                    <span className="text-xs font-medium text-slate-500 uppercase tracking-wider">{product.category}</span>
+                                    <CardTitle className="text-lg mt-1">{product.name}</CardTitle>
+                                </div>
+                            </div>
+                        </CardHeader>
+                        <CardFooter className="p-4 pt-0">
+                            <Button className="w-full">Detayları İncele</Button>
+                        </CardFooter>
+                    </Card>
+                ))}
+            </div>
+        </div>
+    )
+}

app/layout.tsx

@@ -1,11 +1,8 @@
 import type { Metadata } from "next";
 import { Inter, Outfit } from "next/font/google";
-import { Navbar } from "@/components/layout/navbar";
-import { Footer } from "@/components/layout/footer";
+import { Toaster } from "sonner";
 import "./globals.css";
 
-
-
 const inter = Inter({ subsets: ["latin"] });
 const outfit = Outfit({ subsets: ["latin"], variable: "--font-outfit" });
 
@@ -24,9 +21,8 @@ export default function RootLayout({
       <body
         className={`${inter.className} ${outfit.variable} antialiased min-h-screen flex flex-col`}
       >
-        <Navbar />
-        <main className="flex-1">{children}</main>
-        <Footer />
+        {children}
+        <Toaster />
       </body>
     </html>
   );