Azure Static Web Apps ile Mongoose kullanarak Azure Cosmos DB'deki verilere erişme

Mongoose , Node.js için en popüler ODM (Nesne Belgesi Eşleme) istemcisidir. Mongoose, bir veri yapısı tasarlamanıza ve doğrulamayı zorlamanıza olanak tanır ve MongoDB API'sini destekleyen veritabanlarıyla etkileşime geçmek için gereken tüm araçları sağlar. Cosmos DB gerekli MongoDB API'lerini destekler ve Azure'da arka uç sunucu seçeneği olarak kullanılabilir.

Önkoşullar

• Bir Azure hesabı. Azure aboneliğiniz yoksa ücretsiz bir deneme hesabı oluşturun.
• Bir GitHub hesabı.
• Cosmos DB sunucusuz hesabı. Sunucusuz bir hesapla, kaynaklar için yalnızca kullanıldıkları şekilde ödeme yapmanız ve tam bir altyapı oluşturma gereksinimini ortadan kaldırmanız gerekir.

1. Cosmos DB sunucusuz veritabanı oluşturma

Cosmos sunucusuz veritabanı oluşturmak için aşağıdaki adımları tamamlayın.

1. Azure Portal’ında oturum açın.
2. Kaynak oluştur’u seçin.
3. Arama kutusuna Azure Cosmos DB yazın.
4. Azure Cosmos DB'yi seçin.
5. Oluştur'u belirleyin.
6. İstenirse MongoDB için Azure Cosmos DB API'sinde Oluştur'u seçin.
7. Azure Cosmos DB Hesabınızı aşağıdaki bilgilerle yapılandırın:
   • Abonelik: Kullanmak istediğiniz aboneliği seçin
   • Kaynak: Yeni oluştur'u seçin ve adı aswa-mongoose olarak ayarlayın
   • Hesap adı: Benzersiz bir değer gereklidir
   • Konum: Batı ABD 2
   • Kapasite modu: Sunucusuz (önizleme)
   • Sürüm: 4.0
8. Gözden geçir ve oluştur’u seçin.
9. Oluştur'u belirleyin.

Oluşturma işlemi birkaç dakika sürer. Statik bir web uygulaması oluşturduktan sonra bağlantı dizesi toplamak için veritabanına geri döneceğiz.

2. Statik web uygulaması oluşturma

Bu öğreticide, uygulamanızı oluşturmanıza yardımcı olması için bir GitHub şablon deposu kullanılır.

1. Başlangıç şablonuna gidin.

2. Sahibi seçin (ana hesabınız dışında bir kuruluş kullanıyorsanız).

3. Deponuza aswa-mongoose-tutorial adını verin.

4. Şablondan depo oluştur’u seçin.

5. Azure portalına geri dönün.

6. Kaynak oluştur’u seçin.

7. Arama kutusuna statik web uygulaması girin.

8. Statik Web Uygulaması'ı seçin.

9. Oluştur'u belirleyin.

10. Azure Statik Web Uygulamanızı aşağıdaki bilgilerle yapılandırın:

    • Abonelik: Öncekiyle aynı aboneliği seçin
    • Kaynak grubu: aswa-mongoose öğesini seçin
    • Ad: aswa-mongoose-tutorial
    • Bölge: Batı ABD 2
    • GitHub ile oturum aç'ı seçin
    • Azure Static Web Apps'in dağıtımı etkinleştirmek için GitHub Eylemi oluşturmasına izin vermeniz istenirse Yetkilendir'i seçin
    • Kuruluş: GitHub hesabınızın adı
    • Depo: aswa-mongoose-tutorial
    • Dal: ana
    • Derleme ön ayarları: React'i seçin
    • Uygulama konumu: /
    • Api konumu: api
    • Çıkış konumu: derleme

11. İncele ve oluştur'u seçin.

12. Oluştur'u belirleyin.

13. Oluşturma işlemi birkaç dakika sürer; Statik web uygulaması sağlandıktan sonra Kaynağa git'i seçin.

3. Veritabanı bağlantı dizesi yapılandırma

Web uygulamasının veritabanıyla iletişim kurmasına izin vermek için, veritabanı bağlantı dizesi bir uygulama ayarı olarak depolanır. Ayar değerlerine nesnesini kullanarak process.env Node.js erişilebilir.

1. Azure portalının sol üst köşesindeki Giriş'i seçin (veya adresine https://portal.azure.comgeri dönün).
2. Kaynak grupları’nı seçin.
3. aswa-mongoose öğesini seçin.
4. Veritabanı hesabınızın adını seçin. Mongo DB için bir tür Azure Cosmos DB API'sine sahiptir.
5. Ayarlar'ın altında Bağlantı Dizesi'ne tıklayın.
6. BİRİnCİl BAĞLANTI DIZESİ altında listelenen bağlantı dizesi kopyalayın.
7. İçerik haritalarında aswa-mongoose öğesini seçin.
8. Web sitesi örneğine dönmek için aswa-mongoose-tutorial öğesini seçin.
9. Ayarlar'ın altında Yapılandırma'ya tıklayın.
10. Ekle'yi seçin ve aşağıdaki değerlerle yeni bir Uygulama Ayarı oluşturun:
    • Ad: AZURE_COSMOS_CONNECTION_STRING
    • Değer: <Daha önce kopyaladığınız bağlantı dizesi yapıştırın>
11. Tamam'ı seçin.
12. Ekle'yi seçin ve veritabanının adı için aşağıdaki değerleri içeren yeni bir Uygulama Ayarı oluşturun:
    • Ad: AZURE_COSMOS_DATABASE_NAME
    • Değer: yapılacaklar
13. Tamam'ı seçin.
14. Kaydet'i seçin.

4. Sitenize gidin

Artık statik web uygulamasını keşfedebilirsiniz.

1. Azure portalında Genel Bakış'ı seçin.
2. Sağ üst köşede görüntülenen URL'yi seçin.
   1. gibi https://calm-pond-05fcdb.azurestaticapps.netgörünür.
3. Görev listenizi görmek için Lütfen oturum açın'ı seçin.
4. Uygulamaya erişmek için onay ver'i seçin.
5. Yeni liste oluştur etiketli metin kutusuna bir ad girip Kaydet'i seçerek yeni bir liste oluşturun.
6. Yeni öğe oluştur etiketli metin kutusuna başlık yazarak ve Kaydet'i seçerek yeni bir görev oluşturun.
7. Görevin görüntülendiğini onaylayın (biraz zaman alabilir).
8. Denetimi seçerek görevi tamamlandı olarak işaretleyin; görev sayfanın Bitti öğeleri bölümüne taşınır.
9. Veritabanının kullanıldığını onaylamak için sayfayı yenileyin.

Kaynakları temizleme

Bu uygulamayı kullanmaya devam etmeyecekseniz aşağıdaki adımları izleyerek kaynak grubunu silin:

1. Azure portalına geri dönün.
2. Kaynak grupları’nı seçin.
3. aswa-mongoose öğesini seçin.
4. Kaynak grubunu sil'i seçin.
5. Metin kutusuna aswa-mongoose girin.
6. Sil'i seçin.

Sonraki adımlar

Yerel geliştirmeyi yapılandırmayı öğrenmek için sonraki makaleye geçin...

Yerel geliştirmeyi ayarlama