Terminal ve npm

Terminal Nedir?

Terminal, programları yazı yazarak çalıştırdığınız metin tabanlı arayüzdür. Teknik olarak terminal, bir shell başlatıp ona bağlanan programdır; komutları yorumlayan shell'dir. Günlük kullanımda iki kelime aynı anlamda kullanılır.¹

Frontend geliştirirken terminali her gün açarsınız: paket kurmak, geliştirme sunucusunu başlatmak, build almak ve Git için.²

MDN, Windows'ta WSL kurmayı açıkça öneriyor.¹ VS Code'un içindeki terminal de iyi bir başlangıçtır; editörden çıkmadan komut çalıştırırsınız.²

Temel Komutlar

. bulunduğunuz klasör, .. bir üst klasördür.² -l gibi tireyle başlayan ekler flag'dir ve komutun davranışını değiştirir; -la gibi birleştirilebilirler.¹² Bir komutun nasıl kullanıldığını man ls ya da çoğu araçta --help ile görürsünüz.³

Node.js Kurulumu

Node.js, JavaScript'i tarayıcı dışında çalıştıran bir ortamdır; Chrome'un V8 motorunu kullanır.⁴ React kodunuz tarayıcıda çalışsa da Vite, Next.js, ESLint ve test araçları Node üzerinde çalışır. Node'u kurduğunuzda npm ve npx de gelir.¹

Node'un çift sayılı sürümleri LTS (long-term support) olur. Node.js ekibi, gerçek projelerde yalnızca LTS sürümlerin kullanılmasını önerir. Ekim 2026 itibarıyla LTS sürüm Node 24, en yeni sürüm Node 26'dır. Node 27'den itibaren yılda bir sürüm çıkacak ve her sürüm LTS olacak.⁵

Node'u doğrudan değil, bir sürüm yöneticisiyle kurmak iyi bir alışkanlıktır: farklı projeler farklı Node sürümleri isteyebilir. macOS, Linux ve WSL'de en yaygını nvm'dir:⁶

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.7/install.sh | bash
nvm install --lts
node -v
npm -v

Proje kökündeki .nvmrc dosyasına sürüm yazarsanız (24 gibi), o klasörde nvm use doğru sürüme geçer.⁶ nvm Windows'ta doğrudan çalışmaz; WSL kullanmıyorsanız nodejs.org'dan LTS kurulum dosyasını indirin.⁶⁷

npm ve package.json

npm, hem paket yöneticisi hem de JavaScript paketlerinin tutulduğu en yaygın registry'dir. Paket yöneticisi, projenin kullandığı başkalarının yazdığı kodu (dependency) indirir, saklar ve kaldırır.⁸

Her projenin kökünde bir package.json bulunur. Projenin adını, script'lerini ve bağımlılıklarını tutar:⁸⁹

{
  "name": "virastack",
  "private": true,
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vite build"
  },
  "dependencies": {
    "react": "^19.3.0"
  },
  "devDependencies": {
    "vite": "^8.3.0"
  }
}

• dependencies: Kaynak kodunuzun import ettiği paketler (React gibi).

• devDependencies: Yalnızca geliştirirken kullanılan araçlar (Vite, ESLint, Vitest gibi).⁸⁹

• private: true: Projenin yanlışlıkla npm'e yayınlanmasını engeller.⁸

Sık kullanılan komutlar

Projedeki tüm paketleri kurmak için proje klasöründe npm install çalıştırın. Yeni bir paket eklemek için:

$ pnpm add react

Yalnızca geliştirmede kullanılacak bir araç için -D ekleyin; paket devDependencies'e yazılır:⁸

$ pnpm add -D vite

scripts altındaki bir komutu çalıştırmak için:¹⁰

$ pnpm dev

