Firestore Database Veri Ekleme, Okuma, Çıkarma ve Güncelleme - Ders-12 - React Native Eğitimleri

Kısa Özet

Bu video, Firebase Firestore veritabanını kullanarak veri gönderme, çekme, silme ve güncelleme işlemlerinin nasıl yapılacağını anlatıyor. İlk olarak, Firestore veritabanının kurulumu ve konfigürasyonu açıklanıyor. Ardından, veri ekleme, okuma, silme ve güncelleme işlemleri için gerekli kod örnekleri ve açıklamalar sunuluyor.

  • Firebase Firestore kurulumu ve konfigürasyonu
  • Veri ekleme, okuma, silme ve güncelleme işlemleri
  • React Native uygulamasında Firebase Firestore kullanımı

Firebase Firestore Kurulumu ve Konfigürasyonu

Firebase projesinde Firestore veritabanını etkinleştirmek için Firebase konsolunda "Firestore Database" bölümüne gidilir ve "Create Database" butonuna tıklanır. Veritabanı lokasyonu seçilirken, kullanıcıların çoğunlukla bulunduğu bölgeye yakın bir lokasyon seçmek önemlidir. Bu, verilere daha hızlı erişilmesini sağlar. Ücretsiz kullanım sınırları aşıldığında ücretlendirme başlayacağı için bölge seçimine dikkat etmek gerekir. Test modunda başlanıp daha sonra production moda geçilebilir.

Firebase Config Dosyasına Firestore Entegrasyonu

Firebase config dosyasına Firestore'u entegre etmek için getFirestore fonksiyonu kullanılır. Bu fonksiyon, Firebase uygulamasını Firestore'a bağlar. getFirestore fonksiyonu import edildikten sonra, firebaseConfig dosyasına eklenir ve export edilir. Böylece, uygulamanın diğer bölümlerinde Firestore'a erişilebilir.

Firestore'a Veri Ekleme

Firestore'a veri eklemek için addDoc fonksiyonu kullanılır. Bu fonksiyon, bir koleksiyon (collection) ve bir doküman (document) oluşturarak veriyi Firestore'a kaydeder. Koleksiyon, verilerin gruplandırıldığı bir yapıdır. Doküman ise, koleksiyon içinde saklanan bir veri kümesidir. addDoc fonksiyonu, asenkron bir işlemdir, bu nedenle async/await yapısı ile birlikte kullanılır. Veri ekleme işlemi başarılı olduğunda, dokümanın ID'si konsola yazdırılır.

Firestore'dan Veri Okuma

Firestore'dan veri okumak için getDocs fonksiyonu kullanılır. Bu fonksiyon, bir koleksiyondaki tüm dokümanları getirir. getDocs fonksiyonu, asenkron bir işlemdir, bu nedenle async/await yapısı ile birlikte kullanılır. Veri okuma işlemi başarılı olduğunda, dokümanlar bir dizi (array) olarak döndürülür. Bu dizideki her bir eleman, bir dokümanı temsil eder. Okunan veriler, useState hook'u ile lokal bir state'e kaydedilir ve ekranda görüntülenir.

Firestore'dan Veri Silme

Firestore'dan veri silmek için deleteDoc fonksiyonu kullanılır. Bu fonksiyon, bir dokümanın ID'sini alarak Firestore'dan siler. deleteDoc fonksiyonu, asenkron bir işlemdir, bu nedenle async/await yapısı ile birlikte kullanılır. Veri silme işlemi başarılı olduğunda, herhangi bir çıktı verilmez. Verinin silindiğini doğrulamak için Firestore konsolundan kontrol edilebilir.

Firestore'da Veri Güncelleme

Firestore'da veri güncellemek için updateDoc fonksiyonu kullanılır. Bu fonksiyon, bir dokümanın ID'sini ve güncellenecek alanları alarak Firestore'daki veriyi günceller. updateDoc fonksiyonu, asenkron bir işlemdir, bu nedenle async/await yapısı ile birlikte kullanılır. Veri güncelleme işlemi başarılı olduğunda, herhangi bir çıktı verilmez. Verinin güncellendiğini doğrulamak için Firestore konsolundan kontrol edilebilir.

