Translation of 8 - Web Components Intro

Author: yinkar

8-web-components/1-webcomponents-intro/article.md

@@ -1,76 +1,76 @@
 # From the orbital height
 
-This section describes a set of modern standards for "web components".
+Bu bölüm, "web bileşenleri" için bir dizi modern standardı tanımlayacaktır.
 
-As of now, these standards are under development. Some features are well-supported and integrated into the modern HTML/DOM standard, while others are yet in draft stage. You can try examples in any browser, Google Chrome is probably the most up to date with these features. Guess, that's because Google fellows are behind many of the related specifications.
+Şu anda bu standartlar geliştirme aşamasındadır. Bazı standartlar iyi bir desteğe sahip ve modern HTML/DOM standardına entegre edilmişken, diğerleri henüz taslak aşamasındadır. Örnekleri herhangi bir tarayıcıda deneyebilirsiniz, Google Chrome muhtemelen bu özellikler konusundaki en güncel tarayıcı seçeneği olacaktır. Bunun nedeni belki de Google takımının ilgili birçok özelliğin arkasında olmasıdır.
 
-## What's common between...
+## ... arasında ortak olan nedir?
 
-The whole component idea is nothing new. It's used in many frameworks and elsewhere.
+Bu bileşen fikri tamamen yeni bir şey değil. Birçok framework ve dahası tarafından daha önceden kullanılmaktaydı.
 
-Before we move to implementation details, take a look at this great achievement of humanity:
+Detayları tanımlamaya başlamadan önce insanlığın bu büyük başarısına bir göz atalım:
 
 ![](satellite.jpg)
 
-That's the International Space Station (ISS).
+Bu, Uluslararası Uzay İstasyonu (ISS).
 
-And this is how it's made inside (approximately):
+Bu ise içerisinde ne olduğu (hemen hemen):
 
 ![](satellite-expanded.jpg)
 
-The International Space Station:
-- Consists of many components.
-- Each component, in its turn, has many smaller details inside.
-- The components are very complex, much more complicated than most websites.
-- Components are developed internationally, by teams from different countries, speaking different languages.
+Uluslararası Uzay İstasyonu:
+- Birçok bileşenden meydana gelir.
+- Her bileşen kendi tarafında, içerisinde çok sayıda küçük detaylara sahiptir.
+- Bileşenler oldukça karmaşık, birçok websitesinden çok daha karmaşık bir yapıdadır.
+- Bileşenler; farklı dilleri konuşan, farklı ülkelerden takımlar tarafından, uluslararası olarak geliştirilir.
 
-...And this thing flies, keeps humans alive in space!
+... Ayrıca bu şey, içerisinde insanları canlı tutarak uzayda uçar!
 
-How such complex devices are created?
+Bu kadar karmaşık cihazlar nasıl oluşturulur?
 
-Which principles we could borrow to make our development same-level reliable and scalable? Or, at least, close to it.
+Geliştirmemizi aynı düzeyde güvenilir ve ölçeklenebilir hale getirmek için hangi prensipleri ödünç alabiliriz? En azından, yaklaşabilmek için.
 
-## Component architecture
+## Bileşen mimarisi
 
-The well known rule for developing complex software is: don't make complex software.
+Karmaşık yazılım geliştirmenin en meşhur kuralı şudur: karmaşık yazılım yapma.
 
-If something becomes complex -- split it into simpler parts and connect in the most obvious way.
+Bir şey eğer karmaşıklaşacaksa -- onu parçalara ayır ve birbiriyle en açık şekilde bir araya getir.
 
-**A good architect is the one who can make the complex simple.**
+**İyi bir mimar, karmaşığı basit bir şekilde oluşturabilendir.**
 
-We can split user interface into visual components: each of them has own place on the page, can "do" a well-described task, and is separate from the others.
+Kullanıcı arayüzünü görsel bileşenlere ayırabiliriz: herbiri sayfada kendi yerine sahip olur, iyi tanımlanmış bir görev "yapar" ve diğerlerinden ayrıdır.
 
-Let's take a look at a website, for example Twitter.
+Şimdi bir web sitesine, örneğin Twitter'a bir göz atalım.
 
-It naturally splits into components:
+Doğal olarak bileşenlere ayrılıyor:
 
 ![](web-components-twitter.svg)
 
-1. Top navigation.
-2. User info.
-3. Follow suggestions.
-4. Submit form.
-5. (and also 6, 7) -- messages.
+1. Üst menü.
+2. Üye bilgisi.
+3. Takip önerileri.
+4. Gönderi formu.
+5. (ve aynı zamanda 6, 7) -- mesajlar.
 
