Azure Mobile Apps ile Avalonia uygulaması oluşturma

Not

Bu ürün kullanımdan kaldırıldı. .NET 8 veya üzerini kullanan projelerin yerini alması için bkz. Community Toolkit Datasync kitaplığı.

Avalonia, tek bir kod tabanından Windows, macOS, Linux, iOS, Android ve Web Derlemesi için .NET GUI uygulamaları oluşturmanıza olanak tanır. Bu öğreticide, Azure Mobile Apps ve Azure mobil uygulama arka ucu kullanarak Windows Avalonia masaüstü uygulamasına bulut tabanlı arka uç hizmeti ekleme adımları gösterilmektedir. Hem yeni bir mobil uygulama arka ucu hem de Azure'da uygulama verilerini depolayan basit bir Yapılacaklar listesi uygulama oluşturacaksınız.

Azure Mobile Apps'i kullanma hakkındaki diğer tüm Avalonia öğreticilerinden önce bu öğreticiyi tamamlamanız gerekir.

Önkoşullar

Bu öğreticiyi tamamlamak için şunları yapmanız gerekir:

• Visual Studio 2022 aşağıdaki iş yükleriyle.
  • ASP.NET ve web geliştirme
  • Azure geliştirme
  • .NET masaüstü geliştirme
• Visual Studio için Avalonia uzantısı.
• Azure hesabı.
• Azure CLI.
  • az login ile oturum açın ve başlamadan önce uygun aboneliği seçin.
• (İsteğe bağlı) azure geliştirici CLI.

Avalonia Mac veya Windows üzerinde derlemeyi desteklese de, bu öğreticide Windows ve Visual Studio 2022 kullandığınız varsayılır. Avalonia'nın geliştirme süreci hakkında bilgi edinmek için Avalonia öğreticisi adım adım yürümenizi öneririz.

Örnek uygulamayı indirme

1. azure-mobile-apps deposunu tarayıcınızda açın.

2. Code açılan listesini açın ve zipindir'i seçin.

   

3. İndirme işlemi tamamlandıktan sonra İndirmeler klasörünüzü açın ve azure-mobile-apps-main.zip dosyasını bulun.

4. İndirilen dosyaya sağ tıklayın ve Tümünü Ayıkla...seçin.

   İsterseniz, arşivi genişletmek için PowerShell'i kullanabilirsiniz:

   C:\Temp> Expand-Archive azure-mobile-apps-main.zip
   

Örnekler, ayıklanan dosyaların içindeki örnekleri klasöründe bulunur. Hızlı başlangıç örneği TodoAppolarak adlandırılır. TodoApp.sln dosyasına çift tıklayarak örneği Visual Studio'da açabilirsiniz.

Arka ucu Azure'a dağıtma

Not

Arka ucu zaten başka bir hızlı başlangıçtan dağıttıysanız, aynı arka ucu kullanabilir ve bu adımı atlayabilirsiniz.

Arka uç hizmetini dağıtmak için şunları yapacağız:

• Azure'a bir Azure App Service ve Azure SQL Veritabanı sağlama.
• Hizmet kodunu yeni oluşturulan Azure App Service'e dağıtmak için Visual Studio'yu kullanın.

Tüm adımları tamamlamak için Azure Geliştirici CLI'sini kullanma

TodoApp örneği, Azure Geliştirici CLI'sını destekleyecek şekilde yapılandırılmıştır. Tüm adımları (sağlama ve dağıtma) tamamlamak için:

1. Azure Developer CLIyükleyin.
2. Bir terminal açın ve dizini TodoApp.sln dosyasını içeren klasörle değiştirin. Bu dizin azure.yamlde içerir.
3. azd upçalıştırın.

Azure'da henüz oturum açmadıysanız tarayıcı, oturum açmanızı istemek için başlatılır. Daha sonra kullanmak üzere bir abonelik ve Azure bölgesi istenir. Ardından Azure Geliştirici CLI'si gerekli kaynakları sağlar ve hizmet kodunu seçtiğiniz Azure bölgesine ve aboneliğine dağıtır. Son olarak Azure Geliştirici CLI'sı sizin için uygun bir Constants.cs dosyası yazar.

Veritabanına doğrudan erişmek istiyorsanız SQL kimlik doğrulama bilgilerini görmek için azd env get-values komutunu çalıştırabilirsiniz.

Azure Geliştirici CLI ile adımları tamamladıysanız sonraki adıma geçin. Azure Geliştirici CLI'sini kullanmak istemiyorsanız, el ile uygulanan adımlarla devam edin.

Azure'da kaynak oluşturma.

1. Bir terminal açın ve dizini TodoApp.sln dosyasını içeren klasörle değiştirin. Bu dizin azuredeploy.jsonde içerir.

2. Azure CLI kullanarak oturum açtığınızdan ve bir abonelik seçtiğinizden emin olun.

3. Yeni bir kaynak grubu oluşturun:

   az group create -l westus -g quickstart
   

   Bu komut, Batı ABD bölgesinde quickstart kaynak grubunu oluşturur. İstediğiniz bölgeyi seçerek orada kaynak oluşturabilirsiniz. Bu öğreticide bahsedilen her yerde aynı adı ve bölgeyi kullandığınızdan emin olun.

4. Grup dağıtımı kullanarak kaynakları oluşturun:

   az deployment group create -g quickstart --template-file azuredeploy.json --parameters sqlPassword=MyPassword1234
   

   SQL Yöneticisi parolanız için güçlü bir parola seçin. Daha sonra veritabanına erişirken ihtiyacınız olacak.

5. Dağıtım tamamlandıktan sonra çıkış değişkenlerini alın, bunlar daha sonra ihtiyacınız olan önemli bilgileri barındırır:

   az deployment group show -g quickstart -n azuredeploy --query properties.outputs
   

   Örnek çıkış:

   

6. Çıkışlardaki değerlerin her birini daha sonra kullanmak üzere not edin.

Hizmet kodunu yayımlama

Visual Studio'da TodoApp.sln açın.

1. Sağ bölmede çözüm gezginiseçin.

2. projesine sağ tıklayın ve başlangıç projesi olarak ayarlaseçin.

3. Üstteki menüde TodoAppService.NET6DerlemeYayımla'yı seçin.

4. Yayımla penceresinde Hedef: Azure'i seçin ve İleribasın.

   

5. Belirli bir hedef: azure app service (Windows)öğesini seçin ve ardından İleribasın.

   

6. Gerekirse oturum açın veuygun bir Abonelik adı seçin.

7. Görünüm'nin Kaynak grubuolarak ayarlandığından emin olun.

8. quickstart kaynak grubunu genişletin ve daha önce oluşturulan App Service'i seçin.

   

9. sonseçin.

10. Yayımlama profili oluşturma işlemi tamamlandıktan sonra Kapat'ı seçin.

11. Hizmet Bağımlılıkları'nı bulun ve SQL Server Veritabanı'nın yanındaki üç noktayı seçin, ardından Bağlanseçeneğini belirleyin.

    

12. Azure SQL Veritabanıöğesini ve ardından İleriseçin.

13. hızlı başlangıç veritabanını ve ardından İleriseçin.

    

14. Dağıtımın çıktılarında yer alan SQL kullanıcı adını ve parolasını kullanarak formu doldurun, ardından İleriseçin.

    

15. sonseçin.

16. tamamlandığında kapat'ı seçin.

17. Uygulamanızı daha önce oluşturduğunuz Azure App Service'e yayımlamak için Yayımla'ı seçin.

    

18. Arka uç hizmeti yayımlandıktan sonra bir tarayıcı açılır. URL'ye /tables/todoitem?ZUMO-API-VERSION=3.0.0 ekleyin:

    

Örnek uygulamayı yapılandırma

İstemci uygulamanızın onunla iletişim kurabilmesi için arka ucunuzun temel URL'sini bilmesi gerekir.

Hizmeti sağlamak ve dağıtmak için azd up kullandıysanız, Constants.cs dosyası sizin için oluşturulmuştur ve bu adımı atlayabilirsiniz.

1. TodoApp.Data projesini genişletin.

2. TodoApp.Data projesine sağ tıklayın ve >Sınıfı Ekle... öğesini seçin..

3. Ad olarak girin, ardındanEkle seçin.

   

4. Constants.cs.example dosyasını açın ve içeriği kopyalayın (Ctrl-A ve ardından Ctrl-C).

5. Constants.csgeçiş yapın, tüm metni vurgulayın (Ctrl-A), ardından örnek dosyadaki (Ctrl-V) içeriği yapıştırın.

6. https://APPSERVICENAME.azurewebsites.net hizmetinizin arka uç URL'si ile değiştirin.

   namespace TodoApp.Data
   {
       public static class Constants
       {
           /// <summary>
           /// The base URI for the Datasync service.
           /// </summary>
           public static string ServiceUri = "https://demo-datasync-quickstart.azurewebsites.net";
       }
   }
   

   Hizmetinizin arka uç URL'sini Yayımla sekmesinden alabilirsiniz. https URL kullandığınızdan emin olun.

7. Dosyayı kaydedin. (Ctrl-S).

Örnek uygulamayı derleme ve çalıştırma

1. Çözüm gezgininde others klasörünü genişletin.

2. projesine sağ tıklayın ve başlangıç projesi olarak ayarlaseçin.

3. Üst çubukta Herhangi bir CPU yapılandırması ve TodoApp.AvaloniaUI hedefini seçin:

   

4. Projeyi oluşturmak ve çalıştırmak için F5 basın.

Uygulama başlatıldıktan sonra, metin kutusu içeren boş bir liste görürsünüz. Şunları yapabilirsiniz:

• Metin girin, ardından öğeyi eklemek için + simgesine basın.

• Herhangi bir öğeyi tamamlandı olarak işaretlemek için onay kutusunu ayarlayın veya temizleyin.

• Hizmetten verileri yeniden yüklemek için yenileme simgesine basın.

  

Sonraki adımlar

uygulamaya kimlik doğrulaması ekleyerek öğreticiye devam edin.