Kişisel sitemi Nuxt 4 ve Firebase ile nasıl yeniden inşa ettim

Eski sitem tek bir statik HTML dosyasıydı. Nuxt 4, Tailwind CSS, Firebase Hosting ve 10 dili kapsayan tamamen özel çok dilli bir sistemle nasıl ve neden yeniden inşa ettiğimi anlıyorum.

Eski site

Uzun süre boyunca kişisel sitem tek bir `index.html` dosyasıydı. Minimal ve hızlı — ama ölçeklenemez. Tam bir yeniden inşa yapmaya karar verdim.

Neden Nuxt 4

Statik oluşturma — `nuxt generate`, Firebase Hosting ile uyumlu tamamen statik çıktı üretir
Dosya tabanlı yönlendirme — `/news/[slug]` altındaki makale sayfaları yapılandırma gerektirmeden çalışır
TypeScript-öncelikli — Tüm kod tabanı tiplenmiş
SSR + hidrasyon — SEO için ideal

Stack

Nuxt 4 — `app/` dizin yapısı, statik oluşturma ile SSR
Tailwind CSS — Utility-first stil
Firebase Hosting — Global CDN, kolay deploy
Özel i18n — `vue-i18n` kullanan el yapımı composable
Nitro sunucu rotaları — Yerel JSON dosyaları olarak makaleler

Çok dilli sistem

Site 10 dili destekliyor. `@nuxtjs/i18n`'den kaçınarak `locale` çerezini okuyan bir `useI18n()` composable yazdım.

Yerel JSON olarak makaleler

Her makale, `translations` nesnesi olan bir JSON dosyasıdır — her locale için `title`, `summary` ve Markdown'da `body` içeren bir giriş.

SEO ve ön işleme

Bir `nitro:config` hook'u, Vite build'inden önce `content/articles/` dizinini okur ve her `/news/[slug]` rotasını ön işleme listesine ekler.

Sonraki adımlar

Site artık uygun yönlendirmeye, bir haber akışına ve tam çok dilli desteğe sahip.