Next.js 15 Sıfırdan Başlangıç

Ders 8/8 20 dakika

Vercel'e Ücretsiz Deployment

Next.js projenizi GitHub'a push ederek Vercel'e ücretsiz deploy edin. Özel domain bağlama ve environment variables ayarlama.

Vercel Nedir?

Vercel, Next.js\'i geliştiren şirket ve aynı zamanda en iyi Next.js hosting platformudur. Ücretsiz plan ile şunları alırsınız:

  • Sınırsız kişisel proje
  • 100GB bant genişliği/ay
  • Otomatik HTTPS
  • Global CDN
  • GitHub entegrasyonu (her push\'ta otomatik deploy)

Adım 1: Projeyi GitHub\'a Yükleyin

git init
git add .
git commit -m "İlk commit"
git branch -M main
git remote add origin https://github.com/kullanici/projem.git
git push -u origin main

Adım 2: Vercel\'e Bağlayın

  1. vercel.com adresine gidin ve GitHub ile giriş yapın
  2. "New Project" butonuna tıklayın
  3. GitHub repo\'nuzu seçin
  4. "Deploy" butonuna tıklayın

Birkaç dakika içinde projeniz yayında olacak! 🎉

Environment Variables

# .env.local (asla git\'e eklemeyin!)
DATABASE_URL="postgresql://..."
NEXTAUTH_SECRET="gizli-anahtar"
STRIPE_SECRET_KEY="sk_live_..."
NEXT_PUBLIC_API_URL="https://api.sitem.com"
💡 NEXT_PUBLIC_ öneki: Tarayıcıda da kullanılabilmesi gereken değişkenlere NEXT_PUBLIC_ öneki ekleyin. Diğerleri yalnızca sunucuda erişilebilir.

Otomatik Preview Deployments

Her GitHub pull request için Vercel otomatik olarak bir preview URL oluşturur. Değişikliklerinizi production\'a almadan önce test edebilirsiniz.

Özel Domain

  1. Vercel dashboard → projeniz → Settings → Domains
  2. Alan adınızı ekleyin (örn: benim-sitem.com)
  3. DNS sağlayıcınızda Vercel\'in gösterdiği CNAME kaydını ekleyin

Önemli Noktalar

  • Vercel ücretsiz planı kişisel projeler için yeterlidir
  • GitHub'a push ettiğinizde Vercel otomatik deploy yapar
  • NEXT_PUBLIC_ öneki olan env değişkenleri tarayıcıda da erişilebilir
  • Her PR için otomatik preview URL oluşturulur