Angular, modern web uygulamaları geliştirmek için popüler bir JavaScript çatısıdır. Angular projelerinizde daha verimli çalışmak ve geliştirme süreci...
Firebase Bulut Veritabanı Oluşturma
Angular kullanırken Firebase'i merak ettim. Sonrasından Firebase ile bulut bir veri tabanı oluşturup Angular ile kayıt işlemleri yapmaya karar verdim. Ama öncesinde Firebase bulut veritabanı hizmeti üzerinden bir veritabanı oluşturmamız gerekiyor. Bu yazımda sonraki Firebase ve Angular işlemleri için ön hazırlık diyebiliriz. Bu yazımda Firebase üzerinden bir proje nasıl oluşturulur? Oluşturmuş olduğumuz projeye nasıl veritabanı ekleriz? Gibi sorularımıza adım adım cevap bulacağız.
1. Adım Firebase'e kayıt olma
Firebase'e kayıt olmak için google hesabınızın olması yeterli. Google hesabınız ile bağlanıp oturum açabiliyorsunuz. Oturum açmak için https://firebase.google.com adresine gitmelisiniz.
2. Adım proje oluşturma
Siteye girdikten sonra öncelikle oluşturacağımız veritabanı için bir proje oluşturmamız gerekiyor. Add project diyerek 3 adımlı proje ekleme adımına başlıyoruz. Ben örnek olarak Products adında bir proje adı belirledim.
3. Adım Google Analytics istiyor musunuz?
Projenizde Google Analytics test aracını kullanmak istiyor musunuz? İstemiyorsanız Enable seçeneğine tıklayıp pasife alın. Ben bu örnek için ihtiyaç duymuyorum. Kararınızı verdikten sonra Continue diyerek işleme devam ediyoruz.
4. Adım proje oluşuyor
Bu adımda projenin oluşması için biraz beklemeliyiz.
5. Adım proje oluştu
Biraz bekledikten sonra projenin hazır olduğunu görebiliriz. Artık veritabanı için işlemlere geçmeye hazırız. Tabi öncelikle Continue diyerek devam edelim.
6. Adım api bilgisini alma
Tekrar anasayfamıza döndüğümüzde sol üstte projemizin adınızı görebiliriz. Hemen aşağıda ise bu projeyi kullanabilmek için api bilgilerini alabileceğimiz kısım var. Burada sağdaki Web butonuna tıklıyoruz.
7. Adım web uygulaması oluşturma
API bilgisi için bu projemiz için web uygulaması için bilgileri giriyoruz. Uygulamamıza bir isim veriyoruz. Sonrasında Register app diyerek devam ediyoruz.
8. Adım API bilgilerini alma ve kullanma
Görmüş olduğunuz gibi API'mize ait bilgileri görebiliyoruz. Bizim için önemli olan kısım firebaseConfig içindeki bilgiler. Bu bilgiler ile angular projemizi firebase ile ilişkilendirebiliriz.
9. Adım veritabanı için bulut alanı oluşturma
Bilgilerimizi bir yere kaydedebilir ya da ihtiyacımız olduğunda kullanabiliriz. Fakat henüz işimiz bitmedi. Bizim bu projemize veritabanı eklememiz gerekiyor. Veritabanı ekledikten sonra angular aracılığıyla verileri ekleyebilir ve diğer işlemlerimizi yapabiliriz. Veritabanı oluşturmak için sağda yer alan Cloud Firestore alanına tıklıyoruz.
10. Adım veritabanı oluşturma
Cloud Firestore alanında geldikten sonra Create database butonuna tıklıyoruz.
11. Adım veritabanı güvenlik seçimi
Bu adımda dikkat etmemiz gereken veritabanı güvenlik seçimi nasıl olacak? Yani veritabanı herkese açık mı olacak yoksa her şeye kapalı size özel bir veri tabanı mı olacak? İlk seçenek olan Start in production mode veritabanı size özel başkaları ile paylaşılmayan bir veritabanı güvenlik seçimidir. Diğer seçenek ise Start in test mode bu 30 gün boyunca herkes açık olan bir veritabanı güvenlik seçimidir. Kısaca ilk seçenek sizin yapacak olduğunuz proje özel ve başkaları ile paylaşılması uygun değil. İkinci seçenek ise ilk defa kullanıyor ve denemek için veritabanı oluşturuyorsanız mantıklı bir seçenek olacaktır. Ben deneme yapacağımız için test modunu seçtim. Sorasında Next diyerek devam ediyoruz.
12. Adım veritabanının tutulacağı yerin seçimi
Veritabanını nerede tutmak istiyorsanız onu seçebilirsiniz. Varsayılan olarak gelen nam5(us-central) bulut veritabanını seçtim. Seçtikten sonra Enable diyerek devam ediyoruz.
13. Adım veritabanı hazır
Artık veritabanımız oluştu ve kullanıma hazır. Bundan sonraki işlemler web ara yüzünden tablo ve veri eklemek nasıl oluyor onu göstereceğim. Tablomuzun adı için Collection alanını dolduruyoruz ve Next diyerek devam ediyoruz.
Bu aşamayı angular tarafından kullanarak ta verilerimizi ekleyebiliyoruz. Bu tablo ve verilerin eklenmesi ile ilgili yazının sonunda genel mantığını anlatacağım.
14. Adım tablo alanlarını ekleme ve tabloya ait veri ekleme
Product collectionumuz yani tablomuz oluştu. Şimdi bu tablomuza ekleyeceğimiz veri için 1 numaralı yerdeki Document ID değeri vermemiz gerekiyor. Bunu primary key gibi düşünebilirsiniz. Sonrasında 2 numaralı yerdeki gibi tablonun alanını, veri tipini ve değerini giriyoruz.3 numaralı alandan yeni alanlar ekleyebiliyorsunuz. Tablomuz ile ilgili değişiklikleri tamamladıktan sonra 4 numaradaki Save butonuna tıklayarak ilk tablomuza ait kaydımızı oluşturuyoruz.
15. Adım eklenen veriyi inceleme
Sırasıyla baktığımızda product adında bir collection, bu collectiona ait 1 numaralı document ve bu documente ait verimizi görebiliyoruz.
Son
Firebasedeki veritabanı mantığı aslında normal bildiğimiz şekilde sadece isimlendirme ve biraz da yapı olarak değişik gelebiliyor. Bu durumu açıklamak gerekirse collection bizim tablomuz, document bu tablodaki primary key olan benzersiz değerimiz ve bu documente ait verimiz var. Birbirleri ilişkili olarak çalışıyor. Siz angular üzerinden collection adı tanımladığınızda ve interfacede tanımladığınız alanlar ile birlikte otomatik olarak firebase veritabanına ekliyor. Sizin bu işlemleri arayüzden yapmanız gerekmiyor. Örneğin angularda kategori için bir tablo yani collection oluşturmak istiyorsunuz. Bunun için sadece collection adını belirtmeniz ve bu collection için kullanılacak alanlar için de interfacenizi çağırıyorsunuz. Aynı zamanda da verilerinizi de çağırdığınızda siz butonu bastığınızda hem collection hem document değeri hem de verileri otomatik olarak oluşturuyor. Tabi bunun uygulamasını sonraki yazılarımda yapacağım.
Umarım yararlı olmuştur. İyi çalışmalar dilerim.
Yorum yapabilmek için giriş yapmalısınız. Giriş yapmak için tıklayınız.