Script'ler projenin kendi node_modules klasöründeki araçları bulur, bu yüzden Vite'ı ayrıca global kurmanız gerekmez.⁸¹⁰ Bir paketi kurmadan tek seferlik çalıştırmak için npx vardır; paket projede yoksa indirmeden önce size sorar.¹¹

Sürüm aralıkları

Paket sürümleri MAJOR.MINOR.PATCH biçimindedir. package.json'daki işaret, npm install çalıştığında hangi güncellemelerin kabul edileceğini belirler:¹²⁸

Lockfile ve node_modules

npm install, paketleri node_modules klasörüne indirir ve tam olarak hangi sürümlerin kurulduğunu package-lock.json'a yazar. Lockfile değişmediği sürece herkesin bilgisayarında aynı node_modules oluşur.⁸

pnpm

pnpm, npm ile aynı package.json'u ve aynı registry'yi kullanan alternatif bir paket yöneticisidir.⁸ Farkı paketleri saklama biçimidir: her paket sürümünü diskte tek bir yerde tutar ve projelere hard link ile bağlar. On projede aynı React sürümü varsa diskte bir kopyası olur. Ayrıca projenin yalnızca package.json'da yazan paketleri import etmesine izin verir; npm'de ise yazmadığınız bir alt bağımlılığı yanlışlıkla kullanabilirsiniz.¹⁴¹⁵

ViraStack projeleri pnpm kullanır. Node kuruluysa pnpm'i şu komutla kurabilirsiniz:¹⁶

npx get-pnpm

pnpm'de pnpm dev, pnpm run dev'in kısaltmasıdır; script adı pnpm'in kendi bir komutuyla çakışmadığı sürece çalışır.¹⁷¹⁸

İlk Projeyi Çalıştırmak

Yeni bir React projesi açmak için Vite'ın kurulum aracını çalıştırın. Proje adını ve framework olarak React'i sorar:¹⁹

$ pnpm create vite@latest

Ardından proje klasörüne girip paketleri kurun ve geliştirme sunucusunu başlatın:

cd virastack
pnpm install
pnpm dev

Sayfa http://localhost:5173 adresinde açılır.¹⁹ Dosyayı kaydettiğinizde tarayıcı güncellenir. İşiniz bitince terminalde Ctrl + C ile sunucuyu durdurun.²

Paketlere Güvenmek

Paket kurmak, başkasının yazdığı kodu bilgisayarınızda çalıştırmak demektir. Bazı paketler kurulurken kendi script'lerini de çalıştırır. Bu yüzden iki paket yöneticisi de varsayılanlarını sıkılaştırdı:

• npm 12 (Temmuz 2026), bağımlılıkların preinstall, install ve postinstall script'lerini artık izin vermediğiniz sürece çalıştırmıyor. Güvendiğiniz paketleri npm approve-scripts ile onaylayıp package.json'a yazarsınız.²⁰

• pnpm, bağımlılıkların kurulum script'lerini v10'dan beri çalıştırmıyor; izin verilecek paketler allowBuilds ile listelenir. Ayrıca bir günden yeni yayınlanmış sürümleri varsayılan olarak kurmuyor (minimumReleaseAge).²¹

Detaylı Öğrenmek İçin

• Terminal, frontend gözüyle: Josh W. Comeau'nun React geliştiricileri için yazdığı terminal rehberi.²

• Shell'i baştan sona: MIT'nin Missing Semester dersinin shell bölümü; yolları, $PATH'i, pipe'ları ve yönlendirmeyi anlatır, videosuyla birlikte.³

• Paket yönetimi: MDN'in npm ile sıfırdan bir proje kurduğu rehberi.⁸

• Konuşma: Tally Barak'ın node_modules'un neden böyle olduğunu ve lockfile'ları anlattığı Node Congress 2022 konuşması (9 dk).²²

• Konuşma: pnpm'in yazarı Zoltan Kochan'ın pnpm'in nasıl çalıştığını anlattığı DevOps.js Conf 2022 konuşması (31 dk).¹⁵