React ile liste oluşturmak için farklı seçenekler bulunur. Bunlar arasında bilenen Html listeleme etiketleri (ul, ol) olduğu gibi farklı olarak DIV etiketi ile de bir liste oluşturulabilir.. Html Etiketleri İle Sabit Bir Liste Oluşturma Bu yöntem Html ile oluşturulan listeleme ile aynı şeklidedir. Yapılması gereken hangi liste türünün seçileceğine karar vermek ve sonrasında listeyi oluşturmaktır. […]
Tablolar veri sunumu için harika seçeneklerdir. Farklı verileri bir arada göstermek için iyi bir seçenek olarak karşımıza çıkar. Html ile tablo oluşturmak için table etiketini kullanıyoruz. Bu etiket bir çok alt etiket ile birlikte tablo oluşturmak için kullanılır. Bu yazıyı okuyorsanız bu sizin HTML TABLE etiketini ve Html ile tablo oluşturmayı bildiğinizi gösterir. Yada en azından konu hakkında bilginiz
Döngü belirli bir işlemin defalarca yapılması için kullanılan yapıya denir. Program yazılırken en çok kullanılan yapılardandır. Belirli bir dizinin ( mesela renklerin bulunduğu bir dizi) içerisindeki tüm elemanlar için aynı işlemlerin yapılması gerektiği durumlarda kullanılabilir. Döngüler (loops) genel olarak iki şekilde çalışır. Dizi İçerisindeki Tüm Elemanları Gezen Döngüler Kaç döngü yapılacağı belli olmayan ve bir
Öncelikle UUID nasıl oluşturulur konusuna geçmeden kısaca UUID nedir ve neden kullanılır sorusuna bir cevap arayalım. UUID Nedir? UUID (universally unique identifier) 32 karakter boyutunda 16 bayt boyutunda benzersiz bir tanımlayıcıdır. Özellikle veri tabanları gibi uygulamalarda veri oluştururken benzersiz bir tanımlayıcı (ID) oluşturmak için kullanılır. Çokca kullanılan tamsayı (int) tabanlı ID tanımlamaları yerine kullanılmaktadır. Tamamen
React sayfalar arası geçiş için farklı route paketleri kullanır. Bunlardan en çok tercih edileni React Router Dom paketidir. Normal websiteleri sayfalar arasında A Etiketini kullanarak geçiş yaparlar. Tek sayfa uygulamalarda bu istenmeyen bir durumdur. Çünkü A etiketi kullanıldığında sayfa yeniden yüklenir. Bu nedenle farklı sayfalar arasında geçiş yapılmasını ve bu işlem süresince sayfanın yeniden yüklenmesini önlemek
React ile uygulama geliştirirken JSX içerisinde for döngüsü kullanamayız. Bunun anlamı for dögüsüne her ihtiyacımız olduğunda JSX içerisinde çağıramayız demektir. Bununla birlikte farklı yöntemler ile bu işlemi yapabiliriz. Şimdi hatalı bir örnek kullanımı görelim. Örneğimizde sayfaya bir liste bastırmaya çalışacağız. Örneğimizi çalıştırdığımızda benzeri bir hata alacağız. Bu React JS içerisindeki döngü kullanımına getirilen sınırlamalardan gelir. JSX içerisinde direkt olarak for döngüsünü kullanamayız.
Javascript forEach metodu dizinin tüm elemanları için verilen bir fonksiyonu çalıştırmak için kullanılır. Bunun anlamı, callback olarak fonksiyon dizinin her bir elemanı için ayrı ayrı çalışacaktır. Javascript forEach kullanımı oldukça kolay bir metoddur. Verilen fonksiyonu tüm dizi değerleri için çalıştırır. JavaScript Array forEach Metodu Nasıl Kullanılır? yazımızda forEach metodunun ayrıntılı incelemesini bulabilirsiniz. forEach metodunu kısaca tanıdığımıza göre şimdi
Graphql ile çalışırken doğal olarak veriler ile çalışıyoruz. Veriler ise farklı tiplerde olabilir. Graphql ile API geliştirirken kullanılan temel veri tipleri String, Int, Float, Boolean ve ID şeklindedir. Graphql Temel Veri Tipleri Şimdi yukarıda saydığımız temel (scalar) veri tiplerini inceleyelim. Metin / String Temel metin bilgilerini tutmak için kullanılır. Herhangi bir karakterden uzun bir paragrafa
Node JS yapısı itibari ile bir Javascript çalıştırma ortamıdır. Javascript dosyalarını çalıştırmak için geliştirilmiştir. Google V8 Javascript motoru üzerine geliştirilmiştir. Bilindiği gibi Javascript yorumlanan bir dildir ve bir Javascript motoru üzerinde çalışmak zorundadır. Günümüzde bir çok Javascript motoru bulunmaktadır. Javascript uygulamaları ilk çıktığında sadece tarayıcılar (browser) üzerinde çalıştırılıyordu. Tarayıcılar üzerlerinde bulunan Javascript motorları sayesinde web
Özellikle React kullanmaya yeni başlayanlar için bu üç kavramın oturması biraz zaman alabilir. Aslında bu üç kavram da, state, context, props, React JS üzerinde değişkenleri tutmak için kullanılır. Fakat kendi aralarında özellikle kullanım alanları ve şekilleri açısından farklılıklar vardır. Ve özellikle de değişken kapsamı (geçerli olduğu alan) oldukça farklıdır. Şimdi kısaca bu terimleri ne olduğuna bakalım ve sonra
React ile sayfa yönlendirmek için React Router Dom Navigate komponentini kullanıyoruz. Navigate istenilen bir sayfaya kolayca yönlendirme yapmak için kullanılmaktadır. Navigate Nedir? Navigate render edildiğinde kendisine belirtilen konuma yönledirme yapmak için kullanılan bir React Router Dom komponentidir. React Router Nedir? Nasıl Kullanılır? yazımızda bu paketi ayrıntılı inceleyebilirsiniz. React Router Navigate Kullanımı Navigate komponentinin söz dizimi
Javascript dizilerin başına eleman eklemek için unshift metodunu sunar. Unshift aldığı elemanları dizin baş tarafına ekler. Şimdi bunu örnekler ile açıklayalım. Javascript Array unshift Metdodu Bir dizin başına yeni bir eleman eklemek için kullanılan Javascript Array metodudur. Yazım şekli şeklindedir. Dizinin başına eklenmesi istenilen elemanlar aralarına virgül koyularak tek tek eklenir. Dizinin Başına Eleman Ekleme İlk olarak
React … operatörü nesne ve dizili elemanlarını ayrıştırmak için kullanılan bir Javascript operatörüdür. ES6 ile hayatımıza girmiştir. Bir çok işlemin oldukça kolay bir şekilde halledilmesi için kullanılır. Spread operatörü olarak isimlendirilir. Yazılım Şekli Spread operatörü aşağıdaki gibi kullanılır. Şimdi bu işlemleri tek tek inceleyelim. Javascript Spread Operatörü İle Fonksiyona Parametre Verme Elimizde bir fonksiyon olduğunu düşünelim ve
Javascript farklı alanlarda uygulama geliştirmek için kullanılan bir programlama dilidir. Betik tabanlı bir dildir. Yorumlayıcı üzerinde çalışır, ilk çıktığı günlerin aksine sadece tarayıcı (browser) üzerinde çalışmaz, ayrıca farklı Javascript motorları üzerinde çalışabilir. Farklı alanlarda kullanılabilen bir dildir. İlk çıktığında web sayfalarını etkinleştirmek, onlara hareket katmak amacı ile geliştirilmiştir. Bu nedenle ilk yıllarında sadece tarayıcılar üzerinde
GraphQL şeması (schema) bir GraphQL API’sinde istenilen verilerin açıklamasıdır. Ayrıca veri ekleme, düzenleme ve silme gibi işlemler için gerekli tanımlamaları yapar. API üzerinde kullanılacak veri türlerini tanımlandığı yer olan şema, ayrıca veriler üzerinde işlem yapmak için gerekli olan metodları (mutation) ve API üzerinden bilgileri almak için gerekli sorguların (query) tanımlandığı bir şemadır. Farklı programlama dillerinde