Atölye › Pong › 1/26. adım
İlk video oyunu hiti: iki raket ve bir top. Basılı tuşlar, sekme, açılar, skor ve basit bir bilgisayar rakip.
İlk video oyunu hitlerinden birini, Pong'u yazacağız: iki raket, bir top. Topu kaçıran sayı verir.
Oyundaki her şey sayfadaki bir canvas (tuval) üzerine çizilir: 600 piksel eninde, 400 piksel boyunda boş bir dikdörtgen. Resim yapmadan önce iki şey lazım: kâğıt ve kalem. Bu adımda ikisini de alıyoruz; ekranda henüz bir şey değişmeyecek.
```js
const canvas = document.getElementById('game')
const ctx = canvas.getContext('2d')
```document → sayfanın kendisi. Sayfadaki her şeye buradan ulaşırız..getElementById('game') → "kimliği (id) game olan öğeyi bul". Nokta (.) "bunun içindeki şu komut" demek;
parantez ( ) komuta bilgi verir. Tırnak içindeki 'game' bir yazıdır (metin).const canvas = → bulunan şeye canvas adını verir. Kutuya etiket yapıştırmak gibi: bundan sonra hep bu adla
çağırırız. const "bu ad hep aynı şeyi gösterecek" demek; = "sağdakini soldaki ada ver".canvas.getContext('2d') → canvas'tan 2 boyutlu çizim kalemini ister.const ctx = → kaleme ctx adını verir (context, yani bağlam kelimesinin kısaltması). Bütün çizim satırları
ctx. ile başlayacak: "kalemle şunu yap".Kodu, editördeki üç yorum satırının (// ile başlayanlar; bilgisayar onları okumaz, insanlar için not) altına
yaz. Kopyalama; kendin yaz, harf harf. Sonra Çalıştır'a bas (ya da Ctrl + Enter). Ekran değişmez, ama alttaki
kontroller yeşil olmalı.
Beceriler: Canvas üzerine çizim