Web Tasarlamaya Yeni Başlayanlar İçin Gerçek Rehber

“HTML mi öğreneyim, JavaScript mi? React ne, Next.js ne işe yarıyor? Django mu ASP.NET mi?”

Şimdi dürüst olalım.
Web’e yeni başlayan herkesin kafası aynı noktada yanıyor:

“Her yerde başka bir şey söylüyorlar…
Hangisiyle başlamalıyım?
Yanlış bir şey öğrenip zaman kaybetmek istemiyorum.”

Bu yazıyı tam olarak bu kafa karışıklığını bitirmek için yazıyorum.
şimdi sakin ol ve çayını al gel.

Önce büyük resmi görelim (en önemli kısım)

Bir web sitesi ya da web uygulaması aslında 3 ana parçadan oluşur:

1. Görünen kısım (Frontend)
   Kullanıcının gördüğü ekranlar, butonlar, yazılar

2. Arka plan (Backend)
   Giriş işlemleri, kurallar, hesaplamalar

3. Veri (Database)
   Kullanıcılar, yazılar, ürünler, kayıtlar

Bu yazıda her şeyi bu 3 parçaya bağlayarak anlatacağım.
Parça parça değil, bütün olarak.

1️⃣ Frontend’e giriş: HTML, CSS, JavaScript (olmazsa olmazlar)

HTML nedir? (en sade haliyle)

HTML, sayfanın iskeletidir.
Başlık nerede, paragraf nerede, buton nerede… bunu söyler.

Ev düşün:
HTML = kolonlar, duvarlar

CSS nedir?

CSS, sitenin görünümüdür.
Renkler, yazı tipi, düzen, mobil uyum.

Ev düşün:
CSS = boya, koltuk, perde

JavaScript nedir?

JavaScript, siteye can verir.

• Butona tıklayınca bir şey olsun

• Form gönderilsin

• Veri gelsin

Ev düşün:
JavaScript = elektrik, kapı zili, klima

⚠️ Net gerçek:
React, Next.js, Vue gibi her şey JavaScript’in üstüne kuruludur.
Bu üçlü zayıfsa, ileri seviye araçlar sana eziyet olur.

2️⃣ “Ben HTML, CSS, JS öğrendim… şimdi ne olacak?”

İşte burada framework’ler devreye giriyor.

React nedir?

React, ekranları parça parça (component) yapmanı sağlar.

• Header ayrı

• Kart ayrı

• Buton ayrı

Bu sayede:

• Kod okunur olur

• Büyüyen projede dağılmaz

Peki neden herkes React konuşuyor?

Çünkü:

• İş ilanı çok

• Ekosistem çok büyük

• Öğreneni çok

Ama şunu unutma:
React = sadece ekran tarafı.
Tek başına “tam web uygulaması” değildir.

3️⃣ Next.js ne peki? React yetmiyor mu?

Yetiyor… ama her şeye.

Next.js, React’in üstüne şunları ekler:

• Sayfa sistemi (routing)

• Google uyumu (SEO)

• Hızlı açılma

• Gerekirse backend

React = araba
Next.js = araba + navigasyon + güvenlik + servis

Ne zaman React?

• Panel

• Dashboard

• İç sistem

Ne zaman Next.js?

• Blog

• Tanıtım sitesi

• Google’da çıkması gereken projeler

Yeni başlayan biri için en mantıklı akış:

Önce React → sonra Next.js

4️⃣ “Tamam, ön yüzü anladım. Arka taraf ne olacak?”

İşte backend dünyası burada başlıyor.

Backend ne yapar?

• Kullanıcı girişi

• Yetkilendirme

• Veri kaydetme

• Kuralları uygulama

Frontend “ister”, backend “karar verir”.

5️⃣ Django mu, ASP.NET mi? (kafa karıştıran soru)

Bunu basitçe anlatayım.

Django (Python)

Artıları

• Hızlı sonuç

• Admin panel hazır

• Yeni başlayan dostu

Eksileri

• Büyük projede dikkatli olunmazsa karmaşıklaşır

ASP.NET Core (C#)

Artıları

• Çok sağlam mimari

• Kurumsal dünya standardı

• Uzun vadede güçlü

Eksileri

• Başlangıçta biraz daha ağır

🧭 Hangisini seçmelisin?

• “Hızlı öğreneyim, proje çıkarayım” → Django

• “Uzun vadede sağlam ilerleyeyim” → ASP.NET

İkisi de yanlış değil. Yanlış olan hedefini bilmeden seçmek.

6️⃣ Veritabanı (Database) meselesi – korkma

Database = bilgilerin saklandığı yer.

Yeni başlayan için net öneri:

• PostgreSQL

Neden?

• Güçlü

• Yaygın

• Her yerde kullanılıyor

Alternatifler:

• SQLite → küçük projeler

• MySQL → yaygın ama sınırlı

• MongoDB → esnek ama yeni başlayan için riskli

7️⃣ Frontend – Backend – Database nasıl konuşur?

Akış şu şekilde:

1. Kullanıcı butona basar

2. Frontend, backend’e istek atar

3. Backend database’e bakar

4. Cevap döner

5. Ekran güncellenir

Bu iletişime REST API denir.
Korkulacak bir şey değil, sadece düzenli konuşma şekli.

8️⃣ Domain, siteyi yayınlama (deploy) – gözünde büyütme

Yeni başlayan için en kolay yol:

• Frontend:

  • Next.js → Vercel

  • React → Netlify

• Backend:

  • Render

• Database:

  • Supabase

Domain al → bağla → bitti.
Artık bu işler eskisi kadar zor değil.

9️⃣ “Ben şimdi ne yapayım?” – net yol haritası

Hiç dolandırmadan söylüyorum:

🔹 1. Ay

• HTML

• CSS

• JavaScript

• Basit site yap

🔹 2. Ay

• React

• Component mantığı

• Küçük uygulama

🔹 3. Ay

• Next.js

• Backend seç (Django / ASP.NET)

• Database bağla

• Siteyi yayınla

🎯 Amaç:
3 ay sonunda internette açık, çalışan bir projen olsun.

Son söz

Web geliştirme zor değil.
Zor olan şey:

• Herkesin başka bir şey söylemesi

• Gereksiz karmaşa

• “Şunu da öğrenmelisin” baskısı

Şunu unutma:

Bir şeyi bitirmek,
on şeyi yarım öğrenmekten daha değerlidir.

Bu rehberi okuyan biri eğer:

• “Artık ne yapacağımı biliyorum” diyorsa

• “Gözümde büyümüyor” diyorsa

amacına ulaştı demektir.