Summarize any YouTube video in seconds

Get summaries like this one for any video, in your language, with the free Summ app.

Download on the Apple Store
Get it on Google Play

Transkript

YouTube Transcript Generator

0:00 Herkese selamlar son kaldığımız derste Fire base'e bağladığımızda burada test @ test.com yazıp şifremizi yazdığımızda giriş yapabilmeyi görmüştük loading sonra da homepage yükleniyordu ve burada da token' dan bahsetmiştik daha öncesinde token mız geliyordu Bugün artık Fire base'e bir veri gönderme veri çekme bu veriyi silme gibi işlemleri yapacağız hadi başlayalım gördüğünüz gibi firebase sayfamızda Burada sadece authentication taraf ız var ancak biz burada ne yapacağız firebase firestore database' kullanacağız Real Time Database değil firestore Database kullanacağız bunun için buraya tıkladıktan sonra ekran gelecek ve bunu bir setup işlemini gerçekleştireceğiz create Database diyoruz burada

0:46 seçeceğiniz lokasyon daha çok kullanıcının hangi tarafta olduğunu belirlemenizi sağlıyor Örneğin Türkiye'den daha çok kullanıcı alacaksanız burayı Amerika yerine işte Europe ya da daha yakın bölgeler yapabilirsiniz bunlar için Tabii ki ayrı bir ücretlendirme var belirli bir seviyeden sonrası için Bundan dolayı bunlara dikkat edebilirsiniz komple bir bölge seçtiğinizde Örneğin Europe ya da United States seçtiğinizde şehir değil de bunları seçtiğinizde bunların ücretleri daha yüksek oluyor Hatta Fire Store cost diye de bakabiliriz burada şurası belirli bir seviyeye kadar olmadığını Daha sonrasında ise başladığını göreceksiniz Cloud firestore burada belli bir seviye dediğimiz bu kadar bunlardan sonrasında Google Cloud

1:32 pricing tarafına geçip buradaki ücretleri görebiliyoruz bakın burada bölge seçerek Şuradaki fiyatlara bakabilirsiniz yani free 50.000 doküman okumasından sonra her 100.000 doküman okumasına bu kadar fiyatlandırma veriliyor Tayvan tarafından geçiyoruz bu tarafta Bize en yakın olan Türkiye için düşündüğümüzde İsviçre diye biliyordum Ben züg tarafında baktığımızda bu yine çok yüksek oluyor Frankfurt'a baktığımızda baktığınızda daha düşük bir rakamla karşılaşmış oluyorsunuz Bunlar şimdi çok düşük gibi gelebilir Ancak işler büyüdüğünde sizin için daha sıkıcı bir hal alabilir Bundan dolayı Örneğin bir Europe diye seçelim bakın 39 Ken europea direkt 0.6 ya gidiyor Bundan

2:17 dolayı bütün bölgeyi seçelim Hani her şey daha iyi olsun gibisinden düşünmeyin Sadece size yakın olan bölge verilerin daha hızlı size ulaşmasını ya da kullanıcıya ulaşmasını sağlayacaktır Bundan dolayı da dikkat etmek gerekiyor diyelim ki biz Europe yerine Burada en yakın Frankfurt tarafından işlem yapacağız bu kadarlık bir ücretlendirme ile de devam edeceğiz O yüzden biz şurada seçerken Frankfurt tarafını seçeceğiz burası burada da bahsettiği gibi seçtikten sonra daha sonra bölgeyi değiştiremiyorsan ve devam diyoruz burada production mod Bir de test mod var yani test modda her şey serbest gördüğünüz gibi belirli bir tarihe kadar production modda da burası sadece kullanıcı giri yapabildi diye bir seçenek sunabiliyoruz

3:03 Ondan sonrasında artık giriş yapabiliyor bu aşamayı Daha sonrasında artık Daha gelişmiş bölümleri çektiğimde anlatacağım size nasıl kullanıcının giriş yaptığında buraya özel bir kural yazıyoruz yani if out eş onaylandı İsa gibi trysa gibi düşünebilirsiniz Ancak şu an hepsi serbest olsun ki direkt doküman yazıp çekmeyi yapabiliyoruz bu bu adımları değiştirebiliyoruz Yani bu test moden production moda kolaylıkla geç biliyoruz database' imiz hazırlanırken burada dokümantasyon gidelim firebase Fire Store Cloud firestore burada ne yapıyorduk Biz daha öncesinde geliyoruz getting started zaten biz firebase' yüklediğimiz için tekrardan bunu yüklememiz gerek yok firebase' içerisindeki firestore tarafını kullanacağız Evet database'

3:49 imiz de hazır artık burada Collection oluşturabiliyor Bunlar manuel olarak da ele girilebiliyor ancak elle Tabii ki girilmeyecek hatta elle müdahale ettiğinizde Muhtemelen çok sorun yaşayacaksınız dır Çünkü ufacık bir hata yaptığınızda kurallar değişecek daha önceki dediğim o Rules kısmı vardı ya Daha sonrasında production moda nasıl çeviririz test moddan diye Şuradaki kuralı değiştirebiliyoruz bu kuralı değiştirdikten sonra da artık production tarafında da kullanabiliyoruz burada da usage değerlerimiz var ne kadar çekildi ne kadar kullanıldı request sayısı ne kadar Burası açık kalsın bunu kullanacağız şimdi geldiğimizde firebase firestore tarafında burada Get Fire Store olayımız var yani daha öncesinde firebase config sayfası içerisinde hazırladığımız sadece bir Database ekleme işlemi yapacağız biz neredeyiz firebase config içerisindeyiz Burada

4:35 sadece authentication yapmıştık hatırlıyorsanız Bir de bunun içerisine database'e ekleyeceğiz Biz burada belirttiği gibi devam ediyoruz Get firestore kısmını buradan alıyoruz Ve getirip burada import ettiklerimizin arasına dahil ediyoruz Get fir Store'u dahil ettikten sonra yapacağımız işlem hemen bir sonraki aşağıda yazıyor Ne diyor buradaki Get F store'un içerisine app'i koyup buradan gönderebiliyoruz burada app' imiz vardı Yani direkt firebase' bağlanıyordu firebase' bağlanan uygulamamızı autonation kullanmıştık Şimdi de burada database'e kullanıyoruz Get F Store'u çalıştırıp app' bağlıyoruz Ancak bunu da bir çıktı vermemiz lazım ki kullanacağımız yerde çağıralım O yüzden bunu da export const Database olarak da

5:21 çağırabilir devam edilecektir bu aşamayı yaptıktan sonra Aşağıya geçiyorum nasıl data ekleriz nasıl data ekleyeceğimiz burada bize önce bir Collection oluşturarak Yani bir datanın genel hali gibi düşünebilirsiniz belge ismi ya da klasör ismi gibi de düşünebilirsiniz onu oluşturduktan sonra da direkt datayı ekliyoruz burada belirtilen database'e users isimde bir Collection oluşturulacak Collection dediğimizde Şuradaki Collection bunun altında çıkacak verileri Burada sadece isimlendiriliyor gibi düşünebilirsiniz geldiğimizde burada As ait olaylar mız var Biz Ne diyorduk Asenkron yapılar yani gelmesi için belirli bir süre geçmesi gereki Bu arada da uygulamaya bastığımızda onu beklemesi gerekiyor Yoksa bütün kodları bir anda çalıştırıyor Bu da gelene kadar hata

6:06 veriyor O yüzden biz hata vermesin diye try try Catch ve Şuradaki ait olayımız çalıştırmak zorundayız bu verdiği gibi kullanamıyoruz maalesef sadece temel mantığı anlatıyor Biz bunu function içerisinde kullanacağız users isimli bir function users isimli bir Collection oluşturuyoruz ve içerisinde obje halinde Şuradaki obje halinde bir veriyi gönderiyoruz işte ismi soyismi ve kaç yılında doğdu gibi böyle bir veri eklemişler bunu da ekliyoruz Daha sonrasında eklendi isse Eğer burada yazıldı diye dokümanın ıd'si kendisi otomatik bir ID oluşturuyor ve çıktı veriyor yoksa da hatayla ilgileniyoruz hemen ADD kısmını bu tarafta yapalım hemen bir uygulamamıza girelim test test.com 1 2 3 4 5 6 girişimiz

