Şimdiye kadar verilerimizi oluşturduğumuz veri dizinlerinden export ederek elde ettik. Uygulamalarımızda çoğu zaman verilerimizi bir internal veya external API’lere çağrıda bulunarak elde etmemiz gerekecek. Bunu native olan Fetch fonksiyonu ile de yapabiliriz fakat biz bu bölümümüzde web servis isteklerinde çoğu zaman kullanılan “axios” modülünü import ederek kullanacağız.
Axios, promise tabanlı ve ayrıca bizlere async-await yapısını da kullanabilme olanağı sunan bir HTTP istemcisidir.
Programlarımızı yazarken çoğu zaman çoklu parametrelerle uğraşmışızdır. Parametre sayılarımız kimi zaman bizim belirlediğimiz sayıda olurken kimi zaman da bir değişkene veya özel bir duruma bağlı olarak değişken sayıda ve belirsiz olabilir. Bu gibi durumlarda kullandığımız yazılım dilinin desteklediği standartlara göre en optimum ve kısa yolla istediğimiz kodu yazmaya çalışırız. Ecmascript 6 ile sunulan “Spread Operator” ve “Rest Parameters” kavramları, tam da bu durumlarda bizlere çok büyük kolaylıklar sağlıyor.
Android uygulamalarında ekranlarda kullandığımız bileşenlerin yerleşim düzeni ve ekran tasarımları Layout sınıfları tarafından sağlanır. res klasoru altında tanımlanan layout dosyaları XML formatındadır ve içerisinde Android bileşenlerine özel etiketler sayesinde farklı özellikler belirtilir.
Bütün layout sınıfları kendisi de View‘dan türeyen View Group sınıfıdan türemiştir ve layoutlara yükseklik ve genişlik değerleri atamaları zorunludur.
Activity sınıfından türettiğimiz her bir nesne, uygulamalarımızı geliştirirken tasarladığımız kullanıcı arayüzlerini yani sayfaları temsil etmektedir. Oluşturduğumuz her bir sayfanın kullanıcı ile gerçekleştirdiği etkileşimler Activity sınıfı sayesinde gerçekleştirilir. Oluşturacağımız her bir activity bir arayüzünden sorumludur ve mutlaka AndroidManifest.xml dosyasında tanımlanması gerekmektedir. Tanımlanmadığı taktirde activity ile karşılaşılan ilk anda uygulamanın yürütümü sonlandırılır.
React Native uygulamalarımızda listeleme veya sıralama işlemi yapılacağı zaman akla ilk gelen ve kullanılan bileşen FlatList’tir. FlatList diğer bir tercih olan ListView’e göre daha hızlı ve performanslı çalışması nedediyle tercih sebebi olmuştur. Bu yazımızda FlatList kullanımını inceleyeceğiz.
Bu yazımızda React Native tarafında “Event” kavramı yani olay yönetimi nasıl gerçekleştiriliyor, ardından da “State” kavramı ve kullanımına değineceğiz.
Bildiğimiz üzere “Event” HTML tarafında elementlerde gerçekleşen durumlardır. Bu olaylar kullanıcı yani bizler tarafından tetikleneceği gibi tarayıcı tarafından da tetiklenebilir. Butona tıklanılması durumda gerçekleşen onclick, elementlerde değişiklik olduğunda gerçekleşen onchange, klavyeden herhangi bir tuşa basılması durumunda gerçekleşen onkeydown bu olaylara başlıca örnek olarak verilebilir.
“Props” kavramı tahmin edileceği üzere “Property” (Özellik) kelimesinin kısaltılmasından meydana gelir. Bizler oluşturduğumuz bileşenlere bir özellik kazandırmak istediğimizde, bu propslar aracılığı ile inputlar girerek belirtilen değerlerin render edilebilmesini sağlayabiliriz.
Bizler Component kavramı sayesinde kendi özel sınıflarımızı oluşturup bunları istedğimiz zaman çağırıp render edebiliyorduk. Şimdi de oluşturduğumuz bu bileşenlere özellik atamalarının nasıl olduğunu göreceğiz.
Türkçe karşılığı “bileşen” olan “component” React ailesinin en temel yapı taşıdır. Component özünde bir Javascript sınıfıdır ve bizim isteklerimiz ve girdilerimiz sonucunda bizlere UI’ın (Kullanıcı Arayüzü) nasıl ve ne şekilde gözükmesini açıklayan bir React ögesi döndürür. Componentlar bizlere asıl olarak bir işlevi veya ögeyi döndürmesi için yazılan bir kodun; farklı zamanda ve farklı yerlerde yeniden çağırılarak kod kalabalığından kaçınma olanağı, kolaylık ve işlevsellik sağlar.
Component mantığını daha iyi anlamak açısından basitçe; işlevi “h1” etiketi içerisinde bir metin ifadesi döndüren fonksiyonel bir component ifadesi yazalım:
Bir önceki yazımızda ES6 ile beraber gelen Class kavramından bahsetmiş ve sınıflardan ürettiğimiz nesneler ile içerisine yazdığımız yardımcı metotlara ulaşabildiğimizi görmüştük. Bu yazımızda static metotlara ve kalıtım kavramına değineceğiz.
Nesneye dayalı programlama dillerinden de aşina olduğumuz class kavramı artık Ecmascript6 ile birlikte javacript tarafında daha kolay ve okunaklı bir yapı sunuyor. ES6 öncesi standartlarda bir nesne üretmek istediğimiz zaman constructor fonksiyonları oluşturuyorduk. Bu oluşturduğumuz objelerden kalıtım yolu ile yeni objeler oluşturmak istediğimiz zaman ise prototype metotlarından yararlanıyorduk. ES6 class kavramı bizlere OOP presiplerini daha verimli ve kolay bir şekilde kullanma olanağı sunuyor.
ES6 class kavramına geçmeden, önceki standartlarda yeni bir obje üretmek için neler yapıyoduk inceleyelim:
Update your browser to view this website correctly. Update my browser now