Başlamadan önce: bilgisayar, program ve araçların

Bu derste henüz programlama öğrenmiyorsun, atölyeni kuruyorsun. Önce program, kod ve programlama dilinin ne olduğunu, bilgisayarın yazdığın kodu nasıl çalıştırdığını göreceksin. Sonra kullanacağın programları tanıyıp kuracak, terminalde ilk komutlarını yazacak ve dersin sonunda ilk programını çalıştıracaksın. Kurulum sıkıcı görünebilir, ama burada doğru yaptığın her ayar sonraki derslerde seni bir dertten kurtaracak.

#Program, kod ve programlama dili

İşlemci, bilgisayarın içindeki hesap yapan parçadır. Saniyede milyarlarca küçük iş yapar ama kendi başına hiçbir şey bilmez; neyi, hangi sırayla yapacağını birinin söylemesi gerekir. LoL'de Q'ya basınca çıkan yetenek de, köşedeki altın sayısı da yazılımcıların bilgisayara adım adım söylediği komutların sonucu.

Bu komutların sıralı listesine program denir; oyun, tarayıcı, Discord, hepsi birer program. Komutların yazılı hâli koddur: içi yazı dolu bir ya da birçok dosya. Kodu yazarken uyduğun kurallara (hangi sözcük ne demek, hangi işaret nereye konur) programlama dili denir. JavaScript, Python, C++ birer programlama dili; bu kursta JavaScript ile başlıyorsun.

#Bilgisayar yazdığın kodu nasıl anlar?

İşlemci JavaScript bilmez; yalnızca sıfır ve birlerden oluşan makine dilini anlar. Makine diliyle program yazmak çok zordur. Bu yüzden insanlar okunaklı dillerde yazar ve araya bir çevirmen koyar.

JavaScript'in çevirmeni Node.js'tir: kodunu yazdığın dosyayı okur, işlemcinin anlayacağı komutlara çevirir ve çalıştırır. Sonuç ekrana gelir. Dersin sonunda tam olarak bunu yapacaksın:

#Araç çantan: hangi program ne işe yarar?

Yazılımcının her gün kullandığı programlar az ama her birinin belli bir işi var. Önce haritaya bak, sonra her birini tanı.

#VS Code: yazı masan

Kod düz yazıdır; Not Defteri'nde bile yazılabilir. Ama yazılımcılar bunun için kod düzenleyici kullanır: kodu renklendirir, yazarken öneri verir, hataların altını çizer ve içinde bir terminal barındırır. Bu kursta Microsoft'un ücretsiz düzenleyicisi Visual Studio Code'u, kısaca VS Code'u kullanacaksın.

#Terminal ve PowerShell: bilgisayarla yazışmak

Bilgisayara genelde fareyle iş yaptırırsın. Terminal ise yazıyla komut verdiğin penceredir: komutu yazarsın, Enter'a basarsın, bilgisayar işi yapar ve sonucu alt satırlara yazar. Windows'ta bu komutları okuyan programın adı PowerShell'dir. Fareyle on tıklama süren bir iş terminalde tek satırdır; Node.js'i ve Git'i de buradan kullanacaksın.

