Yükleniyor...

JavaScript’e giriş

HTML sayfaya iskelet verir, CSS görünüm. Vitrin hazır olsa bile bir şey olana kadar sessiz kalır: tıklama, yazılan bir değer, yüklemeden sonra çıkan bir ileti. JavaScript, bunları tarayıcıda yapan dildir.

JavaScript nedir?

JavaScript bir programlama dilidir. Yönergeler yazarsınız; tarayıcı bunları teker teker yürütür. İşaretleme değildir (o HTML’dir) ve stil sayfası da değildir (o CSS’tir). Web’de günlük işi davranıştır: metni güncellemek, kullanıcıya tepki vermek, bir değer hesaplamak ve bu kursta ileride — sunucudan veri almak.

Belge değil, çalışan bir dil

HTML etiketleri içerik parçalarını adlandırır. CSS kuralları nasıl göründüklerini anlatır. JavaScript deyimleri bilgisayara bir şey yap der: ileti yaz, sayfadaki bir düğümü değiştir veya iki sayıyı topla. Betiği sayfaya bağlayacak kadar HTML’iniz var. Bu kurs o betiğin içindeki dili öğretir.

📊 Durağan sayfa ve JavaScript’li sayfa

Durum JavaScript olmadan Kısa bir betikle
Sayfa yeni yüklendi Başlık HTML’de yazıldığı gibi kalır Betik yüklemeden sonra o başlığı yeniden yazabilir
Ziyaretçi bir düğmeye tıklar Düğme tek başına işe yarar tepki vermez Sonraki dersler: tıklamada kod çalışır
Toplam veya bir kontrol gerekir HTML hesaplamaz; CSS karar vermez JavaScript hesaplar, sonra sonucu gösterir

Üç katmanı zihinde ayrı tutun. Yapı HTML’dedir. Görünüm CSS’tedir. Bu kurs üçüncü katmandır: sayfa ne yapar.

İlk deyime bakış

Deyim tek bir yönergedir. Aşağıdaki örnek geliştirici konsoluna bir satır yazar — programcının aracı, görünen sayfa değil. Öğrenirken konsolu sık kullanacaksınız.

İlk deyim

javascript 
console.log("Hello, JavaScript");

Bu deyim ne yapar

  • console.log konsola basan yerleşik bir işlevdir
  • Tırnak içindeki metin bir dizgedir — yani metin verisi
  • Noktalı virgül deyimi bitirir (bu kursta güvenli alışkanlık)
  • Sayfada henüz bir şey değişmez; bu yalnızca bir kayıttır
    Geliştirici araçlarını açın (çoğu zaman F12) ve betik çalıştıktan sonra Console sekmesine bakın.

Sayfada JavaScript görmek

Ziyaretçinin gördüğünü değiştirmek için betik sayfayla konuşur. Aşağıda HTML paragrafı bir cümleyle başlar. Gömülü <script> onu id ile bulur ve metni değiştirir. Betiklerin yeri sonraki oturumda; burada bir dosya yeter.

Gömülü betikli HTML

html 
<!DOCTYPE html>
<html>
<head>
<title>JavaScript Demo</title>
</head>
<body>
<h1>Welcome</h1>
<p id="msg">This line is from HTML only.</p>
<script>
document.getElementById("msg").textContent =
"JavaScript rewrote this sentence.";
</script>
</body>
</html>

Ne değişti

Betik yoksa özgün paragraf kalır. Betikle tarayıcı önce HTML’i okur, sonra deyimleri yürütür, sonra yeni cümleyi gösterir. İskelet aynı — yüklemeden sonraki davranış farklı.

JavaScript hesap da yapar

Programlama dili olduğu için sayılar ve adlarla çalışır, yalnızca etiketlerle değil. Bu küçük örneğin renk veya başlıkla ilgisi yoktur. Bir toplam hesaplar ve kaydeder. Değişkenler ve türler sonra gelir; burada kodun hesaplayabildiğini görün.

Küçük bir hesap

javascript 
const price = 120000;
const taxRate = 0.09;
console.log(price + price * taxRate);

Bu kurs nedir (ve ne değildir)

Tarayıcıda kalıyoruz: dil temelleri, DOM, olaylar, formlar ve fetch. Çerçeve, Node.js veya TypeScript ile başlamıyoruz. Bunlar olmadan da sayfa için yararlı betikler yazarsınız. İsteğe bağlı oturumlar ekstra; ana yol için zorunlu değildir.

Kendiniz deneyin

  1. intro.html adında bir dosya oluşturun.
  2. Betikli HTML örneğini yapıştırın, kaydedin ve tarayıcıda açın.
  3. Paragrafın özgün HTML metnini değil, yeniden yazılmış cümleyi gösterdiğini doğrulayın.
  4. textContent içindeki dizgeyi kendi cümlenizle değiştirin, kaydedin ve yenileyin.
  5. İsteğe bağlı: aynı <script> içine console.log("Hello, JavaScript"); ekleyin, kaydedip yenileyin ve Console sekmesinde satırı bulun.

Sık yapılan hatalar

  • JavaScript’i başlık ve paragraf yazmanın başka bir yolu sanmak — yapıyı HTML’de bırakın; JS gerektiğinde değiştirsin veya eklesin
  • CSS’in tıklamaya tepki vermesini veya toplam hesaplamasını beklemek — CSS biçimlendirir; program mantığı yürütmez
  • Önemli metnin tek kopyasını yalnızca betikte tutmak, JS yoksa sayfa boş kalsın
  • Konsolu görünen sayfayla karıştırmak: console.log ekrandaki başlığı değiştirmez

Özet

  • JavaScript, tarayıcıda sayfalara davranış katan bir programlama dilidir
  • HTML içeriği yapılandırır; CSS sunumu yönetir; JavaScript sayfanın ne yaptığını kararlaştırır
  • Deyim tek bir yönergedir, örneğin console.log("Hello, JavaScript");
  • Gömülü bir betik öğeyi bulup yüklemeden sonra textContent değerini değiştirebilir
  • JavaScript değer de hesaplar, yalnızca işaretlemeye dokunmaz
  • Bu kurs tarayıcıda kalır ve çerçeve gerektirmez
  • Küçük bir betiği düzenleyip tarayıcıyı yenileyerek pratik yapın

🧠 Bilginizi Test Edin

Başlamaya Hazır

Bilginizi Test Edin

Bu interaktif sınavla kendini test et ve konuyu ne kadar iyi anladığını gör

❓
7
Sorular
🎯
70%
Geçmek İçin
♾️
∞
Süre
🔄
∞
Deneme

📝 Talimatlar

  • Her soruyu dikkatle okuyun
  • Her soru için en iyi cevabı seçin
  • Quiz'i istediğiniz kadar tekrar alabilirsiniz
  • İlerlemeniz üstte gösterilecek
Konu 1 / 31
Javascript Ders