6:54 yaptık burada giriş yaptıktan sonra hom page' geliyorum Şimdilik geçici olarak hte veri göndereceğiz Daha sonrasında bunu redoxa çekeceğiz burada oluşturmamız gereken yapılar buradaki ilk fir Store'daki kısmı almak olacak Buradaki kısmı aldık Collection ADD document olarak da aldık Sonra aşağıya geçtiğimizde farkındaysanız burada DB yani Database eklememiz gerekiyor Hangi Database bizim burada firebase config içerisinde export yaptığımız Database Biz bunu da buraya import etmemiz lazım import DB diyorum zaten kendisi firebase config içerisinde getirmemiz gerektiğini de Şimdi biz şu yapıyı alacağız Ama bunu bir function çalıştırmamız gerekiyor Bundan dolayı buraya geliyoruz aşağıya con diyoruz Send data diye bir function

7:39 oluşturuyoruz ve ve yapısını kuruyoruz Daha sonrasında da Arrow function' mızı açtıktan sonra kopyaladığımız kodları Buraya yapıştırıyoruz şimdi zaten in burada evlerimiz burada ve try C olayı da yapmak zorundayız Tabii ki burada Database users isimli bir Collection oluşturuluyor users burada da bilgileri var Mesela biz buna users diye girmeyelim Örneğin react react native lesson diyelim şu şekilde react native dersleri olarak da düşünebilirsiniz title olarak Zero to Hero diye genelde em de görürsünüz başlangıçtan ileri seviyeye kadar eğitimlerde böyle derler title olarak bunu dedik content olarak da şöyle bir şey diyoruz content yani içerik olarak diyoruz bunların verilen

8:24 verileri değiştiriyorum Çünkü birebir dökümantasyondan kullandığınızda farklı bir şey yap çalıştığınızda Kafanız karışıyor Bundan dolayı da diyoruz işte react native tutorial for beginner başlangıç seviyesinde olanlar için react native dersleri toplam kaç tane ders var diyelim toplam kaç tane dersimiz var Bunun içerisinde diyelim ki 100 adet videomuz var ya da 95 diyelim küsür rakamlarda gitsin böyle bir veri göndereceğiz biz bu datayı çektiğimizde olacak Biz daha öncesinde butonlar yapmıştık login piz hatırlıyorsanız nerede login page' imizde bu tarafta aşağıya geldiğimizde işte loading Custom buton yapmıştık Mesela nerede kullanacağız Custom butonu bu sefer bir daha kullanabiliyoruz Custom butonu çeker çekmez aynında kullanacağız işte

9:10 yeniden bir buton oluşturmaktan reusable tekrar tekrar kullanılan komponentler oluşturmak çok kolay olabiliyor Custom butonu çağıracağız hepsini kapatıyorum şimdi Home page' kalmamız gerekiyor bizim Kafanız karışmasın Şunların hepsini Kapattım şimdi import Custom buton importu yaptım şur fazlalık kaldı Custom butonu import yaptım Bunun içerisine Home page'in altına Custom butonu import ettim ama Custom butonu mu bir şeylere ihtiyacı vardı değil mi Bunlar nelerdi Custom butona buradaki props lı göndermemiz gerekiyor Örneğin buton text buton texi alıyorum ve diyorum ki buton text Save diyorum datayı Save edeceğiz O yüzden şurada Hatta beyaz bir şekilde de çıktı bizim bu kteer

9:56 yapımızda background daha ekranda görünür bir hale getirebiliriz Save diye bir butonum var burada aslında bir de butonda set with olayımız var Kaç yapacağız burayı diye buna 40 yüzde demek istiyorum buton Color alıyorum Blue diyoruz gördüğünüz gibi butonum ortaya çıktı sonrasında Press buton Color tıklandığında hangi renk olsun Grey olsun tıklandığında gördüğünüz gibi oldu Yani tekrardan tekrar bu kodları yazmak yerine baştan yapmış oluyoruz handle Oni de buraya dahil ediyoruz handle on press'in içerisinde de neyi dahil ediyorduk buradaki function mız vardı yani bunu çalıştırsın istiyoruz zaten Custom butonda da şu oluyor Custom buton içerisinde bu function bir işlem

10:41 yapmıyor diyor ki Custom butona tıklandığında main Component git bu onpress yazısının handle onpress yazısının içerisindeki function neyse git onu çalıştır diyor burada handle on press'in içerisinde Send data function mız var bunu çalıştır diyor burada datam hazır bunu göndereceğiz bakalım BIM çalışacak mı Save diyorum ve aşağıda konsol log olarak şurada bir çıktı veriyor olması lazım Save dedik bekledik ve döküman yazıldı ıd'si de bu diyor hemen firebase' imize bakalım yazıldı mı burada ekranı yeniliyoruz gördüğünüz gibi burada react native lesson isimli bir collection' mız oluşturuldu otomatik atanılan bir ID ile aşağıdaki veriler tamamlanmış oldu bakın artık veriyi gönderebiliriz veriyi silebiliriz artık Manipüle edebiliriz istediğimiz gibi

11:28 hemen onu da deneyelim read data read data kısmında da örneğin bu kısmı kullanacağız bu kısımda gönderilen verileri çekme aşamasındayız artık ancak burada fark ettiyseniz User diyor User bu kısımda Hani database'e birçok verimiz olabilir şurada react native listing gibi aşağıda yüzlerce verimiz olabilir bu yüzden react native lesson de gönderdiğimizi direkt buradaki users yerini kullanmamız gerekiyor Bu yüzden Collection Bir De get Doc olayımız var Get dox olayımız da yukarıda import ediyoruz yani veriyi kaydediyor Get ile de veriyi çekiyoruz Get dox olayımız da Hallettik burada bir function kuracağız ve bu function içerisinde şu yapıyı da çağırmış olacağız tekrar bir function kuruyorum Hatta şuraya yorum satırını ekliyorum diyorum ki e Send data to firebase datayı Fire

12:17 base'e gönder burada da yorum satırı ekliyorum Get data from firebase const diyorum bu sefer de Send data yerine Get data diye bir function oluşturuyorum burada inn yapımı tabii kuruyorum Arrow function da açtım Arrow function açtıktan sonra aldığım kodları da buraya yapıştırıyorum nereden almıştık bu kodları direkt buradaki şu kısmı kopyalamış Biz bunu da bu tarafa yapıştırdık şimdi farkındaysanız şu kısmı biraz yapalım function içerisinde şöyle bir yapımız var ESS yapımız Burada aate yapımız burada ve çalıştırdığında veriyi getiriyor olması gerekiyor şimdi veriyi getirdiği zaman ne yapıyor burada konsol loga çıktı veriyor Hatta bu alacağımız verinin adı da buydu db' den bunu getirdik buraya Eğer gelecekse bir

13:04 buton atlayalım bir butona da bunu tekrardan atlayalım Örneğin hemen butonum u aşağıdak inden kopyalayın bir tane daha buton getirdik ve bu butonun adı ne olsun Get data olsun data gelir gelmez aşağıda yansıtılması gerekiyor Bu şekilde bir işlem olacak ama burada Send data yerine Get data function' mız çalışsın Şuradaki function' mız çalışıyor şimdi tıkladığımızda çalışacak mı bakalım çıkarsa aşağıda böyle verilerimiz gözükecek çalıştırdım bekliyoruz obje olarak verilerimiz gelmiş oldu burada hemen react' içerisinde virgül diyoruz ve parantez açıp Us State yapımızı kuruyoruz Bu neydi lokal olarak veriyi tutmamızı sağlıyordu hemen Us State yapımızı da otomatik olarak kursun diye snip açıyoruz ve Diyoruz ki data zaten set data dedi burada verilerimiz de burada

13:51 verimiz bir obje olarak geliyor ya Biz burayı direkt Eray olarak set edelim Şimdi biz burada Bunu kaydettikten sonra doc dataı konsol lck olarak çıktı veriyorduk bunu yorum satırını alıp setdata Doc ndı gönderiyoruz yani dokümantasyonda gelen datayı çalıştırıp hazır bir şekilde kullanıp gönderiyoruz Burada da set DT konsol log yaptığımızda data n title dediğimizde bakın Şuradaki title alabiliyoruz ya da datayı komple ekrana yansıttığımız Bu şekilde bir obje yansıtılıyor nasıl öğreniyoruz şurada başında bir boşluk bırakıp type of diyoruz yani datanın type tipini söylüyor bize obje formatında geldiğini söylüyor obje formatı dediği için ekrana yansıtmada sadece isimlerini söylememiz yeterli olacak Örneğin aşağıya geliyoruz bir tane text açıyoruz ve Diyoruz ki text kısmında yukarıda data use state'

14:40 imiz vardı nokta title' ekrana yansıtıyorum Zero to Hero şimdi bunun gibi diğer değerleri de kullanabiliriz content lesson kısmını ekrana yansıt alım Örneğin content lesson Home page' kaldırıyorum ekrana bunları yansıtabilir Örneğin bir veri daha gönderelim Biz veriyi gönderdik database' imize geldik aslında aynı veriden iki tane oldu gördüğünüz gibi bu sefer de get data diyorum ekranda Aslında bakarsınız hala yansıtılan bir tane oluyor şimdi Get data yaptığımızda gördüğünüz gibi sadece buradaki bir objeyi çağırıyor ve yukarıda Aslında biz arey oluşturmuştur tek bir data ekrana yansıtıyor Bundan dolayı bizim yapmamız gereken şey şurada set data yapısını

15:25 değiştirmek yani buradaki ğin içerisine set data ile bir tane veri gönderiyoruz biz buraya bir tane veri göndermek istemiyoruz bütün verileri buraya set etmek istiyoruz o yüzden zaten data' mız bir Ray formatında Ray formatı içerisine almış bulunuyoruz şu anda bu Ray formatı içerisinde şu kısmı gördüğünüz şurası artık erey oldu bakın şuraya ayırayım Burası bir erey oldu bu da içerisine sadece bir dokümantasyon olarak geldi ama daha önceki veriler de silinmesin diyorsam Yukarıdaki daha önceki verileri Bar dataı buraya dahil ediyorum nasıl 3 nokta koyuyorum data diyorum virgül koyuyorum yani burada daha önceki veriler Dursun bunu da sonuna ekle anlamına geliyor o yüzden şuraya bakın sadece bir veri gelirken bir tane daha

16:11 Get data yapıyorum bakın bir tane verimiz vardı komple silip uygulamayı başlatıp tekrardan ne yaptım İlk verimiz artık bir ğin içerisine çektim sonra bir tane daha çekiyoruz Burada gördüğünüz gibi artık veri ik tane oldu data içerisinde şurası başlangıcı şurası bitişi ğin başlangıcı içerisinde ne var virgülü görüyorsunuz ve komple bir obj demiz var bir obje daha var içerisinde bu değişik olabilir ama biz aynı veriyi gönderdiğimiz için aynı veriden iki tane geldi bu nereden geldi buradaki iki tane verimiz geldi yani artık bir sürü verimiz olduğunda Burada bir sürü veri çekebiliriz çektikten sonra Aslında biz ekrana yansıtıyordu değil mi ekrana yansıtırken artık bu yolu kullanmıyoruz Çünkü data içerisinde direkt tek bir veri yok data içerisinde 1 2 diye

16:56 verilerimiz var Örneğin datanın 0 verisinde title deseydik ekrana yansıyacaktır bu şekilde kullanılabilir yukarıda kullanacaksınız bir değişken atayıp buraya yansıtabilirsiniz bunun mesela aynısını ikinci Veri olarak da kullanabiliriz Şuradaki kısımları da 1 diye değiştirelim Aslında ve 2 tane verimiz vardı ik tane veriyi de ekrana yansıtmış olduk bunu bir map döngüsüyle yapabiliriz javascript'te görmüştük Daha sonrasında geldiğimizde firebase doküman kısmında gördüğünüz gibi Aslında şurada nasıl değişir diyordum ya ben request out n değilse request n değilse bunu bu şekilde yapıyorduk Hatta şu kısmı alıp getirip sizin projenizi Şuradaki Rules kısmı var ya bu kısmı değiştirerek de kullanabiliyorsunuz şu kısımda request

17:42 Time kısmı vardı if kısmından sonraki alıp if kısmında request out yaptığınızda bu artık production moda geçmiş olacaktır Burada gördüğünüz gibi bu aşamaları yaptık manage data diyor mesela ADD data Delete data mesela Delete data işlemini yapalım Burada burada Delete documentation da sadece artık burada belirtmemiz yeterli oluyor buradaki aşamada gördüğünüz gibi doküman var bir de Delete var Hemen yukarıya gidiyoruz zaten Bir documentation kısmı yok yani bir dokümantasyon umuz yok ADD vardı Get vardı bir de normal dokümantasyon kısmını alacağız di Bir de Delete dock olarak da kullanabiliyoruz bu ikisini kullanacağız ve function mız Neydi Bizim burada aate yapıp Delete şu

18:29 kısmını kullanacak zaten bir function da buraya yapalım datayı Send ettik datayı çağırdık şu şekilde Şimdi bir de Delete data from Database diyoruz aşağıya geçiyoruz Diyoruz ki const Delete data diye bir function açıyoruz Tabii ki Sing yapımızı da kuruyoruz ve Arrow function' mızı açmış olduk uygulamayı reload ettim oto login işlemini gerçekleştirmediği için ekrana yansıtmıyor onu Daha sonrasında göreceğiz oto login kısmında Delete data kısmında ne yapıyorduk direkt bunu yapıştırı olduk Sub Collection olayı var biz buna girmeyeceğiz Şuradaki bunu alıyoruz ama aşağıda da aslında ıd'si girebiliriz nerede şurada gördüğünüz gibi şu kısımda ıd'si gireceğiz neyin buradaki datam var

19:14 ama burada iki tane datam vardı burada iki tane datam vardı Bunun birinin ıd'si alacağız bunun ıd'si aldık Örneğin bunun ıd'si ile silme işlemini gerçekleştireceğiz onu da buraya veriyoruz Delete date işlemi için de ne yapacağız bir tane daha Custom butonu buraya getirip buna Delete data diyorum ve içine de Delete data function kuruyorum uygulamama giriyorum test test.com ile 1 2 3 4 5 6'yı çağırıyorum giriş yaptık title Şu an henüz bulunmadı ya Yani verilerimizi çekmedik uygulamayı baştan başlattığımız için bunlar görüntülenemiyor denildi Bu yüzden bunu yorum satın alabiliriz silebiliriz ya da şurada Eğer varsa yansıt anlamına gel gelen şu kısımlara sadece soru işareti koyup

20:02 geçebiliriz Bunlar çok iyi pratikler değil normalde bunları bu şekilde kullanmıyoruz ancak yine de bu şekilde bir görüntüleme olsun diye elinizde olsun bu şekilde kullanmıyoruz ama ekranda bir hatayla karşılaşırsanız soru işareti noktadan önce sizi kurtaracaktır şimdi bir Get data işlemi yapalım datayı aldık bakın ekrana yansıtıldı şimdi ekranda datayı aldıktan sonra buradaki aşamada ne var Bir tane daha datayı çekelim o taraftan iki tane datam oldu datalar mız artık iki tane olduktan sonra bir tanesini Delete yapacağız hangisini zaten biz burada ıd'si verdik Delete işlemini gerçekleştiriyoruz Ama bunun da zaten try cch olayını yapmamıştık O yüzden veri silindi mi bilmiyoruz O yüzden geldik baktık burada artık verimiz bir tane kaldı Şimdi biz bunu zaten ekranda

20:47 yansıttığımız tekrardan Get DT dediğimizde gördüğünüz gibi sadece hala oradan gelen verileri ekleme yapıyor biz güncellemedim bu kısmı Bundan dolayı ekranda direkt silinmesini beklemeyin tekrardan Get data yapıp da buradan güncelleme aşamasını yapmamız gerekiyor Delete data da yaptık ancak Şuradaki datada sadece diyelim ki burada lesson değiştirmek istiyorum 95 yerine bunu değiştireceğim burada kin ıd'si alacağım ve update kısmını kullanacağız gelelim update kısmına Delete yaptık Collection Delete yapabiliyoruz Delete data yerine Yukarıda hemen bakıyoruz geldiğimizde burada ADD data kısmında update doküman olarak da gösteriyor update edeceğimiz buradaki Database ismini sonra içerisindeki kısmı görüntüleyebiliyor şurada Yalnız bu kısımda gördüğünüz gibi

21:33 database' orada kullandığımız Collection ismi Burada da ıd'si kullanmamız gerekiyor ıd'yi kullandıktan sonra bu aşamayı gerçekleştirebiliyoruz O yüzden burada da Yukarıdaki update docu alacağız virgül update Doc diyor aşağı da geçtim artık update documentation diyelim update data from firebase diyorum şurasında da firebase' çevirelim const update data isminde bir function açtım bu sefer yine ne yapıyoruz asing yapımızı da kuruyoruz essing yapımızı kurduk içerisine Bunu yapıştırıyoruz ancak öncesinde şurada Kullanmadığımız yapıyı göstereyim diyorum try keşi tekrar kullanalım bu başarılı olursa

22:19 çalışsın yoksa ekrana konsol lck versin diye bir işlem yapmamız gerekiyor bizim şu şekilde verileri yansıt alım konsol log error veriyorum Şimdi şu kısma kadar olan kodlar bizim zaten firebase' aldığımız buradaki Washington ref dedi kendisi Zaten oradaki verileri çekiyordu bizim burada datam neyi referans olarak alacaktık bizim kullandığımızda lesson data diyelim database' imiz var database' imizin ismi nereden geliyordu Şuradaki react native lesson ile aynı şekilde geliyordu Bu da Collection olarak baktığınızda şunun ismi olarak da düşünebilir Sonra buradaki ıd'yi almıştık biz bu ıd'ye sahip olan datayı direkt spesifik

23:04 olarak çekiyoruz bu datayı alıyoruz update documentation içerisindeki dataya yansıtarak içerisinde hangi veri varsa bunu değişikliğe uğratacak Örneğin içerisinde hangi veri vardı lesson vardı bu lesson bireb olarak alın buradaki lesson 95 Ken 145 olarak değiştirmek istiyorum diyelim update documentation için bir tane daha buton oluşturuyoruz gördüğünüz gibi gi update data diyorum buraya da update data function mı oluşturuyorum şimdi buradaki update data tıkladım Bu işlem gerçekleşti yukarıda konsol yapmadığımız için herhangi bir çıktı ama hemen bakalım lon 145 olmuş mu gördüğünüz gibi lon artık 145 olmuş Bunu gidiyoruz diyelim ki sadece 35'e çeviriyoruz update data dedik gördüğünüz

23:51 gibi 35'e hemen çevirelim bunları aynı zamanda bunu gönderdiğimizde ekranda da güncel olsun diye update yapabiliriz yani durmadan datayı çekebiliriz çektiğimiz datada mesela tekrar çektiğimizde gördüğünüz gibi lessin 35 olarak da geliyor Biz ekrana sadece ikisini yansıttığımız için burada manuel olarak sadece ikisi değişmiyor ekranda bunu da Daha sonrasında değiştirebilirsiniz istediğiniz gibi firebase' de database'e veri ekleme veri çekme kısmı bu kadar Bir sonraki derste görüşmek üzere

Share

YouTube Video Özetleri