0:00 Herkese selamlar Bir önceki dersimizde firebase firestore dediğimiz database'e veri gönderme veri çekme silme ve update etme işlemini görmüştük Ancak orada sadece bir tane veri çektiğimiz için tüm verileri Nasıl çekip yansıtırız diye sorular geldi Bundan dolayı test test.com 1 2 3 4 5 6 diyorum şimdi biz burada Get data işlemi yaptığımızda sadece bir tane datayı set içerisine gönderiyordu Hatta daha sonrasında da biz ik tane data ya da her data geldikçe göndersin işlemi yapıyorduk ya biz bu işlemi yaptığımızda şurada durmadan eski datalar var oluyordu bu şuna sebep oluyor aslında Biz update ve Delete kısmında dataları değiştirdiğimizde ya da sildiğimizde ekranda da gelen datayı
0:47 tekrar çektiğimizde datanın güncellenmesi gerekiyor ama bu sistemde data güncellenmiyor her seferinde Arka taraftaki eski veri kalmış oluyor bu yüzden Normalde gerçek projelerde kullanacak Ken buradaki dataı farklı kullanacağız ne yapacağız biz zaten hep Sg w' try Catch kullanıyorduk bunu göstermek istiyorum try Catch imizi açıyoruz ve Şuradaki veriyi çekme işlemini tryin içerisine ekliyorum eğer hata olursa da zaten CTE Ne diyorduk consol log error yansıtsın şimdi Şuradaki kısma geldiğimizde try içerisindeki bu aşamalarda Biz bir tane tryin dışarısında function içerisinde olan const All dated gibi bir ry açalım yani gelen veriler burada for each ile
1:32 her seferinde bir veri çektiği için bütün verileri buraya içerisini Push etsin istiyoruz set data kısmını siliyorum burada allata npd ndı çalıştırıp bunun içerisine her seferinde Push ediyoruz Bu sefer de bu işlemin içerisinden çıkınca burada return All data yapsın Bunun amacı şu buradaki Database çektiğimiz verileri for each le tek tek Çekip çekip burada Push yaparak içerisini gönderiyor Daha sonrasında da trda eğer bütün veriler Başarılı bir şekilde çekildiyse All datayı return yapsın return Aslında çıktı vermek anlamına geliyor Yani bu function bitir function en son hangi veriyi gönder gönderilecek veri All data return yani All dataı gönder anlamında
2:17 böyle yaptığımızda şurada Get data dediğimizde herhangi bir veri gelmiyor Çünkü biz bir şey kaydetm Örneğin Save date diyorum Save yaptım ik kere tıkladığım için ik tane verimiz kaydoldu nereden anlıyoruz geliyoruz firebase' imize burada verilerimiz var burada Get data diyorum ekranda kaç tane verimiz yansıtılıyor o ekrana yansıtılmış olacak data mızda ama ekranda herhangi bir Get data yapamıyoruz neden set data yapmadık Yani return' çıkart dedik Ancak bunu set işlemini yapmadık return dataı set işlemi için Us eti kullanırız Örneğin gelir gelmez bu veriler bu Get dataı çalıştırsın dediğimizde onu yapabiliyoruz ama sadece şu an return yerine set dataı yapıyoruz içerisine All dataı gönderiyoruz ve ekrana yansıtılan
3:04 istiyoruz şu an Get data' mız boş Get data diyorum gördüğünüz gibi bir sürü verimiz oldu Kaç tane vardı zaten 1 2 3 4 5 tane verimiz vardı burada 5 tane de obje formatında gördüğünüz gibi objelerin bitişleri başlangıçları işte bitişleri başlangıçları şurada 5 tane verimiz olduğunu gösteriyor biz sadece iki tanesini ekrana yansıtıyordu ama Şurayı bir Aslında map olarak da kullansak daha güzel olacak ekrana yansıtırken ne yapıyorduk bir obje açıyorduk ve datayı nokta map yapıyorduk bu JavaScript tarafında anlatıldı value virgül index açıyorduk bunu bir function olarak açıp aşağıya geçiyorduk return işleminde de tekrardan burada bir text oluşturuyordu Hatta buna birden fazla veri olacağı için View diyelim
3:49 içerisinde birden fazla verimiz olsun yani datakan burada tek aşamam var 1 2 3 tane yansıtacaktır neydi value tile bunu JavaScript olarak yazıyoruz value n title aynı şekilde value content aynı şekilde value lesson olarak da yansıtma yapıyoruz ama neydi map içerisinde yansıtma yaparken Bizim burada bir key vermemiz gerekiyor Bu key olayı da aslında bunu Unique yani kendisine ait bir yapı olduğunu göstermeyi istiyoruz Çünkü bizim burada verilerimiz baktığımızda bütün verilerimiz aynı değil mi bu verilerimiz Aslında her birinin ıd'si farklı Biz burada ıd'si de tanımlayabiliriz key yerine Örneğin value nıd de
4:36 tanımlayabiliriz aslında çağrıldığı sıralama olarak da indeksi buraya verebiliriz Bu şekilde de Ekrana bir veriyi yansıtma işlemini gerçekleştirebiliyoruz Örneğin Get data dedik ekrana yansıttığımız gördüğünüz gibi kaç tane veri varsa o ekrana yansıtılıyor Hatta burada indeksini de ekran en başına yapalım text index diyoruz yani verinin 0 veri 1 veri 2 veri bilmem ne diye devam ediyor gördüğünüz gibi Hatta burada bütün verileri bir silelim delte aslında birer birer silme yerine sadece spesifik bir tanesini verdiğimiz için şu an manuel silelim Şuradaki işlemlerde bütün işlemlerimizi silelim yeniden kaydedelim Şimdi biz burada Get data yaptığımızda bu sefer gördüğünüz gibi ekranda bir şey kalmadı çünkü datam sıfır şimdi bir kere Save yapıyoruz Save yaptıktan sonra bir
5:22 datam oldu artık Get data diyoruz Ekrana yansıtıldı bir tane daha Save yapıyoruz sonra Get data diyoruz artık farkındaysanız daha güncel bir şekilde görüntülendi Ben neyi bahsetmiştim burada İlla Get data butonuna basmamı gerek yoktu Get data butonuna basacağım her seferinde Örneğin e use effecte de çağırabilir use effect dediğimiz yapıyı şurada Us state' in içerisine use effect olarak da çağıracağız ve ekranda başladığında verilerin hepsini çağırsın işlemi gibi bir şey olacaktı bu use effect çağırdım use effin içerisinde Get data işlemini çağırıyorum yani uygulama bir kere başlatıldığında veriyi otomatik olarak çeksin bakın gördüğünüz gibi Hatta şimdi uygulamayı baştan başlatıyorum yeniden bir giriş yapıyorum test et test.com 1 2 3 4 5 6 bakın
6:10 girdiğimde hiçbir şeye basmayacağım bekliyorum ve veri ekrana yıldı gördüğünüz gibi yani Şuradaki yz efekt bir şekilde ekrana tekrardan yansıtmış oldu şimdi biz bunu Aslında istediğimiz zaman tetikleyebilir değil mi bu tetikleme işleminde Nasıl bir işlem yapabiliyoruz şöyle olabilir Save yaptığımda Aslında ekranda bir tane değişiklik daha olmuyor çünkü use effect Sadece bir kere çalışıyor o yüzden mesela Get data' tekrar tıkladığımda aslında ikinci verinin eklendiğini göreceğiz diyelim ki ben savee tıkladığımda otomatik olarak tekrar databaseden veriyi çeksin istiyoruz bunun için de örneğin Save butonuna tıklandığında otomatik olarak Şuradaki use effekti harekete geçirecek bir işlem tabii olabilir Örneğin Buna da şöyle bir şey yapabiliriz bir use State işlemi yapabiliriz use State işlemine
6:56 geldiğimizde is Save diye bir yapı oluşturuyoruz buna True diyorum Örneğin Örneğin false diyorum ya da başlangıçta Şimdi burada her Save butonuna basıldığında aşağıdaki Save butonum vardı ya şu Save butonum muza basıldığında Yukarıdaki veriyi bir True yapsın bir false yapsın Aslında amacımız True ya da false olması amacı da değil buranın bir değişikliğe uğraması bu değişikliği de gelip buraya yansıtmamızı Örneğin şu şekilde bu değişiklik oluyor mu olmuyor mu diye de şunu şu şekilde gösteriyorum şu datayı yansıtmaya bırakalım kol log diyorum is Save de ekrana yansıtıyorum gördüğünüz gibi false olarak dönüyor şimdi ben Save işlemini gerçekleştirdiğim zaman aşağıya
7:41 geliyorum şurada Aslında function yapısı kurmam gerekiyor benim function yapısı kurdum artık çünkü birden fazla işlem yapacağım Send dataı çalıştır Bir de yanında hangi işlemi yap set değiştir hangisi ise onun tersine doğru değiştir yani is saved içerisindeki veri eşit eşit eşit balse ise True yap değilse false yap diyoruz aslında şu Yapı Şuradaki verimiz de gelip set is Save yaparken önce savee gidiyor buradaki veri false mu false İsa True True ise false Yani bir Lambayı yakma fonksiyonu gibi düşünebilirsiniz aç kapa aç kapa işlemi gibi Hatta burada
8:27 false var burada Save kısmında durmadan veriyi Save etmesin diye sadece şunu anlık olarak siliyorum ve şu Sistem çalışıyor mu bunu göstermek için false diyor bakın savee bastım True bastım false True false True false Aslında aç kapa işlemi yapıyoruz Bu da bizim durmadan Aslında Save butonuna basıldığını haber vermemizi sağlıyor O zaman ne yapacağız Save butonu her değiştiğinde şurası use effekti çalıştırsın anlamına geliyor Bunun içerisine bunu eklediğimizde ekrana yansıtılacak verilerimiz artacak örnek Örneğin uygulamadaki verileri silelim dokümantasyonda ekranda çok yer kaplamasın diye hepsini siliyorum ve baştan başlıyoruz Şimdi reload yaptım uygulamamı tekrardan giriş yapıyorum test test.com aşağı geliyorum 1 2 3 4 5
9:14 6 login işlemini gerçekleştirdim giriş yaptık herhangi bir datam yok o yüzden ekrana yansıtmadan yansıtıldı Neden Çünkü savee tıkladığımda otomatik olarak Get data butonuna tıklamadan bu Get data' fonksiyonunu çalıştırıyor Örneğin bir tane daha tıklıyorum ve bir tane daha veri gidiyor geliyor gördüğünüz gibi artık ekrana güncel bir şekilde hem database'e yazılan veri oluyor hem de ekranımı o databasedeki veri çekilip ekrana yansıtılmış oluyor bu şekilde istediğiniz yapıları kurup ekrana yansıtabilirsiniz bugünkü dersimiz bu kadar Bir sonraki derste görüşmek üzere
