Asp.Net Core JavaScript Hizmetleri, Otomatik Güncelleme

Bir önceki makalemle girişini yaptığımız Asp.Net Core JavascriptServices’i incelemeye devam edelim. Bu makalemde Asp.Net Core JavascriptServices’in yazılım geliştiricilerin hayatını kolaylaştıran bir diğer özelliği olan otomatik güncellemelerden bahsedeceğim.

Bu makalemde de Yeoman şablonlarını kullanacağımız için giriş makalesinde paylaştığım şekilde şablonların kurulumunu yapmadıysanız şimdi tam zamanı;

npm install -g yo generator-aspnetcore-spa

Örnek projemizi koyacağımız bir klasör oluşturalım;

mkdir enterprisecoding-sample

Daha sonra bu klasör içerisinde kurulumunu az önce yaptığımız aspnetcore-spa generator’ünü çalıştıralım;

cd enterprisecoding-sample
yo aspnetcore-spa

Önceki makalemizden farklı olarak bu defa da bir React örneği üzerinden gidelim;

Yeoman generator'de Framework olarak React seçelim

Framework seçimi ve proje adını verdikten sonra Yeoman generator bizim için gerekli modülleri hazırlayacaktır.

Yeoman şablonu, projeyi bizim için oluşturarak gerekli modülleri yükleyecektir

Yeoman’ın işini bitirmesi ardından aşağıdaki komutla örnek uygulamamızı çalıştırarak herşeyin yolunda gittiğini teyit edebilirsiniz;

dotnet run

Uygulamamız çalışmaya başlayacaktır. http://localhost:5000 adresinden ziyaret edebilirsiniz.

Projemizi çalıştırdığımızda açılış sayfası bizi karşılayacaktır

Projemizin çalıştığını da gördüğümüze göre, sıra otomatik güncellemeleri deneyimlemekte. Bunun için öncelikle uygulamamız çalışıyorsa durduralım ve geliştirme modunu ayarladıktan sonra yenin başlatalım. Geliştirme modu için yapmanız gereken ASPNETCORE_ENVIRONMENT ortam değişkenine Development değerini vermek olacak. Windows ortamında çalışıyorsanız bunu aşağıdaki komut yardımıyla komut satırından yapabilirsiniz;

set ASPNETCORE_ENVIRONMENT=Development

Eğer benim gibi Mac ya da Linux üzerinde çalışıyorsanız kullanmanız gereken komut aşağıdaki olmalı;

export ASPNETCORE_ENVIRONMENT=Development

Bu basit işlem ardından uygulamayı aşağıdaki şekilde yeniden başlatalım;

dotnet run

Uygulamamız çalışır durumda iken herhangi bir statik dosya (ts, tsx, css, html gibi) üzerinde değişiklik yapalım. Ben tercihimi ana sayfa içeriği olduğu için Home.tsx dosyasından yana kullandım;

Statik bir içeriği değiştirelim

TypeScript dosyası içerisinde yer alan string ifadeyi değiştirip saklamam ardından otomatik olarak bu kod javascript’e dönüştürüldü, javascript dosyasındaki değişiklik farkedilerek arayüz yenilendi;

TypeScript dosyasında yapılan değişiklik anında uygulamaya yansıyacaktır

Klasik süreçte bu işlem için öncelikle uygulamayı sonlandırmanız, ardından TypeScript’te javascript’e dönüşümü yapmanız, son olarak da uygulamayı yeniden başlatarak son kaldığınız duruma geri getirmeniz gerekmekteydi. Özellikle statefull bir uygulamada bu sürecin ne kadar acı vereceğini tahmin edersiniz. Dolayısıyla yukarıdaki kullanımın biz geliştiriciler için nasıl bir nimet olduğunu anlatmama gerek olmadığını düşünüyorum.

Detaylarını paylaştığım bu süreç arkaplanda giriş makalesinde de paylaştığım WebPack geliştirici orta-katmanı ve Canlı modül değişimi (Hot Module Replacement, HRM) özelliklerini kullanmakta. Şimdilik React uygulamaları için ts, tsx v.b. dosyaları desteklerken; Knockout/Angular için sadece html dosyalarını desteklemekte.

Fatih Boy

Ankara'da yaşayan Fatih, bir kamu kurumunda danışman olarak çalışmaktadır. ALM süreçleri, kurumsal veri yolu sistemleri, kurumsal altyapı ve yazılım geliştirme konularında destek vermektedir. Boş zamanlarında açık kaynak kodlu projeler geliştirmeyi ve bilgisini yazdığı makalelerle paylaşmayı seven Fatih, aynı zamanda Visual C# ve Visual Studio teknolojileri konusundan Microsoft tarafından altı yıl üst üste MVP (En Değerli Profesyonel) ödülüne layık görülmüştür. İş hayatı boyunca masaüstü uygulamaları, web teknolojileri, akıllı istemciler gibi konularda Asp.Net, Php, C#, Java programlama dilleri ve MySql, MsSql ve Oracle gibi veritabanı yönetim yazılımları ile çalışmıştır. İngilizce ve Türkçe olarak yayınlanan makalelerini gerek İngilizce bloğunda, gerekse de Türkçe bloğunda bulabileceğiniz gibi web sitesinden de açık kaynak kodlu geliştirdiği yazılımlarına ulaşabilirsiniz. vCard - Twitter - Facebook - Google+

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir