73 lines
2.9 KiB
TypeScript
73 lines
2.9 KiB
TypeScript
'use client'
|
|
|
|
import { useState, useEffect } from 'react'
|
|
|
|
export default function Home() {
|
|
const [apiData, setApiData] = useState<any>(null)
|
|
|
|
useEffect(() => {
|
|
// Call Go API
|
|
fetch('/api/health')
|
|
.then(res => res.json())
|
|
.then(data => setApiData(data))
|
|
.catch(err => console.error(err))
|
|
}, [])
|
|
|
|
return (
|
|
<main className="min-h-screen bg-gradient-to-br from-gray-50 via-blue-50 to-indigo-50 flex items-center justify-center p-6">
|
|
<div className="max-w-2xl w-full">
|
|
<div className="text-center mb-8">
|
|
<div className="inline-flex items-center justify-center w-20 h-20 bg-gradient-to-br from-blue-500 to-indigo-600 rounded-3xl shadow-lg mb-6">
|
|
<span className="text-5xl">🐱</span>
|
|
</div>
|
|
<h1 className="text-5xl font-bold text-gray-900 mb-4">
|
|
NekoFlow
|
|
</h1>
|
|
<p className="text-xl text-gray-600 mb-8">
|
|
Go + Next.js Single Binary
|
|
</p>
|
|
</div>
|
|
|
|
<div className="bg-white rounded-3xl shadow-2xl p-8 space-y-6">
|
|
<div className="grid grid-cols-2 gap-4">
|
|
<div className="bg-gradient-to-br from-blue-50 to-indigo-50 rounded-xl p-6 border-2 border-blue-100">
|
|
<h3 className="text-lg font-bold text-gray-900 mb-2">Frontend</h3>
|
|
<p className="text-sm text-gray-600">Next.js 14 + React 18</p>
|
|
<p className="text-xs text-blue-600 mt-2">✅ Static Export</p>
|
|
</div>
|
|
|
|
<div className="bg-gradient-to-br from-green-50 to-emerald-50 rounded-xl p-6 border-2 border-green-100">
|
|
<h3 className="text-lg font-bold text-gray-900 mb-2">Backend</h3>
|
|
<p className="text-sm text-gray-600">Go 1.21+</p>
|
|
<p className="text-xs text-green-600 mt-2">✅ Embedded</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="bg-gradient-to-br from-purple-50 to-pink-50 rounded-xl p-6 border-2 border-purple-100">
|
|
<h3 className="text-lg font-bold text-gray-900 mb-3">API Status</h3>
|
|
{apiData ? (
|
|
<div className="space-y-2 text-sm">
|
|
<p>✅ Status: <span className="font-mono text-green-600">{apiData.status}</span></p>
|
|
<p>⏰ Time: <span className="font-mono text-gray-600">{apiData.timestamp}</span></p>
|
|
<p>🐹 Server: <span className="font-mono text-blue-600">{apiData.message}</span></p>
|
|
</div>
|
|
) : (
|
|
<p className="text-sm text-gray-500">Loading...</p>
|
|
)}
|
|
</div>
|
|
|
|
<div className="text-center pt-4">
|
|
<a
|
|
href="/setup"
|
|
className="inline-block px-8 py-3 bg-gradient-to-r from-blue-600 to-indigo-600 hover:from-blue-700 hover:to-indigo-700 text-white font-semibold rounded-xl shadow-lg transition-all"
|
|
>
|
|
Setup Wizard →
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
)
|
|
}
|
|
|