0:01 Merhaba arkadaşlar. Vize sonrasında yaptığımız uygulamaları videolarını çekmeye başladım. Eee ilk uygulamamız Firebase veri tabanını kullanarak kullanıcı girişi ve kullanıcı kayıt işlemini gerçekleştirmek olacak. Bu noktada bir yeni bir proje oluşturdum. Firebase giriş isminde projeyi oluşturdum. Başka da herhangi bir şey yapmadım. Geri kalanını birlikte devam edeceğiz arkadaşlar. Evet. Eee, öncelikle bir giriş sayfası oluşturmak istiyorum. Bunun için project klasörümün içerisine new folder diyerek screens isimli bir SC'nin altında da olabilirdi. Screens isimli bir klasör
0:47 oluşturuyorum. Bunun altına da new file diyerek bir login screen nojs. Ve yine bir de user yani giriş yapıldığında açılacak olan sayfa olmak üzere userscreen. Oak üzere iki tane sayfa oluşturuyorum. Rnfs enter dedim. CtrlS ile kaydettim. RnFS enter dedim. Ctrl ile kaydettim. Biliyorsunuz bu eklentilerden bahsetmiştik önceki derslerimizde. Şimdi eee sayfalar arası geçiş işlemini tanımlayalım. React navigation ile dokümantasyona geldim. Bunu da
1:33 hızlıca tekrar etmiş olalım. Biz expo kullanıyor arkadaşlar. Bu nedenle şu bir hemen tabii şöyle CD klasörümüze de giriş yapalım. Bu birinciyi şu ikinci eklentimiz paketimizi daha doğrusu yükledik. Şurada da hello rock navigation sayfasına geçiyor dedik ve buradan şunu alıp ne yapıyorduk arkadaşlar? Yapıştırıyorduk. Son olarak da dinamik kısmından EPPJS'ye bunu alın diyor. Zaten eppjs sayfasına geldim. Hepsini seçtim ve yapıştırdım. Evet, buradan home screen'i siliyor
2:21 idik. Kaydettim. Şurada da düzenleme yapıyoruz. Bildiğiniz üzere burası giriş ekranı. Kullanıcı girişi yazalım da. Sayfamızın adı ise neydi? Login Screen. Buraya gördüğünüz gibi geldi. Bundan bir tane daha var. İki tane sayfamız var. Tüm sayfalarımızı buraya tanımlamamız gerekiyor. Idi. Kullanıcı sayfası. Bu da arkadaşlar user screen idi. Bunu da
3:10 tanımladık. Şuraya bir de başlangıç sayfası tanımlayabiliriz. Bu da arkadaşlar kullanıcı girişi olsun. Yani açıldığında, uygulamamız açıldığında kullanıcı giriş sayfasına gitsin diyoruz. Bakalım gidiyor mu? Bunu da hemen bir deneyelim. Android Studio'da emülatörümüzü açalım. Evet, emülatörümüz şöyle dursun. Ön izleme yapmak için NPX Expo Start yazıyor dik ve başlattım. Android
3:57 Studio göndereceğim arkadaşlar emülatöre. Exposörümü güncellensin mi dedi. Hemen güncellensin diyorum. O devam etsin. Burada herhangi bir eksiğimiz kalmadı arkadaşlar. Sayfa yönlendirmeleri için her sayfayı tanımlıyor dedik. tanımlamasını gerçekleştirdim. Bundan sonraki süreçte Firebase üzerinde bir işlemler yapacağız. Açılırken ben Firebase'ten
4:45 bahsedeyim. Firebase ortamını açıyoruz arkadaşlar. Google hesabımızla giriş yapıyoruz. Eee açılması gerekiyor. Daha sonra go to conso diyerek eee yönetici eee primine geçiş yapıyoruz. Peki gördüğünüz gibi ben e bende de şu an herhangi bir veri tabanı yok. Tüm veri tabanlarını temizledim. Ne yapıyoruz? Yeni bir proje ile başla diyoruz. Proje ismi istiyor bizden arkadaşlar. Proje limiti ile alakalı bir bildirimde bulundu. Proje ismi olarak eee ne diyelim? Login project diye bir isim vereyim ve ileri diyorum. Gemini iyi kullanmamasını istiyorum.
5:32 Tekrar ilerliyorum. Burada da analitiklere gerek yok. İstatistiklere projeyi oluştur dedim. Evet, Real Firebase'de yeni bir proje oluşturuyoruz. İlk defa giriş yapıyorsanız tabii önceden oluşturduğunuz bir proje varsa onunla da devam edebilirsiniz. Bu arada şuna bir bakalım. Evet, gördüğünüz gibi login screen gelmiş. Yani kullanıcı girişi. Bunu da şuradan anlıyoruz zaten. Ekranda sadece login screen yazısı var. O sayfayı düzenleyeceğiz arkadaşlar. Önce bir projemiz tamamlansın. Firebase'de neler yapacağımızı görelim. Evet, projemiz oluştuğunda böyle bir ekran bizi karşılıyor. Burada biz iOS Android için eğer bir şeyler yapacaksak Android Studda ya da işte iOS
6:17 için geliştirme ortamında bunları seçiyoruz. web olanı seçerek ilerliyoruz ve bir yeni bir uygulama EP uygulamasını istiyoruz. Login ismini verdim. Register diyerek bunu oluşturuyorum. Evet. Diyor ki arkadaşlar projeni şunu bir dahil et. Öncelikle kopyaladık ve şuradan yeniden bir ne yapalım? Command promp açalım. ve projemizin içerisine bunu dahil edelim. Peki. Sonra diyor ki bir Firebase dosyası oluşturarak şuradakileri, aşağıdakileri kopyala. Bu
7:04 Firebase dosyasının içerisine seçtim. Kopyaladım. Devam etsin. Şurada project klasörünün içerisine new file diyorum. Firebase.js isimli bir doküman oluşturuyorum ve orada kopyaladığım işlemleri buraya yazıyorum. Evet arkadaşlar burada gördüğünüz bu APik'ler vesaire tabii bunlar önemli şeyler. Normalde bilgi güvenliği açısından veya siber güvenlik açısından çok paylaşılmaması gereken şeyler. Ben örnek sonrasında zaten bu hesabı ne yapacağım arkadaşlar? Sileceğim. O yüzden bu projeyi sileceğim. O yüzden paylaşmakta bir sıkıntı şu an için görmüyorum. Evet, bunu da aldık. Şuradan da continue diyelim. Ve daha sonra yapacağımız işlem
7:51 nedir? Autentication yani kim giriş işlemi için buna ihtiyacımız var. Authentication'ı açıyoruz. Get started dedik arkadaşlar buradan da. Ve neyle giriş yapmasını istiyoruz kullanıcılarımızın? Email, password, e telefon, Google hesabıyla, Microsoft hesabıyla, Facebook hesabıyla vesaire çeşitli alternatiflerimiz var. Biz email password seçeneğini seçiyoruz ve şuradan enable diyoruz arkadaşlar. Yani aktif alttaki bu parolasız girişi ifade ediyor. Yani doğrulama kodu gibi bir şey gelerek gerçekleşiyor. İşaretlemiyorum onu ve kaydet diyorum. Aynı anda birden çok giriş yöntemi de tabii ekleyebiliyorsunuz bu arada bilginiz olsun. Şu an için bizim için email password aktif edilmesi
8:38 gerekiyor. E usage bölümünde bir şey yok. Users bölümünde de istersek bir tane kullanıcı kendimiz ekleyebiliriz. İşte abcdf.com 1 2 3 4 5 6 7 8. Şimdilik böyle bir kullanıcı oluşturdum. ID'sini de zaten parolasını da gördüğünüz gibi gizledi. Peki buradaki işlemlerimiz bitti. Şimdi tekrar programımıza döneceğiz. Evet. Öncelikle şurada birkaç değişiklik
9:24 yapmak istiyorum. Daha doğrusu eklemek istiyorum. Şöyle import kısmına geliyorum arkadaşlar. Import. Import import. Firebase Firebase'i import etmek istiyorum. from tırnak içerisinde arkadaşlar Firebase slash compat/ e app diyorum ve bunu import ediyorum. Bu bir. Daha sonra import tekrar Firebase slash compat sl
10:09 out. Bunu da import ediyorum. Evet. Devamında ise arkadaşlar aşağıda burada hemen bir şart yazalım. Şöyle kısmında eğer eğer buraları direkt alabilirsiniz tabii birebir de. Yani Firebase hesabımız boş değilse ne yapsın arkadaşlar? Şöyle bir şey yapsın. Firebase
10:56 no initializ app Firebase config. Da sonra bunu bir de ne yapalım? cons out ile dışarı aktarmak üzere. Sonra da bunu arkadaşlar bu arada şu şöyle üstte dursun.
11:44 export dışarı aktaralım. Evet, yapacağımız değişiklikler bu kadar bu sayfada arkadaşlar. Şu kısım sizin bağlantınız için gerekli olan kısımlar. Firebase config yazan. Bu arada şunu da export edeceğiz ilerleyen konularda arkadaşlar. O şimdilik dursun. Evet, şu an bizim için yeterli. Peki, login screen'imize gelelim. Burada bir tasarım gerçekleştireceğiz. Tasarımdan önce ise bazı fonksiyonlar oluşturmamız lazım. Kurmamız gereken fonksiyonlar önemli. Öncelikle bize parola ve e-posta ihtiyacımız var. Bununla ilgili bir
12:29 birer tane use oluşturalım. Şuradan const eposta bu hatta use state demiştik. Snipet'ı kullanabiliriz bu durumda şöyle e-posta dedik. İlk olarak da nedir arkadaşlar? E-postamız boş. Bu nedenle altında da aynı şekilde parola ve parolamız da
13:14 boş. Tasarım aşamasına geçmeden önce kayıt ol ve giriş yap fonksiyonlarını oluşturmak istiyorum. Eee bu aşamada öncelikle kayıt ol fonksiyonunu oluşturalım. Kite all diye bir fonksiyon açalım arkadaşlar. Arrow function'ımızı yazalım. Süslü parantez içerisinde de kayıt olma işlemleri için gerekli kodlarımızı yazacağız arkadaşlar. Şimdi kayıt olma fonksiyonu için gerekli kodlarımızı alabileceğimiz bir yer var. Hemen şöyle diyelim. Firebase Firebase direkt şeyini açabiliriz
14:01 gerçi. Sayfa sign diyelim. Burada da çıkacaktır bir şeyler. Eee, şu autenticate. Şimdi arkadaşlar burada nereye geliyoruz? Başlarken. Başlarkene geldik. Bakalım. Authentication kullanmaya başlama. Tamam. Şu işlemleri gerçekleştirdik bir zaten. Const out vesairesi. Bunlar geçti arkadaşlar. Aşağı iniyoruz. Yeni kullanıcı kayıt etme. Bakın gördüğünüz gibi yeni kullanıcı kayıt etme işlemi. Bu işlemi gerçekleştirmek için
14:46 ne yapmamız lazımmış? Buradaki kodu alacağız. Yani burada aslında bizim alacağımız ne arkadaşlar? Şuradan biz zaten out'u diğer taraftan almış olacağız. Const out, get out. Get out'a gerek yok. Dolayısıyla şöyle diyebiliriz. Şurayı bir kopyalayayım. Evet, burayı aldık. Şimdi şuraya geliyoruz. Buraya out dedikten sonra arkadaşlar şunun buraya eklenmiş olması önemli. Diğer sayfam diğer sayfamızdan geliyor. Yukarıdan aldığım kodları buraya
15:32 yapıştırıyorum. Şöyle bir de format dokümant diyelim. Evet. Create user with email and password yani kullanıcı adı ve parolayla eee daha doğrusu e-posta ve parolayla kullanıcı oluşturma işlemi arkadaşlar. Peki bizim buradaki e-postamız ve parolamız ne olacak? Hemen belirtelim. Bir tanesi e-posta yukarıda tanımlamıştık. Bir tanesinin adı da parola. Bunu da tanımlamıştık arkadaşlar. Eğer kullanıcı başarılı bir şekilde giriş yaptıysa ne yapsın? Şu da kalsın arkadaşlar ve desin ki bir uyarı versin. Kullanıcı başarıyla oluşturuldu desin.
16:19 Alert yani bir uyarı versin arkadaşlar. Desin ki kullanıcı başarıyla oluşturul. Kayıt edildi diyelim. Kayıt edildi. Bir hata olması durumunda ise hata mesajını bastırmasını istedik burada. Hata mesajını da bastırmak için yine hata yakaladığında ne yapsın? Hata mesajını bastırabilir. Loog kaydı olarak. Arkadaşlar şunlara tabii ihtiyacımız yok. Bunun yerine uyarı versin. Alert kullanıcı kaydı ya da yapılamadı
17:04 tabii. Konsol. log diyerek error nokta hata mesajını oraya yazdıralım arkadaşlar. Error no message olarak hata mesajını yazdıralım. Message. Evet. Tamam. Blog kaydına da hata mesajı basılsın. Güzel. Eee, kullanıcı kayıt işlemi için gerekli kodlarımız bu kadar arkadaşlar. Şimdi aynı şekilde şunun bittiği yerden tabii bu
17:50 fonksiyonlarımızı daha sonra çağıracağız. Bir de ne yapalım arkadaşlar? Giriş yap fonksiyonu oluşturalım. Yukarıdakiyle benzer bir mantık. Giriş yap. Süslü parantezimizi açtık, bastık. Peki giriş yapmak için gerekli kodlarımız neredeymiş? Aşağıya doğru iniyoruz. Mevcut kullanıcıyla oturum açma diyor. Bakın burada da gerekli olan kodlar burası. Biz yine outu kullanacağız arkadaşlar. Out'u yukarıdan import etmiştik zaten. Şöyle out dedim. Enter'e bastım. Format doküman diyerek de bir dokümanımızı düzenleyelim. Evet. Şimdi
18:36 peki neyle giriş yapacağız? E-posta virgül parola. Giriş yaptık diyelim. Yani sign başarıyla giriş yapıldıysa arkadaşlar hemen buraya alert kısmına şuraya. Evet giriş yapıldı. Bildirimi verelim arkadaşlar. Buraya şuraya alert giriş yapıldı. Hata kısmına geldiğimizde ise giriş başarısız yazdırabiliriz. Şuraya yine alert giriş başarısız.
19:23 Yine konsolu da hatayı bastıralım. Şimdi gelelim tasarım bölümümüze yani view kısmına. Şurayı sildim arkadaşlar. Burada view yerine keyboard avoiding view isimli bir araç kullanacağız. Keyboard avoiding viw. Eee, burada bildiğiniz üzere e-posta adresini ve parolayı girerken bir klavye ekranı oluşturacak. Klavye ekranı oluşturduğunda ekranın görünürlüğünü ayarlayabilmek için kullanılan bir eee kapsayıcı arkadaşlar. Şimdi bunun içerisinde neye ihtiyacımız var? İki
20:09 tane input ve iki tane de butona ihtiyacımız var. Bir tanesi giriş yap, bir tanesi kayıt ol butonu. Bunları bir oluşturayım. Sonra stil kısmına geleceğiz arkadaşlar. Öncelikle text inputları oluşturalım bunun içerisine. Text input. Tamam. Text input'umunu arkadaşlar e kapatmasına böyle olmasına gerek yok. Şöyle kapatabiliyoruz tabii bunu. Tamam. Text inputumunu arkadaşlar place holderı e-posta giriniz. E bu e-posta value alacak bildiğiniz üzere. Value'su ise arkadaşlar eee
20:55 yukarıdaki e-posta olması gerekiyor. Yani biz yukarıda zaten bunu bildirdik ya. Şu şekilde e-posta ve süslü parantezimizi de kapatıyoruz. Tamam. Başka ne alacak? Bir de buradaki yazı değiştiğinde bir şeyler olması lazım. Biz burada yukarıda use state oluşturmuştuk. Nerede? Bakın. state eee biz oradaki yazıyı oluşturdukça e-postamızın oraya aktarılması gerekiyor. Bu nedenle de şuraya diyoruz ki on on change text on change text yani metin değiştikçe ne yapsın arkadaşlar? Metin değiştikçe şöyle bir şey yapsın. text
21:40 set eposta yani metni alsın ve bu set e-postanın içerisine göndersin ve yeni e-postamız bu hale gelsin. Buna bir de stil ismi verelim şuraya en başa arkadaşlar. Şurada style eşittir stylus nokta ismi ne olsun? eee, input, input olsun. Evet. Hatta bu input alanlarını bir kapsayıcı altına da alabiliriz. Şöyle view kapattım. Şu view'i aldık arkadaşlar.
22:26 Kestik şuraya. Şundan bir tane daha ihtiyacımız var. Kopyala. Bu ise e-posta giriniz değil. parola giriniz ve şurası da parol olacak. İkisinin de stilleri aynı olsun. Stillerinde herhangi bir şeye ihtiyacımız olmasın. Peki şu input şu VI'e de bir şey verelim arkadaşlar. Bir stil verelim. Nerede? Şuna. Hı. Evet. Style eş stylus no
23:13 input container. Tamam. Bunları yukarıdan aşağıya biçimlendirerek geleceğiz arkadaşlar. Şu da zaten ana kapsayıcımızdı. Buna da direkt container yazalım. Style eş sty no container. Tamam. 42 adet metin kutusu oluşturduk. Sonra yeni bir vi daha açalım buraya arkadaşlar. Bu vimiz ise buton kapsayıcısı olsun. Style eş buton
23:58 container. Peki içinde iki tane butona ihtiyacımız var. Buton için touchable opacity kullanacağım. Touchable opacityde de içinde bir metin olacak arkadaşlar. Bu da giriş yap yazacak buna. Dolayısıyla text giriş yap. Peki şimdi bunu biraz geliştirelim. Şimdi touchable opacityimizin bir stili olacak arkadaşlar. Eee, buna ne yapalım? Style eşittir buton giriş ismini verelim.
24:43 Buton giriş. Peki buna basıldığında ne yapacak? Onpress basıldığında ise arkadaşlar giriş yap fonksiyonunu çağıracak. İşte yukarıda oluşturduğumuz giriş yap fonksiyonunu çağıracak arkadaşlar. Yani tıklandığında bu işlemi yapsın. Şu metin içinde bir style verelim. Style eşittir buton text diyebiliriz. Buton metin diyebiliriz buna. Bakalım. Bir tanesini seçelim. Buton text olsun. Buton text. Evet. Başka bir şeye gerek var mı? Aynısından bir tane daha ihtiyacımız var. Bu da kayıt ol. Kayıt ol butonu olacaktı. Şunu da
25:32 buton kayıt diyelim. Şu G'yi de büyük yazayım. Buton texte herhangi bir şey yok. Giriş yap değil. Kayıt ol fonksiyonu çağırasılsın. Evet. baktığımızda işlemleri tamamladık, kaydettik. Hatta şurada belki bazı değişiklikler olmuştur. Bir hata vermiş. Hataya da sonra bakalım. Sanırım import etmediğimiz bir şey var. onunla
26:23 ilgili. Evet arkadaşlar, hatalar nedir diye şöyle biraz baktım. Tekrar dönüş yaptım size. Süre geçmemesi için durduruyorum arada. Şimdi eee çok ekstra bir hatamız yokmuş. Öncelikle onu söyleyeyim. Şu an gördüğünüz gibi çıkıyor karşımıza. Tabii herhangi bir tasarımsal bir şey yazmadığımız için böyle alt alta vesaire hepsini görebiliyoruz. eee tasarımsal süreçlere şimdi geleceğiz. E hata neymiş peki? Neler unuttuk? 1. useate'i import etmeyi unutmuşum. İki eee şu üsttekileri stylus.container yani şu stylus ifadesini yazarken e alttakilerde şu buton containers buton giriş vesaire.
27:08 Bunlar da styı yazmayı unutmuşuz. Bunları da ekledim arkadaşlar başına ve şimdi herhangi bir problem yok. geliyor. Şimdi bunların özelleştirmesinden bahsedeceğiz. Görüntüsünü nasıl ayarlayacağız? Yani artık şu bölümdeyiz. Biçimlendirme bölümündeyiz. Yukarıdan başlayalım. En yukarıda ne var? Konteyner var arkadaşlar. Konteyner dedim. İki noktayı koyduk. Açtık süslü parantezimizi. Konteynerımız nasıl olacak? Bu bizim en ana kapsayıcımız. Bildiğimiz üzere ana kapsayıcının hiçbir şey yapmadan ilk yazdığımız şey neydi arkadaşlar? Flex pardon flex 1 virgül. Tamam bunları ortaya yazmak istiyorum. Justify center align items yatayda ortalamak
27:57 için kullanıyor dedik biliyorsunuz. Line item center. Bunu da yazdık. Bir de arka filan rengi verebiliriz. Background color 2. Şöyle Google'dan bir renk bulalım. Color picker. Şöyle bir renk olsun. Rastgele alıyorum. Kodunu aldım arkadaşlar. Ve şuraya pardon alamamışız. yapıştırdım. Peki bakalım. Evet ortaya geldi. Arka plan rengimizi de vermiş olduk. Peki
28:43 devamında ne var arkadaşlar? Input conteynerlarımız vardı. Nerede? Hemen bakalım. Şurası bakın. Input container. Şuraya bir virgül attık. Input container 2. Açtık üstü parantezimizi. Bu buna sadece genişlik vereceğim arkadaşlar. 2 nokta 80 % virgül ve birbirinden de biraz uzak durması için margin batım 20 dedik. Bakalım nasıl bir şey oldu. Şunları görüyorsunuz. Birazdan daha belirgin hale getireceğiz. Şimdi arkadaşlar nerede?
29:30 Input. Inputlarımıza arka plan verelim. Beyaz olsun. Background, color, white, virgül. Başka? Birbirlerinin uzaklıkları. Padding 2.15. Tamam. Arkadaşlar, eee, dikeydeki hani alttan ve üstten boşlukları olsun, bunlar da 5 birim olsun arkadaşlar. Eee, önemli şeyler daha anlaşılır hale getirmek için border radius ve
30:16 border radius.10 10. Tamam. Yazı büyüklüğü, yazı kalınlığı ile ilgilenebiliriz. Şimdi bir de font size 2. 20. Bir de yazı kalınlığı verebiliriz arkadaşlar bunlara. 600. Bakalım. 600. Biraz çok oldu galiba. Tamam. Parola gidiniz. P'si küçük yazmışız. Evet, virgül üst tarafımız bitti. Şimdi geldik arkadaşlar butonlarla alakalı kısma. Bir buton konteynerımız olsun. Vardı daha doğrusu. Buton konteynerı, buton kapsayıcısı. Bunun da
31:04 biti %60 olsun. Burada başka bir şey yazmayacağım. Şimdi bizim neyimiz var başka arkadaşlar? Bir buton girişimiz var. Bir de buton kaydımız var. Bir de buton teximiz var. Doğru mu? Buton giriş, buton text, buton kayıt. Tamam. Sırasıyla yapalım. Buton girişimiz olsun. Butonumuza bir arka plan rengi verelim. Background color. Giriş butonu blue olsun. Hiç renk yaramadan devam edeyim. Tabii renk uyumuna bakmıyorum. Arka plana şimdilik yazıyorum arkadaşlar. padding 10 birim
31:51 olsun. Dikey de birbirlerinden uzaklıkları olsun. Çünkü alt alta gelecek bu butonlar. Vertical yine 5 birim olsun. Bunlara da yine border verelim. Yani eğiklik border radius 10. Üsttekilerle uyumlu olsun. Birgülünü koymayı unutmayalım. Ve arkadaşlar ol ortaya olsun. Aline items center. Peki buton kayıtımız da buna benzer olacak. Sadece
32:37 renk red olsun. Bir de buton textimiz var arkadaşlar. Buton textimiz ne olacak? Buton textimizin yazısı, yazı rengi white, font size büyüklüğü 20. Font weight yukarıdakiyle ünlü olacak şekilde 400 dedik. Tasarımımız böyle bir şey oldu gördüğünüz gibi. Şu yukarıdaki P'yi de bir düzeltelim. Şurada parola giriniz. P. Peki şimdi bir deneme yapalım.
33:25 Q@ RTY koyamadık tabii. Hemen şöyle bir klavyemizi bir gösterelim. RTY com 1 2 3 4 5 6 7 Üstteki yazımız gitti. Tıklayamamışız arkadaşlar. Hemen tekrar diyelim.
34:19 C 1 parolaya neden gir Bir hatamız var. Hemen çözelim.
35:06 Evet arkadaşlar hatamız şu. E şurada set e-posta text yazarken buraya da set e-posta text yazmışız. Yani buradaki halbuki değişecek kısım ne olacak? Yazdıkça değişecek olan kısım parola olacak. Biz ise gidip eee yazdıkça text kısmını şey pardon e-posta kısmını değiştir demişiz. buydu. Bu nedenle aşağı yazdığımda da yukarıyı değiştiriyor idi. Bir de parolanın yazıldıktan sonra görülmemesi için buraya parametre olarak ikinci bir şeye secure text entry ifadesini giriyorum. Giriş yap dediğimde bir hata verdi ve signin he bu metot bulunmamaktadır dedi. Bakalım şimdi unuttuğumuz yeri hemen tespit edelim ve kullanalım arkadaşlar. Evet biraz önceki hatanın kaynağı şuydu arkadaşlar. Şurada
35:52 noktaları unutmuşuz. Out'tan sonra biz yeni bir kopyala yapıştırı yaptığımız için noktaları unuttuk. Out'tan sonra bu fonksiyonumuzu çağırırken nokta koyuyoruz. Aynı şekilde eee giriş yap kısmını da şuraya nokta koyuyoruz. Sonra kaydediyoruz. Kaydettikten sonra tekrar izlemeye baktığımızda bakın şimdi kayıt ol diyorum. Kullanıcı kaydı yapılamadı diye uyarı veriyor. Şurada log kaydında ise baktığımda email ve password ne diyor? Email adresi. Bu email adresiyle bir kullanıcı mevcut diyor. Şunun aynısıyla o yüzden yapamadım diyor. Şöyle bir küçük bir değişiklik yapıp kayıt ol dediğimde kullanıcı başarıyla kayıt edildi diye bir bildirim aldım. Bakalım kayıt edilmiş mi? Şuraya gelelim. Bir sayfamızı
36:38 yenileyelim. Evet. A B C D def ve parolamız da buraya gelmiş durumda. Kayıt işlemimiz başarıyla çalıştı. Peki giriş yapalım. Giriş yapıldı dedi ama aynı sayfadayım. Burada bir eksiğimiz var. Giriş yapıldı dediyse sorun yok demektir. Ama niye aynı sayfadayım? Şimdi programımızın son kısmında da bunu ele alacağız arkadaşlar hep birlikte. Peki nasıl yapabiliriz bunu? Buna farklı çözümler yapabiliriz. Şöyle giriş başarılıysa yani şuraya deriz ki başarı pardon neredeydi? Kayıt değil. Kaydı kapatalım. Hıh. Giriş yap. Giriş başarılıysa arkadaşlar ne yapsın? beni diğer sayfaya yönlendirsin. Giriş başarılı uyarısını verdikten sonra bir bekleme
37:24 yapabilirsiniz. Burada şöyle yapalım. O yüzden mesela bir deneyelim. Eee, navigation'ı zaten eklemiştik. React navigation'ı şuraya şunu yazmamız lazım biliyorsunuz. Navigation ton. Tamam. Evet. butona tıklanıldığında ne yapsın arkadaşlar? Bizi bir de şöyle bir şey denesek. Navigate başarılı olmazsa başka yöntem deneyeceğiz. User user değil. Hemen şuradan bakalım. Kullanıcı sayfası.
38:11 Burada bir hata verdi galiba. Bir deneyelim. Evet. Tamam. O zaman alternatif piyon üreteceğiz arkadaşlar. Bunu bu şekilde değil de bakalım. Tamam. Güzel. Alternatif yolumuz ne olacak o zaman? Yeni bir fonksiyon oluşturalım. Bu fonksiyonumuz da biz başarılı bir şekilde giriş yapabildiysek eğer o zaman işlem yapsın arkadaşlar. Ne yapsın? Kayıt olma haricinde yukarıda eee use effecti de arkadaşlar. Şuraya gelelim. Use effect diyelim. Yani bir şeyler
38:57 değiştiğinde arkadaşlar şuraya da bir arrow function koyup süslü parantezimizi açalım. Out nokta out nokta on out. Heh. Evet. On out state change. Bu ne demek arkadaşlar? Durum değiştiğinde demek. Pardon parmağım değdi. Şöyle neyin durumu değiştiğinde? Userın durumu değiştiğinde arkadaşlar user durumu değiştiğinde eğer kullanıcı
39:44 varsa kullanıcı varsa ne yapsın arkadaşlar? bizi yönlendirsin. Navigation no navigate kullanıcı sayfası. Evet. Deneyelim şimdi. Evet çoktan giriş yapmış bile çünkü bizim kullanıcımız olduğu için arkadaşlar. Peki gördüğünüz gibi giriş işlemimiz başarıyla çalışıyor. Herhangi bir problem görünmüyor. Geri geldiğimde buraya geliyor. Giriş yap dediğimde iş
40:31 başarısız çünkü alanlar boş. A B C önceden giriş yaptığımız için tabii sign out yapmadığımız için butona bastığımda öyle diyor ama arkadaşlar signout yapmadığımız için de diğer hesabımızı açıyor. A B C şöyle diyelim. Gördüğünüz gibi devam ediyor. Kullanıcı giriş işlemimiz çalışıyor. Herhangi bir problem yok. Şimdi user screen'de bir de çıkış işlemini gerçekleştirelim ve bunu tamamlayalım. Uzunca bir konu oldu zaten. Buraya bir const çıkış yap isimli bir fonksiyon
41:16 tanımlıyorum. Arkadaşlar bu ne yapacak aslında? Out outlemesini bekliyorum. Out. H eklemedi. Kendim ekleyeceğim artık onu arkadaşlar. Sign out yani çıkış yap diyoruz. Şu out'u bir ekleyelim. O yüzden şey yaptı. Şuradan alabilirim bunu. Şöyle ekledim. Nokta sign
42:07 out. Tabii. He tabii şöyle bir şey de var. Errow functionlarımızı unuttuk. Onun da etkisi olabilir. Evet. Şimdi çıkış yaptığında ne yapsın? Çıkış yaptığında da arkadaşlar bizi giriş sayfasına yönlendirsin. Evet. giriş sayfasına navigation navig şuraya navigate yazmadığımız için
42:53 nokta navigate giriş pardon kullanıcı girişiymiş ismi. Evet. Bu sayfaya yönlendirsin. Şayet burasada bir hata olursa. Gerçi try yazdık mı? Try yazmadık ama yine de bir hata yakalanırsa arkadaşlar ne yapsın?
43:38 Konsol hata mesajını log kaydı olarak konsola bassın arkadaşlar. Güzel. Bir tane buton koyalım şimdi şuraya. Şuradaki butonlardan alabilirim. Hatta direkt şöyle alayım. konteyneriyle konteyner. Hemen şöyle aldım. Butonun birini siliyorum ve diyorum ki
44:23 basıldığında çıkış yapı çağır. Şurada da çıkış yapı yazısı olsun. Ve arkadaşlar şuradaki stilleri de alalım. Buon konteyner çıkış olsun ismi.
45:19 Texini de aldığımı tamamlamış olacağız. Kaydettim. Touchable opacity mevcut değilmiş. Kopyala yapıştırla aldığımız şeylerin bazıları tabii burada yer almıyor arkadaşlar. Mecburen elimizle ekliyoruz. Çıkış yap dediğimde de gördüğünüz gibi buraya gidiyor. Evet, bu da çıkış yapılama işlemiydi arkadaşlar. Hem videosunu hem de kodlarını sizlere göndereceğim. Bir sonraki videomuzda kurut işlemlerine kayıt, pardon veri kaydetme, veri silme, veri
46:06 güncelleme ve verileri listeleme işlemlerinden bahsedeceğiz.
