Web Geliştirme mülakat soruları

AJAX (Asynchronous JavaScript and XML), JavaScript ile sunucudan arka planda veri alıp sayfayı yeniden yüklemeden yalnızca bir kısmını güncelleme tekniğidir.

Teknik her yerde, ama ad daha az kullanılıyor. Veriyi fetch ile yükleyip yenilenmeden kendini güncelleyen her sayfa AJAX yapıyor demektir.

AJAX genel tekniktir. Fetch API ise arka plandaki isteği yapmaya yarayan, eski XMLHttpRequest nesnesinin yerini alan modern tarayıcı fonksiyonudur.

Hayır. Ad bulunduğunda XML yaygındı, ama bugün AJAX isteklerinin neredeyse hepsi JSON gönderip alır; düz metin ve HTML dahil her biçimi taşıyabilirler.

Alan adı (domain name), example.com gibi bir web sitesinin insanların okuyabileceği adresidir; DNS sistemi bunu siteyi barındıran sunucunun IP adresine çevirir.

Alan adı sitenin adıdır, example.com gibi. URL ise protokol ve yol dahil tek bir kaynağın tam adresidir, https://example.com/about gibi.

Kontrol ettiğiniz bir alan adının altındaki addır, blog.example.com ya da api.example.com gibi. Alt alan adlarını yeni bir şey kaydetmeden, DNS kayıtlarıyla kendiniz oluşturursunuz.

.com dünya genelinde en tanıdık olanıdır; .tr gibi bir ülke alan adı yerel bir kitleye işaret edebilir; .dev ya da .io gibi daha yeni TLD'ler de teknik projelerde popülerdir. En önemlisi, güvenle yenileyebileceğiniz kısa ve açık bir addır.

Angular, Google'ın TypeScript tabanlı, eksiksiz web framework'üdür; bileşenler, yönlendirme, formlar, HTTP istemcisi ve bağımlılık enjeksiyonu yerleşik gelir.

AngularJS (2010), orijinal JavaScript framework'üydü. Angular (2016) ise farklı bir mimariyle TypeScript'te baştan yazılmış bir sürümdür; AngularJS kodu Angular'da çalışmaz ve AngularJS artık desteklenmiyor.

Genel olarak hiçbiri daha iyi değil. Angular güçlü kuralları olan eksiksiz bir framework'tür; bu da işleri tek bir biçimde yapmak isteyen büyük ekiplere uyar. React ise daha fazla seçimi size ve ekosistemine bırakan daha küçük bir kütüphanedir.

Evet. Angular TypeScript ile yazılmıştır; Angular uygulamaları da TypeScript ile yazılır.

ARIA, role ve aria-label gibi HTML özniteliklerinden oluşan bir W3C standardıdır; yardımcı teknolojilere özel bir bileşenin ne olduğunu ve durumunu bildirir.

İhtiyacınız olan anlam ve davranışa zaten sahip bir yerel HTML öğesi ya da özniteliği varsa ARIA eklemek yerine onu kullanın. Gerçek bir <button> odaklanabilir, klavyeyle çalışır ve hiçbir ek kod olmadan doğru şekilde duyurulur.

aria-label bir öğeye adını doğrudan metin olarak verir. aria-labelledby ise görünür metni ad olarak kullanılacak başka bir öğenin id değerine işaret eder; böylece ekranda görünenle sesli okunan uyumlu kalır.

WCAG, erişilebilir bir sayfanın neyi başarması gerektiğini anlatan bir yönergeler bütünüdür; metin alternatifleri ve klavyeyle erişim gibi. ARIA ise özniteliklerden oluşan teknik bir spesifikasyondur ve bu yönergelerin bazılarını özel bileşenlerde karşılamanın yollarından biridir.

Astro, 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.

Öyle başladı ve hâlâ varsayılan olarak statik sayfalar üretir. Bir adapter ile sayfaları her istekte sunucuda da render edebilir; böylece hem statik hem dinamik siteleri kapsar.