Terminali açmak için Başlat düğmesine sağ tıkla (ya da Win+X'e bas) ve Terminal'i seç; listede yoksa Başlat menüsüne powershell yaz. Şuna benzer bir satır görürsün:

PS C:\Users\Deniz> 

Bu satıra istem (prompt) denir. PS PowerShell'de olduğunu, C:\Users\Deniz terminalin şu an hangi klasörde durduğunu söyler (Deniz yerine senin kullanıcı adın yazar). Komutlarını > işaretinden sonra yazarsın.

#Node.js: JavaScript motoru

Yukarıda anlatılan çevirmen budur. Terminale node dosya.js yazarak bir JavaScript dosyasını çalıştırırsın. Yanında npm adlı bir yardımcı gelir: başkalarının yazdığı hazır kod paketlerini indirir. npm'i Ders 14'te kullanacaksın; bu derste yalnızca kurulduğunu kontrol edeceksin.

#Git ve GitHub: kayıt noktası ve bulut

Git, klasöründeki dosyaların istediğin anlardaki hâlini saklayan bir sürüm kontrol (version control) aracıdır: bir şeyi bozduğunda eski hâle bakabilir, neyin değiştiğini görebilirsin. GitHub ise Git kayıtlarını internette saklayan bir sitedir. İşverenler bir yazılımcının GitHub sayfasına bakıp neler yaptığını görür; yani orası portföyün olacak.

Bu derste Git'i yalnızca kurup kendini tanıtacaksın. İlk kaydını Ders 1'in sonunda alacak, GitHub hesabını Ders 7'de açacaksın.

#Tarayıcı ve geliştirici araçları

Web sayfaları tarayıcıda (Edge, Chrome, Firefox, Brave) çalışır; tarayıcı onların sahnesidir. Her tarayıcının içinde bir JavaScript motoru vardır. F12'ye basınca geliştirici araçları (developer tools) açılır: sayfanın kodunu ve hatalarını gösteren bir bölme.

Şimdi dene: bir sayfada F12'ye bas, bölmeye göz at, yine F12 ile kapat. Edge ilk seferde onay isteyebilir; dizüstü bilgisayarda F12 için Fn tuşunu da basılı tutman gerekebilir. Bu araçları Blok 3'te her gün kullanacaksın.

#Kurulum

Üç program kuracaksın: VS Code, Node.js ve Git. Sıra önemli: önce VS Code, çünkü Git'in kurulumu VS Code'u bulup onu Git'in düzenleyicisi yapabiliyor. İki yoldan birini seç; ikisi de aynı sonuca götürür:

• Yol A, winget: Terminale üç komut yazarsın. Daha hızlı.
• Yol B, resmî siteler: Kurulum dosyalarını indirip tıklayarak kurarsın.

Kurulum sırasında Windows "Bu uygulamanın cihazınızda değişiklik yapmasına izin vermek istiyor musunuz?" diye sorabilir (İngilizcesi "Do you want to allow this app to make changes to your device?"). Pencerede yazan programın adını kontrol et ve Evet (Yes) de.

#Yol A: winget ile kurmak

winget, Windows 11'le gelen bir paket yöneticisi: programları adını yazarak indirip kuran araç, terminalden çalışan bir uygulama mağazası gibi. Önce var olduğunu kontrol et. Komutu elle yazabilir ya da kutunun sağ üstündeki Kopyala düğmesine basıp terminale Ctrl+V ile yapıştırabilirsin; sonra Enter'a bas:

PS C:\Users\Deniz> winget --versionv1.29.380

Sende sayı farklı olabilir. Kırmızı bir is not recognized mesajı görürsen bu bilgisayarda winget yoktur; Yol B'ye geç. Varsa üç komutu sırayla, birer birer çalıştır:

install "kur", --id "paketin kimliği şu", -e (exact) "kimlik harfi harfine eşleşsin" demek. İlk kullanımda winget, Microsoft Store kaynağının sözleşmesini onaylamanı isteyebilir: Do you agree to all the source agreements terms? sorusuna Y yazıp Enter'a bas.

Her komut önce indirir (bir ilerleme çubuğu görürsün), sonra kurar. winget bazen The installer will request to run as administrator. Expect a prompt. ("kurulum yönetici izni isteyecek, bir soru bekle") der; Windows'un sorusuna Evet de. Sonunda Successfully installed (başarıyla kuruldu) yazar. VS Code kurulunca kendiliğinden açılabilir; şimdilik kapat.

#Yol B: resmî sitelerden indirmek

#Git kurulumunda iki ekran

• Choosing the default editor used by Git: Listeden Use Visual Studio Code as Git's default editor'ı seç. Git bazen senden bir metin ister (örneğin bir kaydın açıklaması); o metni VS Code'da yazarsın. Varsayılan seçenek Vim'dir ve yeni başlayan için kafa karıştırıcıdır. VS Code kurulu değilse bu seçenekte Next düğmesi soluk kalır; VS Code'u önce kurmanın sebebi bu.
• Adjusting the name of the initial branch in new repositories: Let Git decide seçili kalsın; Ders 1'deki ekran çıktıları buna göre.

Öteki ekranlarda, örneğin Adjusting your PATH environment'ta, varsayılanlar doğru.

Yol A'yı seçtiysen bu ekranları görmezsin: winget Git'i varsayılan seçeneklerle kurar, düzenleyici de Vim olur. Bunu dersin sonunda, Git'e kendini tanıt bölümünde tek komutla VS Code yapacaksın.

#Kurulumdan sonra: terminali kapatıp yeniden aç

Kurulum bitince açık bütün terminalleri ve VS Code'u kapatıp yeniden aç. Bu adımı atlamak, kurulumdan sonraki en yaygın hatanın sebebidir.

Terminale node yazınca Windows bu programı PATH denen bir klasör listesinde arar. Kurulum programları kendi klasörlerini bu listeye ekler, ama açık bir terminal listeyi açılırken okumuştur; yeni ekleneni görmez. VS Code'un içindeki terminal de VS Code açılırken okunan listeyi kullanır.

#Kurulumu doğrula

Yeni bir terminal aç ve şu dört komutu sırayla yaz; her birinden sonra Enter'a bas. Her biri programın sürüm (version) numarasını yazar:

PS C:\Users\Deniz> node --versionv24.20.0PS C:\Users\Deniz> npm --version11.19.0PS C:\Users\Deniz> git --versiongit version 2.55.0.windows.3PS C:\Users\Deniz> code --version1.141.02a59476c9bfcb90b3ddc372c36762471b7dfad1cx64

Numaralar sende farklı olabilir; önemli olan kırmızı bir hata yerine bir sürüm görmek. code --version üç satır yazar: sürüm, o sürümün kimlik kodu ve bilgisayarının mimarisi (x64). Node'da ilk sayı 24 ya da daha büyükse tamam; kurs Node 24 ile denendi.

Windows'un güvenlik ayarlarını hiç değiştirmediysen npm --version satırında sürüm yerine büyük olasılıkla kırmızı bir npm.ps1 cannot be loaded mesajı görürsün. Kurulum bozuk değil; ne yapacağını aşağıdaki ikinci kart anlatıyor.

PS C:\Users\Deniz> node --versionnode : The term 'node' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the spelling of the name, or if a path was included, verify that the path is correct and try again.At line:1 char:1+ node --version+ ~~~~    + CategoryInfo          : ObjectNotFound: (node:String) [], CommandNotFoundException    + FullyQualifiedErrorId : CommandNotFoundException

PS C:\Users\Deniz> npm --versionnpm : File C:\Program Files\nodejs\npm.ps1 cannot be loaded because running scripts is disabled on this system. For more information, see about_Execution_Policies at https:/go.microsoft.com/fwlink/?LinkID=135170.At line:1 char:1+ npm --version+ ~~~    + CategoryInfo          : SecurityError: (:) [], PSSecurityException    + FullyQualifiedErrorId : UnauthorizedAccess

PS C:\Users\Deniz> npm.cmd --version11.19.0

#Dosya, klasör ve uzantı

Bilgisayardaki her şey dosyalarda durur; dosyalar klasörlerin, klasörler de başka klasörlerin içindedir. Bir dosyanın adresine yol (path) denir; Windows'ta yolun parçaları ters eğik çizgiyle (\) ayrılır. Kurulumda gördüğün PATH de bu sözcükten gelir: komutların arandığı klasör yollarının listesi.

Dosya adında son noktadan sonraki kısım uzantıdır (.js, .txt, .png, .exe). JavaScript dosyalarının uzantısı .js'dir.

#Uzantıları görünür yap

Windows uzantıları varsayılan olarak gizler; adı aslında merhaba.js.txt olan bir dosya ekranda merhaba.js diye görünür ve seni yanıltır. Bir kez aç, hep açık kalsın:

#Çalışma klasörün: C:\kod

Bu kursta yazacağın her şey C:\kod'da duracak; ilk iki bloğun ders dosyaları C:\kod\ogren'de. Masaüstü ya da Belgeler yerine burayı seçmenin üç sebebi var:

• Kısa: terminalde yazması kolay.
• Boşluksuz, Türkçe harfsiz: C:\Users\Gökhan\Desktop\Yeni klasör gibi yollar bazı programlarda sorun çıkarır; boşluklu yollar terminalde tırnak ister.
• OneDrive dışında: Masaüstü ve Belgeler çoğu bilgisayarda OneDrive'la eşitlenir; eşitleme, sen çalışırken dosyaları kilitleyebilir.

Klasörü terminalden oluştur. mkdir (make directory, "klasör yap") komutu, aradaki C:\kod yoksa onu da oluşturur:

PS C:\Users\Deniz> mkdir C:\kod\ogren      Directory: C:\kod  Mode                 LastWriteTime         Length Name----                 -------------         ------ ----d-----        11.10.2026     15:55                ogren

PowerShell yeni klasörü bir tabloyla gösterir: Mode sütunundaki d klasör (directory) demek, yanında oluşturulduğu tarih ve saat var. Tarihin biçimi Windows'un bölge ayarına göre değişir.

PS C:\Users\Deniz> mkdir C:\kod\ogrenmkdir : An item with the specified name C:\kod\ogren already exists.At line:1 char:1+ mkdir C:\kod\ogren+ ~~~~~~~~~~~~~~~~~~    + CategoryInfo          : ResourceExists: (C:\kod\ogren:String) [New-Item], IOException    + FullyQualifiedErrorId : DirectoryExist,Microsoft.PowerShell.Commands.NewItemCommand

#Terminalde gezinmek

Terminal her an bir klasörün içinde durur ve istem hangisi olduğunu söyler. node merhaba.js yazdığında Node dosyayı bu klasörde arar; bu yüzden klasörler arasında gezinmeyi bilmen gerekiyor. Gereken komutlar az:

Dene: yeni bir terminalde cd C:\kod yaz. cd başarılı olunca bir şey yazmaz, yalnızca istem değişir: artık PS C:\kod> görürsün. Sonra ls yaz:

PS C:\kod> ls      Directory: C:\kod  Mode                 LastWriteTime         Length Name----                 -------------         ------ ----d-----        11.10.2026     15:55                ogren

Tek bir klasör var. cd ogren ile içine gir; istem PS C:\kod\ogren> olur. Burada ls hiçbir şey yazmaz, çünkü klasör boş; bu bir hata değil.

cd .. seni C:\kod'a geri çıkarır. C:\'deyken cd .. yazarsan hiçbir şey olmaz: sürücünün üstünde klasör yoktur. Ekran kalabalıklaşınca cls yaz.

Üç tuş işini çok hızlandırır:

• Tab tamamlar: cd C:\kod\og yazıp Tab'a basınca satır cd C:\kod\ogren olur. Bulunduğun klasördeki bir adı tamamlarken PowerShell başına .\ ekler (cd og → cd .\ogren); .\ "bu klasördeki" demek, sorun değil. Ad tamamlanmıyorsa ya yanlış yazıyorsundur ya da yanlış klasördesin.
• ↑ (yukarı ok) önceki komutları getirir: aynı komutu yeniden yazmak yerine ↑ ve Enter. cls ekranı temizler ama bu geçmiş durur.
• Ctrl+C durdurur: bitmeyen bir programı keser, yarım yazdığın satırı iptal eder. Fareyle bir yazı seçiliyken ise onu kopyalar. Terminale yapıştırmak için Ctrl+V kullan.

PS C:\kod> cd olmayancd : Cannot find path 'C:\kod\olmayan' because it does not exist.At line:1 char:1+ cd olmayan+ ~~~~~~~~~~    + CategoryInfo          : ObjectNotFound: (C:\kod\olmayan:String) [Set-Location], ItemNotFoundException    + FullyQualifiedErrorId : PathNotFound,Microsoft.PowerShell.Commands.SetLocationCommand

#VS Code'u tanımak

#Klasörü açmak

VS Code'da tek tek dosya değil, klasör açarsın: içindeki dosyalar solda listelenir ve VS Code'un terminali o klasörde başlar.

VS Code neden soruyor? Bazı özellikler klasördeki dosyaları kendiliğinden çalıştırabilir; internetten indirdiğin tanımadığın bir projede bu tehlikeli olabilir. Bu klasörü sen oluşturdun: güvenebilirsin.

#Pencerenin bölümleri

1. Etkinlik çubuğu (Activity Bar): en soldaki simgeler. En üstteki Explorer'ı açar; ötekiler arama, Git, hata ayıklama ve eklentiler için.
2. Explorer: açtığın klasördeki dosyalar; başlıkta klasörün adı büyük harfle yazar (OGREN).
3. Düzenleyici (Editor): kodu yazdığın yer. Açtığın her dosya üstte bir sekme olur.
4. Panel: VS Code'un terminali burada açılır (Terminal → New Terminal) ve açtığın klasörde başlar.
5. Durum çubuğu (Status Bar): imlecin satırı ve sütunu (Ln 1, Col 1), girinti ayarı, dosyanın dili.

#Auto Save ve yakınlaştırma

• File → Auto Save'i işaretle: VS Code dosyayı, sen yazmayı bıraktıktan kısa bir süre sonra kendisi kaydeder. Kaydedilmemiş dosyanın sekmesinde adının yanında ● görünür.
• Yazılar küçükse View → Appearance → Zoom In ile pencereyi büyüt; Zoom Out küçültür, Reset Zoom eski hâline döndürür. Menüde her birinin yanında kısayolu da yazar.

#Türkçe dil paketi kurma

VS Code'un menüleri İngilizce. Türkçe dil paketi var, ama kurmanı önermiyoruz: hata mesajları, internetteki çözümler, belgeler ve bu kursun bütün ekranları İngilizce menüleri gösteriyor. "File → Auto Save" dediğimizde aradığını hemen bulursun; File, View, Terminal gibi sözcükler birkaç günde yerine oturur.

#Türkçe klavyede kod karakterleri

Kodda süslü parantez, köşeli parantez, ters eğik çizgi gibi işaretler bolca geçer. Türkçe Q klavyede bunların çoğu AltGr tuşuyla (boşluk çubuğunun sağındaki Alt) yazılır: AltGr'yi basılı tutup ikinci tuşa basarsın.

#İlk programın: merhaba.js

Her şey hazır; şimdi zinciri baştan sona çalıştır.

1console.log("Merhaba dünya")

PS C:\kod\ogren> node merhaba.jsMerhaba dünya

Bu satırı gördüysen bütün zincir çalışıyor: VS Code dosyayı kaydetti, terminal komutu Node.js'e iletti, Node.js dosyayı okuyup çevirdi, işlemci çalıştırdı (Şekil 0.1). console.log(...) "parantezin içindekini terminale yaz" demek; tırnak içindeki yazı olduğu gibi çıkar. Parçalarını Ders 1'de tek tek öğreneceksin, şimdilik kalıp olarak yaz.

PS C:\kod> node merhaba.jsnode:internal/modules/cjs/loader:1568  throw err;  ^ Error: Cannot find module 'C:\kod\merhaba.js'    at Module._resolveFilename (node:internal/modules/cjs/loader:1564:15)    ...    at node:internal/main/run_main_module:33:47 {  code: 'MODULE_NOT_FOUND',  requireStack: []} Node.js v24.20.0

PS C:\kod\ogren> node merhaba.jsnode:internal/modules/cjs/loader:1568  throw err;  ^ Error: Cannot find module 'C:\kod\ogren\merhaba.js'    ...PS C:\kod\ogren> ls      Directory: C:\kod\ogren  Mode                 LastWriteTime         Length Name----                 -------------         ------ -----a----        11.10.2026     15:57             29 merhaba.js.txt

1console.log("Merhaba dünya")

PS C:\kod\ogren> node merhaba.js

PS C:\kod\ogren> nodeWelcome to Node.js v24.20.0.Type ".help" for more information.> node merhaba.jsnode merhaba.js     ^^^^^^^ Uncaught SyntaxError: Unexpected identifier 'merhaba'>

#Git'e kendini tanıt

Git her kaydın yanına onu kimin yaptığını yazar; bunun için adını ve e-postanı bir kez söylemen gerekir. Söylemezsen Ders 1'deki ilk kayıtta Git seni durdurup sorar. Terminalde şu iki komutu kendin yaz; tırnakların içine kendi adını ve e-postanı koy:

PS C:\Users\Deniz> git config --global user.name "Adın Soyadın"PS C:\Users\Deniz> git config --global user.email "eposta@ornek.com"

Üçüncü komut, Git senden bir metin isteyeceği zaman VS Code'u açmasını söyler. Bunu olduğu gibi kopyalayabilirsin:

PS C:\Users\Deniz> git config --global core.editor "code --wait"

Komutlar bir şey yazmazsa ayar kaydedilmiş demektir. Kontrol et; örnekte Deniz'in bilgileri var, sende kendi bilgilerin görünmeli:

PS C:\Users\Deniz> git config --global --listuser.name=Deniz Yılmazuser.email=deniz@example.comcore.editor=code --wait

• --global: ayar bu bilgisayardaki bütün projelerinde geçerli olsun.
• user.name: kayıtlarda görünecek adın.
• user.email: her kaydın içine yazılır; projeni GitHub'a koyduğunda bu e-posta da herkese açık olur. Kişisel adresinin görünmesini istemiyorsan şimdilik başka bir adres yaz; Ders 7'de GitHub'ın e-postanı gizleyen adresine geçeceksin.
• core.editor "code --wait": Git senden bir metin isteyeceği zaman (örneğin bir kaydın açıklaması) VS Code'u açsın ve sen o sekmeyi kapatana kadar beklesin. Yol A ile kurduysan bu ayar şart, çünkü winget Git'i Vim ile kurar. Kurulumda VS Code'u seçtiysen de zararı yok.

#macOS ya da Linux kullanıyorsan

#Görevler

Görevleri sırayla yap. Önce kendin dene, takılırsan ipuçlarını sırayla aç; çözüme en son bak.

Node.js: v24.20.0npm: 11.19.0Git: 2.55.0VS Code: 1.141.0Git'teki adım: Deniz Yılmaz

PS C:\Users\Deniz> node --versionv24.20.0PS C:\Users\Deniz> npm --version11.19.0PS C:\Users\Deniz> git --versiongit version 2.55.0.windows.3PS C:\Users\Deniz> code --version1.141.02a59476c9bfcb90b3ddc372c36762471b7dfad1cx64PS C:\Users\Deniz> git config --global user.nameDeniz Yılmaz

PS C:\kod\ogren> cd ..PS C:\kod> mkdir deneme      Directory: C:\kod  Mode                 LastWriteTime         Length Name----                 -------------         ------ ----d-----        11.10.2026     16:08                deneme  PS C:\kod> cd denemePS C:\kod\deneme> lsPS C:\kod\deneme> cd ..PS C:\kod> cd ..PS C:\> cd ..PS C:\> cd C:\kod\ogrenPS C:\kod\ogren>

Hoş geldin Sihirdar, bugün kaç maç kazandın?

1console.log("Hoş geldin Sihirdar, bugün kaç maç kazandın?")

Hoş geldin Sihirdar, bugün kaç maç kazandın?

{ } [ ] ( ) < > ; : = + - * / | _ # $ % & @ ' ^ ~ `

1console.log("{ } [ ] ( ) < > ; : = + - * / | _ # $ % & @ ' ^ ~ `")

{ } [ ] ( ) < > ; : = + - * / | _ # $ % & @ ' ^ ~ `

Kurulum tamam, Ders 1'e hazırım

1console.log("Kurulum tamam, Ders 1'e hazırım")

Kurulum tamam, Ders 1'e hazırım

PS C:\kod\deneme> node kontrol.jsnode:internal/modules/cjs/loader:1568  throw err;  ^ Error: Cannot find module 'C:\kod\deneme\kontrol.js'    ...PS C:\kod\deneme> node C:\kod\ogren\kontrol.jsKurulum tamam, Ders 1'e hazırımPS C:\kod\deneme> node ..\ogren\kontrol.jsKurulum tamam, Ders 1'e hazırım

#Kendini sına

Error: Cannot find module 'C:\Users\Deniz\merhaba.js'

Bir sonraki derste, Ders 1'de, console.log ile ekrana istediğini yazdıracak, bilgileri değişken denen kutulara koyacak ve JavaScript'in hata mesajlarını okumayı öğreneceksin.