dec5
Dökümanlar
← Tüm dökümanlar

Cloudflare · Hosting · Web

Siteni Cloudflare'de ücretsiz yayına al

HTML, CSS ve JS'ten oluşan bir siteyi Cloudflare'de ayda 0 TL'ye yayınla. Panelden sürükle-bırak ya da tek komutla, kendi alan adını bağlama ve karşılaştığım hatalar.

Süre
10 dk
Seviye
Başlangıç
Adım
5
Prompt
2
PDF indir ↓

Videodaki teknoloji inceleme sitesi şu an incele-demo.dec5.workers.dev adresinde yayında ve hosting için tek kuruş ödemiyorum. Aşağıda aynısını kendi sitende nasıl yapacağını adım adım anlattım. Komutların ve promptların sağ üstündeki Kopyala butonuna bas, yapıştır, devam et.

Ne yapacağız

Cloudflare, internetin arka planında çalışan bir altyapı şirketi. Dünyanın 300'den fazla şehrinde sunucusu var. Siteni oraya koyduğunda bir kopyası bu şehirlerin hepsine dağılıyor; ziyaretçi siteyi kendine en yakın yerden açıyor.

Neden ücretsiz? Ağı zaten kurulu olduğu için küçük bir siteyi taşımak ona neredeyse bedava. Bugün ücretsiz kullanan geliştiricinin yarın şirketine ücretli planı aldırmasını umuyor.

Sonuçta elinde üç şey olacak:

  1. İnternette yayında, .workers.dev uzantılı ücretsiz bir adres
  2. Siteyi her güncellediğinde tekrar yayınlama yöntemi
  3. İstersen kendi alan adın

  1. Siteni tek klasöre topla

    Cloudflare'e bir klasör yükleyeceksin. Klasörün kökünde index.html olmalı. Benim klasörüm şöyle:

    text
    teknoloji-inceleme-demo/
├── index.html
├── styles.css
├── app.js
└── img/

    Siten bir framework ile yapıldıysa (React, Vite, Next.js) önce build alıp çıkan klasörü kullan. Emin değilsen Claude Code'a sor:

    Prompt
    Bu projeyi Cloudflare'e statik site olarak yükleyeceğim.

1. Proje statik mi, yoksa sunucuda çalışan bir parçası var mı? Söyle.
2. Statikse build al ve yüklenecek klasörün adını söyle (dist, out, build gibi).
3. Klasörün kökünde index.html olduğunu ve görsel yollarının göreli olduğunu kontrol et.

Henüz hiçbir yere yükleme yapma.

  2. Panelden yükle (en kolay yol)

    1. Cloudflare paneline gir.
    2. Sol menüden Workers & Pages bölümüne gir ve yeni bir uygulama oluştur.
    3. Dosya yükleme seçeneğini seç (panelde "Upload" ya da "Drag and drop" olarak geçiyor).
    4. Projeye bir ad ver. Adresin bu addan oluşacak.
    5. Klasörünü sürükle, bırak ve Deploy'a bas.

    Bir dakika içinde site proje-adi.hesap-adi.workers.dev adresinde yayında olur. Cloudflare panelinin buton adları zaman zaman değişiyor; yukarıdakiyle birebir aynı değilse aynı mantıkla ilerle: Workers & Pages → oluştur → dosya yükle.

  3. Ya da tek komutla yükle

    Komut satırı her güncellemede daha hızlı. Cloudflare'in aracı Wrangler'ı kurmadan npx ile kullanabilirsin.

    Önce hesabına bağlan. Tarayıcı açılacak, giriş yapıp Allow'a bas:

    Terminal
    npx wrangler@latest login

    Sonra site klasörünün içine gir ve yükle:

    Terminal
    cd teknoloji-inceleme-demo
npx wrangler@latest deploy --assets . --name incele-demo --compatibility-date 2026-10-01

    --name senin proje adın, adres bundan oluşuyor. Komut sonunda canlı adresi yazıyor.

    İstersen bu işi Claude Code'a da yaptırabilirsin:

    Prompt
    <KLASÖR YOLU> klasöründeki statik siteyi Cloudflare'e yükle.

- Önce `npx wrangler@latest whoami` ile giriş yapılmış mı kontrol et. Yapılmamışsa dur ve bana `npx wrangler@latest login` çalıştırmamı söyle.
- Komutu MUTLAKA o klasörün içinden çalıştır: npx wrangler@latest deploy --assets . --name <PROJE ADI> --compatibility-date 2026-10-01
- Birden fazla Cloudflare hesabı görünürse hangisini kullanacağını bana sor.
- Yükleme bitince canlı adresi aç, sayfa, CSS, JS ve görsellerin 200 döndüğünü kontrol et.

  4. Kendi alan adını bağla (isteğe bağlı)

    .workers.dev adresi ücretsiz ve kalıcı. Kendi adını istersen:

    1. Alan adını al. Cloudflare panelindeki Domain Registration bölümünden maliyet fiyatına alabilirsin (.com için yılda ~10 $), ya da başka bir yerden alıp Cloudflare'e taşırsın.
    2. Workers & Pages'te projeni aç, Settings → Domains & Routes bölümünden Custom domain ekle.
    3. Alan adını yaz ve kaydet. HTTPS sertifikasını Cloudflare kendisi kuruyor.

    Alan adı ücretli, hosting yine ücretsiz.

  5. Siteyi güncelle

    Bir şeyi değiştirdin mi? Panelden yüklediysen aynı projeye yeni bir sürüm yükle. Komutla yüklediysen aynı komutu tekrar çalıştır:

    Terminal
    npx wrangler@latest deploy --assets . --name incele-demo --compatibility-date 2026-10-01

    Sadece değişen dosyalar yükleniyor, eski sürüme panelden tek tıkla dönebiliyorsun.

Püf noktaları

Komutu yanlış klasörde çalıştırdım. Wrangler'ı başka bir projenin klasöründe çalıştırınca o projeyi bulup onu yüklemeye çalıştı, üstüne projenin dosyalarını Cloudflare'e uyacak şekilde değiştirdi. Yükleme başarısız olduğu için zarar olmadı ama değişiklikleri elle geri almam gerekti. Komutu hep site klasörünün içinden çalıştır, önce ls ile index.html'i gör.

Adres hemen açılmadı. Yeni bir workers.dev adresinin her yerde çalışması bir iki dakika sürebiliyor. Bekle, sonra tekrar dene.

Sayfa açılıyor ama görseller yok. Görsel yolları /Users/... gibi bilgisayarına ait tam yollar olabilir. Hepsi img/foto.jpg gibi göreli olmalı.

Adres .pages.dev değil .workers.dev çıktı. Cloudflare, Pages'i Workers'ın içine taşıdı. Yeni projeler workers.dev adresi alıyor; ikisi de ücretsiz.

Birden fazla hesap göründü. Wrangler erişimin olan bütün hesapları listeliyor. Doğru hesabı CLOUDFLARE_ACCOUNT_ID=<hesap id> ile komutun başına yazarak seç.

Bitti mi?

  • Site tek klasörde, kökte index.html var
  • Cloudflare hesabı açtım
  • Panelden ya da komutla yükledim, .workers.dev adresi açılıyor
  • Görseller ve stiller canlı adreste de yükleniyor
  • (İsteğe bağlı) Kendi alan adımı bağladım

Takıldığın yeri Instagram'da yaz, rehbere eklerim.