Azure Websitesini Kaynak Kontrolünden Yayınlama

banner

Bu makalemde Azure ile oluşturduğumuz websitemizi Team Foundation Server kaynak kontrolündeki bir projejeden nasıl yayınlayacağımızdan (deploy) bahsedeceğim. Normalde yaptığımız işlem, Visual Studio‘dan sitemizi “publish” etmekti. Şimdi ise websitemiz kendini bulut üzerindeki bir projeden güncelleyecek. Bu özellikle takım projeleri için oldukça yararlı bir pratiktir. Bunun için Visual Studio Online’dan faydalanacağız. Visual Studio Online, tıpkı Git gibi takım projelerinizin kaynak kodlarını saklamanız için size depolar (repository) sağlayan bir uygulamadır. Ayrıntılı bilgiye bu sayfadan ulaşabilirsiniz. Azure websitenizi, Visual Studio Online’daki bir projeyle ilişkilendirdiğinizde, websiteniz o projedeki kodlara göre kendini güncelleyecektir.

Azure yönetim portalından yeni bir Visual Studio Online hesabı oluşturmak için New > App Services > Visual Studio Online > Quick Create butonuna tıklayıp uygun bir isim girmeniz ve bir bölge seçmeniz gerekir. Şimdilik herhangi bir Azure Active Directory’ye bağlama işlemi yapmayacağız. İsterseniz Azure aboneliğinizi oluşturuken kullandığınız Live ID ile açtığınız başka bir Visual Studio Online hesabınız varsa, o hesabınızı da Quick Create yerine Link to Existing butonuna basarak Azure aboneliğinize bağlayabilirsiniz.

new2

Şimdi sırasıyla diğer işlemlerimizden bahsedelim.

1 – Visual Studio Online’da Yeni Bir Proje Oluşturma

Bunun için yapmanız gereken, tarayıcınızın adres çubuğuna Visual Studio Online hesabınızın adresini girmek. Örneğin benim hesabımın adresi hvarlik.visualstudio.com.

new3

Karşınıza gelen sayfada New linkine tıkladığınızda bir pencere açılacak. Bu açılan pencerede projenize ait bilgileri girip Create Project butonuna bastığınızda, proje sizin için oluşturulacaktır. Ben bu makalem için örnek olarak MerhabaTFS isminde bir proje oluşturdum. Projeniz oluşturulduktan sonra aynı ekrandaki Navigate to Project butonuna basarak projenize ait sayfayı açabilirsiniz.

new-project-vso

2 – Projeyi Visual Studio Online’a Göndermek

Şimdi Visual Studio’da, daha önceden örnek olarak oluşturduğum ve Azure Websiteleri’ni kullanarak yayınladığım MerhabaTFS isimle asp.net web uygulamasını açıyorum. Uygulamanın tek yaptığı şey ekrana Merhaba TFS yazmak. Ne orijinal ama 🙂 Öncelikle yapmam gereken, projeyi bir kaynak kontrolüne eklemek. Bunun için solution ismine sağ tıklayıp Add Solution to Source Control‘e basıyorum.

add-sol-to-source-control

Çıkan ekrandan Team Foundation Version Control seçeneğini seçiyorum ve OK butonuna basıyorum. Bu işlemi yaptıktan sonra karşınıza gelen pencerede, Visual Studio Online hesabınızda oluşturduğunuz bir projeyi seçmeniz gerekecek. MerhabaTFS isimli projemizi seçiyoruz ve OK butonuna basıyoruz.

team-project-location

Şimdi bu değişiklikleri Visual Studio Online hesabımızdaki MerhabaTFS isimli projeye de göndermemiz gerek. Visual Studio’da Team Explorer panelini açıyoruz ve Pending Changes seçeneğine tıklıyoruz. Karşımıza aşağıdakine bence bir ekran gelecek. Comment alanına istediğimiz bilgiyi girip Check In butonuna basıyoruz.

first-check-in

İşlem tamamlandıktan sonra Visual Studio Online hesabımızdan MerhabaTFS isimli projemizi açıyoruz. Code linkine tıklayarak projenize ait kodları görebilirsiniz.

