React neyin nesi?

Üzerinde çokça çalışamama rağmen bir türlü fırsat bulup yazamadığım bir dil olan “React” ne ola ki diye soranlarınız için kısaca bir kaç bilgi vermek isterim.
React, kullanıcı arayüzleri oluşturmak için verimli ve esnek bir JavaScript kütüphanesidir. Karmaşık arayüzleri “bileşenler” (component) adı verilen küçük ve izole kod parçalarından oluşturmanızı sağlar.
React birden fazla çeşitte bileşene sahiptir. Biz önce React.Component alt sınıfı ile başlayacağız.
class ShoppingList extends React.Component {
render() {
return (
<div className="shopping-list">
<h1>Shopping List for {this.props.name}</h1>
<ul>
<li>Instagram</li>
<li>WhatsApp</li>
<li>Oculus</li>
</ul>
</div>
);
}
}
// Example usage: <ShoppingList name="Mark" />Bileşenleri ekranda ne göstermek istediğimizi söylemek için kullanıyoruz. Varolan verimizde bir değişiklik olduğunda React verimli bir şekilde güncellenip bileşenlerimizi tekrardan yorumlar.
Her bir React bileşeni kapsüllenir ve bağımsız olarak çalışabilir. Bu şekilde basit bileşenlerden karmaşık arayüzler oluşturabilirsiniz.
Burada ShoppingList bir React bileşen sınıfı ya da React bileşen tipi olarak isimlendirilir. Bir bileşen “props” (proporties kelimesinin kısaltılmış hali) olarak adlandırılan parametreler alır ve render yöntemi ile görüntülenecek bir hiyerarşi döndürür.
Render yöntemi ekranda görmek istediğimiz şeyin tasvirini(tanımını) döner. React ise tasviri alır ve sonucu gösterir. Çoğu React geliştiricisi bu yapıyı daha basit bir şekilde yazabilmek için “JSX” adındaki söz dizimini kullanır.
Uygulama yaparak daha hızlı ve daha akılda kalıcı bir şekilde öğreneceğinizi düşünüyorum. Bu nedenle bir sonraki yazımda basit bir React uygulaması yapacağım.