Evet. Astro'nun React, Vue, Svelte, Solid ve Preact için resmî entegrasyonları vardır. Bileşenler sunucuda HTML'e dönüştürülür; yalnızca client:* direktifi olanlar JavaScript'lerini tarayıcıda yükler.

Next.js, eksiksiz web uygulamaları için bir React framework'üdür ve arayüzü çalıştırmak için React'i tarayıcıya gönderir. Astro ise içerik siteleri için tasarlanmıştır, birden çok arayüz framework'üyle çalışır ve JavaScript'i yalnızca etkileşimli adalar için gönderir.

Babel, modern JavaScript, JSX ve TypeScript sözdizimini eski tarayıcıların ve ortamların çalıştırabileceği koda çeviren bir JavaScript derleyicisidir.

Eskisinden daha az. Modern tarayıcılar güncel sözdiziminin neredeyse tamamını destekliyor; yeni projelerin çoğunda TypeScript ve JSX'i SWC, esbuild ve Oxc gibi daha hızlı araçlar işliyor. Babel, React Compiler gibi belirli bir eklentinin gerektiği yerlerde ve eski build kurulumlarında hâlâ kullanılıyor.

İkisi de TypeScript'i JavaScript'e dönüştürebilir. tsc tipleri de kontrol eder; Babel ise onları yalnızca siler, bunu da hızlıca ve her seferinde tek bir dosyada yapar. Pek çok proje kodu hızlı bir araca derletir ve tsc --noEmit komutunu yalnızca kontrol için çalıştırır.

Hedeflediğiniz tarayıcılara ya da Node.js sürümlerine bakar ve yalnızca onların ihtiyaç duyduğu dönüşümleri uygular; böylece modern tarayıcılar için üretilen kod yazdığınıza yakın kalır.

Bootstrap, duyarlı bir grid ile buton, navbar ve modal gibi hazır bileşenler sunan ücretsiz bir CSS framework'üdür; HTML'e sınıf ekleyerek kullanılır.

Evet. Özellikle yönetim panellerinde, şirket içi araçlarda ve hızlı prototiplerde hâlâ en yaygın CSS framework'lerinden biridir; yine de pek çok yeni proje Tailwind CSS'i ya da kendi framework'ü için yapılmış bir bileşen kütüphanesini seçiyor.

Bootstrap, tanıdık bir varsayılan tasarımı olan hazır bileşenler sunar. Tailwind ise alt düzey utility sınıfları sunar; kendi tasarımınızı ve bileşenlerinizi bunlardan kurarsınız.

Bootstrap 5'ten beri gerektirmez. Sürüm 4 ve öncesi, etkileşimli bileşenleri için jQuery kullanıyordu; sürüm 5 bunları sade JavaScript ile yeniden yazdı ve Popper kütüphanesini yalnızca açılır menüleri, tooltip'leri ve popover'ları konumlandırmak için kullanır.

Bundler, 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.

Bundler, birçok modülü ve npm paketini birkaç optimize dosyaya dönüştürür; bu da ağ isteklerini azaltır, kullanılmayan kodu kaldırır ve TypeScript, JSX ile modern söz dizimini kullanmanıza olanak tanır. Yalnızca birkaç betiği olan küçük siteler onsuz da sorunsuz çalışabilir.

npm, pnpm veya Yarn gibi bir paket yöneticisi projenizin kullandığı kütüphaneleri indirir ve sürümlerini izler. Bundler ise sizin kodunuzu ve bu kütüphaneleri tarayıcıların yükleyebileceği dosyalarda birleştirir.

Tree shaking, kodunuzun hiç import etmediği dışa aktarımları kaldıran bir bundler optimizasyonudur. ES modül import ve export söz diziminde en iyi şekilde çalışır; çünkü bunlar kod çalıştırılmadan analiz edilebilir.