vso-code-after-first-checkin

3 – Bir Azure Web Sitesini Kaynak Kontrolüne İlişkilendirme

Geçelim kaynak kontrolünü web sitesi ile ilişkilendirmeye. Azure yönetim portalından ilişkilendirmek istediğiniz siteye tıklayın. Ben, merhabatsf isimli sitemi kullanıyor olacağım. Site ismine tıkladığınız zaman gelen ekrandaki Set up deployment from source control linkine tıklayalım.

integrate-source-controlll

Daha sonra yapmamız gereken 3 işlem var. Birincisi, kaynak kodun olduğu sağlayıcıyı seçmek. Biz, kaynak kontrolü sağlayıcısı olarak Visual Studio Online’ı seçeceğiz.

set-up-deploy-1

İkincisi, visual studio online hesabınızın ismini girip Authorize Now linkine tıklayıp, çıkan ekrandaki Accept butonuna basarak hesabınızı tanıtmak.

set-up-deploy-2

Üçüncüsü ise depo (repository) seçmek. Biz burada depo olarak MerhabaTFS’yi seçeceğiz.

set-up-deploy-3

Eğer ilişkilendirme işleminiz başarıyla gerçekleşirse aşağıdakine benzer bir ekranla karşılaşacaksınız.

set-up-deploy-deployment-tab

4 – Visual Studio’da Build Definition Oluşturma

Son olarak yapmamız gereken işlem, Visual Studio’daki Team Explorer panelinden yeni bir Build Definition oluşturma. Team Explorer anasayfasındaki Build butonuna, ardından New Build Definition butonuna tıklayalım. Açılan sayfadaki General sekmesinden Build Definition için bir isim girelim. Queue processing bölümünde Enabled seçeneğinin işaretli olduğundan emin olalım.

build-def-name

Sonra Trigger sekmesine geçelim. Ben, her check-in yapışımda, uygulamamın yayınlandığı Azure websitesinin yaptığım son değişikliğe göre güncellenmesini istediğim için Continuous Integration seçeneğini işaretliyorum.

build-each-check-in

Yapmamız gerekenlerin hepsi bu kadar. Şimdi denemek için Visual Studio ile web uygulamanızda bir değişiklik yapın ve check-in yaparak Visual Studio Online’daki projenizi güncelleyin. Check-in yaptıktan sonra Team Explorer’dan Build’e tıklayın. Oluşturduğunuz Build Definition’ın otomatik olarak başlatıldığını göreceksiniz. Herhangi bir sorun çıkmazsa bir müddet sonra build işlemi tamamlanacaktır. Akabinde websitenizi açtığınınızda yaptığınız güncellemeyi göreceksiniz.

Şu ana kadar yaptığımızın bir özetini geçeyim. Amacımız, yayınladığımız Azure websitesinin, Visual Studio Online’daki bir projemizin kaynak kodlarına göre kendini otomatik olarak güncellemesiydi. Yani yayınlama işlemimizi büyük ölçüde bulut üzerinden gerçekleştirmek. Bunun için neler yaptık:

  • Visual Studio Online’da yeni bir proje oluşturduk.
  • Azure Web Siteleri’ni kullanarak yayınladığımız bir web uygulamasını Visual Studio aracılığı ile Visual Studio Online’daki projemize ekledik.
  • Azure yönetim portalından istediğimiz bir websitesini açtık ve bu websitesini Visual Studio Online’daki projemiz ile ilişkilendirdik. Daha sonra websitesini görüntülediğimizde, siteniz kaynak kodlara göre kendini güncellediğini gördük.
  • Son olarak Visual Studio Online’daki kaynak kodlar her değiştiğinde Azure’daki websitemizin kendini güncellemesi için Visual Studio’da yeni bir Build Definition oluşturduk. Bu build definition’ın her check-in yapışımızda çalışmasını sağlamak için Continuous Integration seçeneğini işaretledik.

Kolay gelsin…

Hatice Varlık

@varlikhatice

Leave a Reply

  

  

  

%d blogcu bunu beğendi: