1. Ana Sayfa
  2. Microsoft Azure
  3. Azure Static Web Apps – Bölüm 2: Azure DevOps

Azure Static Web Apps – Bölüm 2: Azure DevOps

featured

İlk bölümde Azure Static Web Apps üzerine GitHub üzerinde bulunan bir Blazor uygulamasını GitHub actions ile deploy etmiştim. Bu bölümde ise GitHub yerine Azure DevOps kullanarak, Azure Repos üzerinde bulunan bir Blazor uygulamasını Azure Pipelines ile Azure Static Web Apps’e deploy edeceğim. Aynı Azure Static Web Apps servisini kullanmak yerine onu silerek yeni bir tane oluşturuyorum. Bu kez Deployment details altında Other seçerek devam ediyorum (Resim-1).

Resim-1

Şimdi sırada yeni bir Azure DevOps projesi oluşturmaya geldi, myblazorapp adında yeni bir proje oluşturuyorum (Resim-2)

Resim-2

Repos-Files altında ise Clone ve mevcut repoyu push etmek için gerekli komutlar var. Local’de bir repo oluşturup onu push ederek devam edelim.

Resim-3

İlk bölümdeki gibi yeni bir Blazor app oluşturduktan sonra, bu kez source control altında Initialize Repository seçeneği ile local bir repo oluşturacağım (Resim-4).

Resim-4

Sonrasında da commit işlemini gerçekleştiriyorum (Resim-5).

Resim-5

Resim-3’te yer alan git remote add ve git push komutlarını terminal üzerinde çalıştırarak local commit’i Azure Repos’a push ediyorum (Resim-6).

Resim-6

Azure Repos altında kaynak kodlar hazır, sırada bu kodları Azure Static Web Apps’a deploy edeceğim bir pipeline oluşturma işlemi var. Bunun için de Set up build butonuna tıklıyorum (Resim-7).

 

Resim-7

Configure your pipeline ekranında, Starter pipeline seçeneği ile devam edeceğim (Resim-8).

Resim-8

Sağ tarafta yer alan Show assistant butonuna tıklayarak mevcut tasklara bakalım (Resim-9).

Resim-9

Çıkan arama çubuğuna “static” yazdığımda henüz preview da olsa Deploy Azure Static Web App task’ını buldum. Eklemeden önce steps altındaki kısımları da siliyorum (Resim-10).

Resim-10

Eklemeden önce doldurmam gereken alanlar var. İlk bölümden de hatırlayacağınız App Location ve Output Location ‘a ek olarak bir de Azure Static Web Apps Api Token bilgisine ihtiyacım var. Hangi servise bağlanacağı ve gerekli yetkilendirme işlemleri bu değer altında yer alıyor (Resim-11).

Resim-11

Deployment token bilgisini almak için Azure Portal üzerinden Static Web App servisinin Overview sekmesine geliyorum ve burada yer alan Manage deployment token butonuna tıklıyorum ve token’ı kopyalıyorum (Resim-12).

Resim-12

Artık her şey hazır, Save and run butonuna tıklıyorum (Resim-13).

Resim-13

Pipeline çalışmaya başladı, buradan hangi işlemlerin gerçekleştiğini detayı bir şekilde takip edebilirsiniz (Resim-14).

Resim-14

Pipeline bittikten sonra da Static Web App url’e tıklayarak uygulamanın çalıştığını görebilirsiniz. Burada Settings altında yer alan Environments sekmesinin disabled olduğunu farketmişsinizdir. Azure DevOps seçeneğinde Environments kullanılmıyor.

Resim-15

Bu konuyla ilgili sorularınızı http://forum.mshowto.org linkini kullanarak ulaşacağınız forum sayfamızda sorabilirsiniz.

Referanslar

www.mshowto.org

https://docs.microsoft.com/en-gb/azure/static-web-apps/overview 

TAGs: Azure, Azure DevOps,  Azure Repos, Azure Pipelines, Git, Azure Static Web Apps, Static Web App, Development, Blazor, CI/CD, Visual Studio Code, VSCode

Yorum Yap

Yazar Hakkında

Mert Yeter, lisans eğitimini Yıldız Teknik Üniversitesi'nde, yüksek lisans eğitimini ise Bahçeşehir Üniversitesi'nde tamamlamıştır. Yazılım dünyasına üniversitenin ilk yıllarında aldığı QBasic ile başlayan Mert, .NET ve SQL Server gibi Microsoft teknolojileri ile devam etmiş; yüksek lisans tezini ise Linux konusunda yapmıştır. Netaş ve Ziraat Teknoloji gibi sektörün önde gelen firmalarında C#, .NET, SQL Server, Cisco Contact Center ürünleri ve Linux üzerine çalışmış, bir çok firmaya da bu konularda danışmanlık vermiştir.

Yorum Yap