Yol haritası · Orta seviye
JavaScript ekosistemi
Çalışma ortamları, paket yöneticileri, derleme araçları ve framework'ler: modern bir JavaScript projesinin hareketli parçaları.
Bir JavaScript projesinde yolunuzu bulun: dil ve onu çalıştıran ortamlar, paketlerin nasıl kurulup sürümlendiği, derleme adımının ne yaptığı, üstteki framework'ler ve kodu düzenli ve test edilmiş tutan araçlar.
33 sayfa5 bölümyaklaşık 1 saat okuma
- Web Geliştirme
- Backend ve API'ler
- Programlamanın Temelleri
- Sürüm Kontrolü
- Test ve Kalite
Henüz başlanmadı0/33 okundu
JavaScript ile başlaİlerleme, yalnızca bu tarayıcıda tutulan okuma geçmişinizden gelir.
1. bölümDil ve çalışma ortamları
- 1JavaScriptWeb Geliştirme, s. 30JavaScript, web tarayıcılarında sayfaları etkileşimli hale getiren ve Node.js gibi çalışma ortamlarıyla sunucularda da çalışan programlama dilidir.
- 2TypeScriptWeb Geliştirme, s. 61TypeScript, JavaScript üzerine statik tipler ekleyerek birçok hatayı kod çalışmadan yakalayan ve düz JavaScript'e derlenen bir programlama dilidir.
- 3ES ModülleriWeb Geliştirme, s. 20ES modülleri, JavaScript'in yerleşik modül sistemidir: her dosya kendi kapsamını korur ve kodu diğer dosyalarla import ve export aracılığıyla paylaşır.
- 4Event LoopBackend ve API'ler, s. 14Event loop, olaylar ve I/O sonuçları hazır oldukça callback'leri tek tek çalıştırarak tek bir iş parçacığının birçok görevi yönetmesini sağlayan mekanizmadır.
- 5Node.jsBackend ve API'ler, s. 33Node.js, JavaScript'i tarayıcı dışında çalıştıran, en çok web sunucuları, API'ler ve komut satırı araçları için kullanılan açık kaynaklı çalışma ortamıdır.
- 6DenoBackend ve API'ler, s. 11Deno, sistem erişimini izin verilene kadar kapalı tutan ve kendi araçlarıyla gelen, açık kaynaklı bir JavaScript ve TypeScript çalışma ortamıdır.
- 7BunBackend ve API'ler, s. 8Bun; paket yöneticisi, bundler ve test çalıştırıcı da olan, Node.js'in yerine geçmek üzere tasarlanmış hızlı bir JavaScript ve TypeScript çalışma ortamıdır.
2. bölümPaketler
- 8Paket YöneticisiProgramlamanın Temelleri, s. 48Paket yöneticisi, yazılım paketlerini ve onların bağımlılıklarını kuran, güncelleyen ve kaldıran, sürümleri otomatik olarak çözen bir araçtır.
- 9npmWeb Geliştirme, s. 39npm, Node.js'in varsayılan paket yöneticisi ve dünyanın en büyük yazılım deposudur; bir projenin bağımlılıklarını indirir ve sürümlerini takip eder.
- 10YarnWeb Geliştirme, s. 72Yarn, npm'e alternatif bir JavaScript paket yöneticisidir; bağımlılıkları npm deposundan kurar, lockfile, workspace ve Plug'n'Play desteği sunar.
- 11pnpmWeb Geliştirme, s. 40pnpm, her paket sürümünün tek kopyasını ortak bir depoda tutup projelere bağlayan, hızlı ve disk dostu bir JavaScript paket yöneticisidir.
- 12Semantic VersioningSürüm Kontrolü, s. 36Semantic versioning, her bölümün bir sürümün uyumluluğu bozduğunu, özellik eklediğini ya da hata düzelttiğini belirttiği MAJOR.MINOR.PATCH şemasıdır.
- 13MonorepoSürüm Kontrolü, s. 31Monorepo, uygulamalar, servisler ve paylaşılan kütüphaneler gibi birçok projenin kodunu birlikte yönetilen tek bir sürüm kontrol deposunda tutma yaklaşımıdır.
3. bölümDerleme adımı
- 14TranspilerWeb Geliştirme, s. 59Transpiler, kaynak kodu bir dilden ya da dil sürümünden benzer soyutlama düzeyindeki bir başkasına, örneğin TypeScript'ten JavaScript'e çeviren araçtır.
- 15BabelWeb Geliştirme, s. 6Babel, modern JavaScript, JSX ve TypeScript sözdizimini eski tarayıcıların ve ortamların çalıştırabileceği koda çeviren bir JavaScript derleyicisidir.
- 16BundlerWeb Geliştirme, s. 8Bundler, JavaScript modüllerini ve bağımlılıklarını tarayıcıların hızlıca indirip çalıştırabileceği birkaç optimize dosyada birleştiren bir derleme aracıdır.
- 17WebpackWeb Geliştirme, s. 70Webpack, uygulamanın import'larını izleyip JavaScript, CSS, görsel ve diğer dosyaları tarayıcıya uygun paketlerde birleştiren modül paketleyicisidir.
- 18ViteWeb Geliştirme, s. 64Vite, geliştirmede kodu tarayıcıya neredeyse anında sunan ve canlı ortam için optimize edilmiş dosyalar halinde paketleyen hızlı bir web derleme aracıdır.
- 19Tree ShakingWeb Geliştirme, s. 60Tree shaking, hangi ES modül dışa aktarımlarının gerçekten import edildiğine bakarak hiç kullanılmayan kodu son paketten çıkaran bir derleme optimizasyonudur.
- 20Code SplittingWeb Geliştirme, s. 10Code splitting, bir web uygulamasının JavaScript'ini istenince yüklenen küçük parçalara bölen tekniktir; böylece ilk sayfa yalnızca gereken kodu indirir.
- 21MinificationWeb Geliştirme, s. 36Minification, davranışı değiştirmeden boşlukları, yorumları ve uzun adları silerek kod dosyalarını küçülten işlemdir; böylece web sayfaları daha hızlı iner.
4. bölümFramework'ler
- 22ReactWeb Geliştirme, s. 44React, veri değişince otomatik güncellenen, yeniden kullanılabilir bileşenlerle kullanıcı arayüzü kurmaya yarayan açık kaynaklı JavaScript kütüphanesidir.
- 23JSXWeb Geliştirme, s. 32JSX, kodun içine HTML benzeri işaretleme yazmayı sağlayan bir JavaScript sözdizimi uzantısıdır; çoğunlukla React ile arayüzün nasıl görüneceğini tarif eder.
- 24React Hook'larıWeb Geliştirme, s. 45React hook'ları, useState ve useEffect gibi, fonksiyon bileşenlerinin state tutmasını, yan etki çalıştırmasını ve mantık paylaşmasını sağlayan fonksiyonlardır.
- 25React Server ComponentsWeb Geliştirme, s. 46React Server Components, yalnızca sunucuda ya da build sırasında çalışan React bileşenleridir; veriyi doğrudan okuyabilir ve tarayıcıya JavaScript göndermezler.
- 26Next.jsWeb Geliştirme, s. 38Next.js, React'e yönlendirme, sunucu tarafı render, statik üretim ve sunucu kodu ekleyen bir framework'tür; bütün bir web uygulaması tek projede geliştirilir.
- 27AstroWeb Geliştirme, s. 5Astro, içerik odaklı siteler için bir web framework'üdür; sayfaları HTML'e dönüştürür ve JavaScript'i yalnızca etkileşimli adalara ekler.
- 28VueWeb Geliştirme, s. 65Vue, kolay öğrenilmesi ve reaktif verisiyle bilinen, bileşenlerden kullanıcı arayüzü kurmaya yarayan açık kaynaklı bir JavaScript framework'üdür.
- 29SvelteWeb Geliştirme, s. 56Svelte, tarayıcıda büyük bir framework çalıştırmak yerine bileşenleri derleme sırasında küçük, verimli JavaScript'e derleyen bir ön yüz framework'üdür.
5. bölümDüzen ve testler
- 30LintingTest ve Kalite, s. 15Linting, kaynak kodu çalıştırmadan otomatik olarak analiz edip olası hataları, stil sorunlarını ve şüpheli kalıpları kod yayına çıkmadan işaretleme işlemidir.
- 31Kod BiçimlendiriciProgramlamanın Temelleri, s. 38Kod biçimlendirici, kaynak kodu tek ve tutarlı bir düzene sokan araçtır; kodun ne yaptığını değiştirmeden girintiyi, boşlukları ve satır sonlarını düzeltir.
- 32JestTest ve Kalite, s. 10Jest; test çalıştırıcıyı, doğrulamaları, mock'lamayı, snapshot'ları ve kod kapsamını az kurulumla tek pakette sunan popüler JavaScript test framework'üdür.
- 33PlaywrightTest ve Kalite, s. 20Playwright, Chromium, Firefox ve WebKit'i tek bir API ile yöneten, Microsoft'un uçtan uca test ve tarayıcı otomasyonu için açık kaynaklı framework'üdür.
Yol boyunca karşılaştırın
Bu yol haritasında kolayca karıştırılan çiftler, yan yana.