Initial Burmddit deployment - AI news aggregator in Burmese

frontend/app/page.tsx

@@ -0,0 +1,124 @@
+import { sql } from '@vercel/postgres'
+import ArticleCard from '@/components/ArticleCard'
+import TrendingSection from '@/components/TrendingSection'
+import CategoryNav from '@/components/CategoryNav'
+
+async function getRecentArticles() {
+  try {
+    const { rows } = await sql`
+      SELECT * FROM published_articles
+      ORDER BY published_at DESC
+      LIMIT 20
+    `
+    return rows
+  } catch (error) {
+    console.error('Error fetching articles:', error)
+    return []
+  }
+}
+
+async function getTrendingArticles() {
+  try {
+    const { rows } = await sql`SELECT * FROM get_trending_articles(10)`
+    return rows
+  } catch (error) {
+    console.error('Error fetching trending:', error)
+    return []
+  }
+}
+
+export default async function Home() {
+  const [articles, trending] = await Promise.all([
+    getRecentArticles(),
+    getTrendingArticles()
+  ])
+
+  return (
+    <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
+      {/* Hero Section */}
+      <section className="mb-12 text-center">
+        <h1 className="text-5xl font-bold text-gray-900 mb-4 font-burmese">
+          Burmddit
+        </h1>
+        <p className="text-xl text-gray-600 font-burmese">
+          AI သတင်းများ၊ သင်ခန်းစာများနှင့် အကြံပြုချက်များ
+        </p>
+        <p className="text-lg text-gray-500 mt-2">
+          Daily AI News, Tutorials & Tips in Burmese
+        </p>
+      </section>
+
+      {/* Category Navigation */}
+      <CategoryNav />
+
+      {/* Main Content Grid */}
+      <div className="grid grid-cols-1 lg:grid-cols-3 gap-8 mt-8">
+        {/* Main Articles (Left 2/3) */}
+        <div className="lg:col-span-2">
+          <h2 className="text-2xl font-bold text-gray-900 mb-6 font-burmese">
+            နောက်ဆုံးရ သတင်းများ
+          </h2>
+          
+          {articles.length === 0 ? (
+            <div className="text-center py-12 bg-white rounded-lg shadow">
+              <p className="text-gray-500 font-burmese">
+                သတင်းမရှိသေးပါ။ မကြာမီ ထပ်စစ်ကြည့်ပါ။
+              </p>
+            </div>
+          ) : (
+            <div className="space-y-6">
+              {articles.map((article) => (
+                <ArticleCard key={article.id} article={article} />
+              ))}
+            </div>
+          )}
+        </div>
+
+        {/* Sidebar (Right 1/3) */}
+        <aside className="space-y-8">
+          {/* Trending Articles */}
+          <TrendingSection articles={trending} />
+
+          {/* Categories Card */}
+          <div className="bg-white rounded-lg shadow p-6">
+            <h3 className="text-lg font-bold text-gray-900 mb-4 font-burmese">
+              အမျိုးအစားများ
+            </h3>
+            <ul className="space-y-2">
+              <li>
+                <a href="/category/ai-news" className="text-primary-600 hover:text-primary-700 font-burmese">
+                  AI သတင်းများ
+                </a>
+              </li>
+              <li>
+                <a href="/category/tutorials" className="text-primary-600 hover:text-primary-700 font-burmese">
+                  သင်ခန်းစာများ
+                </a>
+              </li>
+              <li>
+                <a href="/category/tips-tricks" className="text-primary-600 hover:text-primary-700 font-burmese">
+                  အကြံပြုချက်များ
+                </a>
+              </li>
+              <li>
+                <a href="/category/upcoming" className="text-primary-600 hover:text-primary-700 font-burmese">
+                  လာမည့်အရာများ
+                </a>
+              </li>
+            </ul>
+          </div>
+
+          {/* About Card */}
+          <div className="bg-gradient-to-br from-primary-50 to-primary-100 rounded-lg shadow p-6">
+            <h3 className="text-lg font-bold text-gray-900 mb-3 font-burmese">
+              Burmddit အကြောင်း
+            </h3>
+            <p className="text-gray-700 text-sm leading-relaxed font-burmese">
+              Burmddit သည် AI နှင့် ပတ်သက်သော နောက်ဆုံးရ သတင်းများ၊ သင်ခန်းစာများနှင့် အကြံပြုချက်များကို မြန်မာဘာသာဖြင့် နေ့စဉ် ထုတ်ပြန်ပေးသော ပလက်ဖောင်း ဖြစ်ပါသည်။
+            </p>
+          </div>
+        </aside>
+      </div>
+    </div>
+  )
+}