-Components may have subcomponents, e.g. messages may be parts of a higher-level "message list" component. A clickable user picture itself may be a component, and so on.
+Bileşenler alt bileşenlere sahip olabilir; örneğin mesajlar, bir üst seviyedeki "mesaj listesi" bileşeninin birer parçası olabilir. Tıklanabilir bir kullanıcı resmi kendi başına bir bileşen olabilir ve bu şekilde gider.
 
-How do we decide, what is a component? That comes from intuition, experience and common sense. Usually it's a separate visual entity that we can describe in terms of what it does and how it interacts with the page. In the case above, the page has blocks, each of them plays its own role, it's logical to make these components.
+Bir bileşenin ne olduğuna nasıl karar vereceğiz? Bu biraz da sezgiden, deneyimden ve sağduyudan gelir. Genellikle ne yaptığını ve sayfa ile nasıl etkileşimde bulunduğunu tanımlayabildiğimiz, ayrılmış bir görsel varlıktır. Yukarıdaki durumda sayfa bloklara sahiptir, bunların herbiri kendi rolünü oynar. Bu durumda bunları bileşen yapmak mantıklıdır.
 
-A component has:
-- its own JavaScript class.
-- DOM structure, managed solely by its class, outside code doesn't access it ("encapsulation" principle).
-- CSS styles, applied to the component.
-- API: events, class methods etc, to interact with other components.
+Bir bileşen şunlara sahiptir:
+- kendi JavaScript sınıfı.
+- yalnızca kendi sınıfı tarafından yönetilen DOM mimarisi, dış kod buna erişemez ("kapsülleme" prensibi).
+- Bileşen tarafından uygulanan CSS stilleri
+- API: diğer bileşenlerle etkileşime geçmek için olaylar, sınıf metotları vs.
 
-Once again, the whole "component" thing is nothing special.
+Bir kez daha değinelim, tüm bu "bileşen" yapısı özel bir şey değildir.
 
-There exist many frameworks and development methodologies to build them, each one with its own bells and whistles. Usually, special CSS classes and conventions are used to provide "component feel" -- CSS scoping and DOM encapsulation.
+Bunları oluşturmak için çok fazla framework ve geliştirme metodolojisi vardır, herbirinin kendi gösterişi vardır. Genellikle "bileşen hissi" sağlamak adına, CSS kapsamı ve DOM kapsülleme için özel CSS sınıfları ve kuralları kullanır.
 
-"Web components" provide built-in browser capabilities for that, so we don't have to emulate them any more.
+"Web bileşenleri" bunun için yerleşik tarayıcı özellikleri sağlar, bu yüzden bunları artık taklit etmemize gerek yok.
 
-- [Custom elements](https://html.spec.whatwg.org/multipage/custom-elements.html#custom-elements) -- to define custom HTML elements.
-- [Shadow DOM](https://dom.spec.whatwg.org/#shadow-trees) -- to create an internal DOM for the component, hidden from the others.
-- [CSS Scoping](https://drafts.csswg.org/css-scoping/) -- to declare styles that only apply inside the Shadow DOM of the component.
-- [Event retargeting](https://dom.spec.whatwg.org/#retarget) and other minor stuff to make custom components better fit the development.
+- [Özel elementler](https://html.spec.whatwg.org/multipage/custom-elements.html#custom-elements) -- özel HTML elementleri tanımlamak için.
+- [Gölge DOM](https://dom.spec.whatwg.org/#shadow-trees) -- bileşen için iç DOM oluşturarak onu diğerlerinden gizlemek için.
+- [CSS Kapsamı](https://drafts.csswg.org/css-scoping/) -- yalnızca bileşen içindeki Gölge DOM'a etki edecek stiller tanımlamak için.
+- [Olay yeniden hedefleme](https://dom.spec.whatwg.org/#retarget) ve özel bileşenlerin geliştirmeye daha çok uyması için diğer şeyler.
 
-In the next chapter we'll go into details of "Custom Elements" -- the fundamental and well-supported feature of web components, good on its own.
+Bir sonraki bölümde, web bileşenleri için temel, iyi desteğe sahip ve kendi başına iyi bir yapıya sahip olan "Özel Elementler"in detaylarına ineceğiz.

8-web-components/index.md

@@ -1,3 +1,3 @@
-# Web components
+# Web bileşenleri
 
-Web components is a set of standards to make self-contained components: custom HTML-elements with their own properties and methods, encapsulated DOM and styles.
+Web bileşenleri, kendi içinde bir bütün oluşturan bileşenler oluşturmak için var olan bir dizi standarttır. Bunlar; kendi özelliklerine ve metotlarına sahip, DOM ve stilleri sarmalayan özel HTML elementleridir.