Zen-Coding ile Zen Sanatı Hızıyla Kodlama

zen-coding

Zen-Coding; evet artık kodlama da zen sanatına girmiş bulunuyoruz. Gülümseme Uçmuş bunlar dediğinizi duyar gibiyim.. Fakat merak etmeyin, kastettiğimiz o derece bir zen değil. Fakat sizi temin ediyorum sizleri rahatlatacak bir kodlama tekniğinden bahsedeceğim. Tabii sizleri derken aslında parmaklarınızı rahatlatacak bir tekniği kastediyorum. Çünkü az kelime ile çok kod yazmayı size göstereceğim.

Videolarımı izleyenler mutlaka fark etmişlerdir. HTML DOM’u kodlarken, bazı kısa ifadeler yazıp bunların otomatik olarak zaman alacak HTML DOM’lara dönüşmesini sağladığımı fark etmişlerdir. İşte bu dönüşümler zen-coding olarak isimlendirilen bir eklentinin Visual Studio 2013-2015-2017 ‘e eklenmiş olmasından kaynaklanmaktadır.

Evet.. Aslında o hep orada ama bilip kullanmamız gerekiyor. Bu sebeple Visual Studio lansmanlarını kaçırmamanızı tavsiye ederim.

Aslında bu video’yu daha önce çekmeliydim. Açıkçası anca bunu çekmek aklıma geldi. Fakat sonunda çekip sizlerin de bu özelliği, bu sanatı kullanmanızı şiddetle öneririm. Çok fazla özelliği yok ve alışma evresini kısa zamanda geçiyorsunuz. Ardından zevki yaşamak kalıyor.Gülümseme

Visual Studio 2008 – 2010 – 2012 ‘de bu özelliği Visual Studio Zen Coding isimli extension ile kullanıma açabiliyoruz. Visual Studio 2013-2015-2017 de ise Web Essentials içinde geliyor.

kmb-udemy-reklam

Zen-Coding’de kullanılan birkaç nitelik mevcut, bunlar;

  1. # bir «id» nitelikli element oluşturur.
  2. . bir «class» nitelikli element oluşturur.
  3. [ ] özel nitelik tanımlı element oluşturur.
  4. > alt element oluşturur.
  5. + kardeş element oluşturur.
  6. ^ üst element’e erişir.
  7. * bir işlemin tekrar etmesini sağlar.
  8. $ tekrar eden işlemlerde sayıyı temsil eder.
  9. $$ tekrar eden işlemlerde sayının basamak sayısını temsil eder.
  10. { } element içine metin ekler.

şeklinde gösterebiliriz. Dilerseniz; aşağıdaki sayfalardan da faydalanabilirsiniz. Yazılı örneklere hızlıca ulaşmak açısından olabilir. Ayrıca farklı programlar için zen-coding eklentilerini siteden görebilir ve indirip kurabilirsiniz.

Reklamlar

SASS – Nedir? Visual Studio 2013 ile Entegrasyon

SASS-Syntactically Awesome StyleSheets

Syntactically Awesome StyleSheet…

SASS Nedir? ile SASS video serimize başlıyoruz. Sizlere bu video seri ile SASS ‘ın ne olduğu ve Visual Studio 2013 ile nasıl kullanılabileceğini anlatacağım. Serimizi takip eden videolarda da örneklerle beraber SASS ‘ın en belirgin özelliklerini size aktarıyor olacağım. SASS’ ı Visual Studio olmadan kullanmak isterseniz ücretli ya da ücretsiz(open source) uygulamaları bulunmaktadır. SASS ‘a ait sitedeki install başlığından bu uygulamaları görebilir ve ilgili web sayfalarına giderek indirebilirsiniz. Visual studio 2012 ve 2013 ile kullanmak isterseniz gerekli extension’ı kurmanız gerekmektedir. İster Visual Studio içindeki Tools –> Extension & Updates kısmından isterseniz de aşağıdaki web sayfasından SassyStudio isimli extension’ı indirerek kurabilirsiniz.

SASS dosyalarının uzantısı “.scss” şeklindedir. Visual studio kullanarak oluşturduğunuz bir web projesine sağ tıklayarak Add –> Add New Item diyerek Sass File ekleyebilirsiniz. Bir de Sass Partial File isimli bir dosya daha göreceksiniz. Bu dosyanın normal sass dosyadan farkı yoktur. Dosya adının başındaki “_”(alt çizgi) bu dosyanın önemli kısmıdır. Bu o dosyanın başka projelerde de kullanılabilecek olan bir kod parçası olarak işaretlendiğini belirtir. Yani Sass File’lara birden fazla daha önce yazmış olduğunuz sass partial file import edebilirsiniz.

Örnek bir SASS kodunu da giriş videosu yazımızda sizlerle paylaşmak istiyorum.

$yazi-tipim:    Helvetica, sans-serif; 
$ana-renk: #333;

body { 
    font: 100% $yazi-tipim; 
    color: $ana-renk; 
}

Buradaki kodlamada; sass file üzerinde değişken tanımlamayı görüyorsunuz. “$” simgesini değişken isminin önüne yazarak değişken tanımlıyoruz ve kullanırken de gene “$” simgesini kullanarak istediğimi yerde kullanıyoruz. Formül şu şekilde;

$[değişken_adı] : [değer] ;

Bu örnek sass dosyasını derlediğimizde(compile) – visual studio içinde kaydettiğimiz anda derlenmiş oluyor “.css” dosyamız oluşturuluyor.

body { 
    font: 100% Helvetica, sans-serif; 
    color: #333; 
}

Derleme sonrası; tanımladığımız değişkenleri kullandığımız yerde değişkenin değerlerinin yazıldığını görebilirsiniz. Tabii ki bu sass dosyalarının basit bir özelliği, çok daha fazlası ve gelişmiş yetenekleri var. Bunları ilerleyen videolarımızda sizlere anlatmaya çalışacağım. Bu giriş videosu için bu şekilde bir yazıyı yazarak da sizler için konuya giriş yapmış oluyorum. Video ile sizleri başbaşa bırakıyorum.

kmb-udemy-reklam

GitHub–Visual Studio 2012 ve Visual Studio 2013 Entegrasyonu

Git ve GitHub Serisi ile ilgili diğer videolara aşağıdaki linklerden ulaşabilirsiniz.

  1. Git ve GitHub Nedir? Neden Kullanayım? Nasıl Kurulur?
  2. GitHub Sitesi Hakkında Bilinmesi Gerekenler
  3. GitHub–Online Olarak Çalışmak
  4. GitHub–Offline Kullanmak ve Senkronizasyon

Serimizin bu videosunda artık yavaş yavaş yazılım spesifik kullanıcılara doğru GitHub’ın kullanımına yer veriyor olacağım ki zaten sistemin asıl amacı kodlama alanında hizmet vermek. Fakat farklı sektörlerce de kullanılabilecek esnek bir sistem olduğunu sizlere göstermek ve farklı sektör grubundan insanlarında kullanabilmesi yönünde önceki videolarımda programcılara yönelik, ağırlıkta anlatmadım.

Bu video’dan itibaren artık yazılımcı tarafından GitHub’ı Visual Studio ile ele alıyor olacağız. Tabii ki öncelikle Git, SVN sistemini ve GitHub Push hizmetini Visual Studio 2012 ve 2013 üzerinde kullanabilir hale getirelim. Bu işlemi extension’lar üzerinde ihtiyacımızı gideriyor olacağız. Aslında Visual Studio 2012 için böyle bir extension ile bu ihtiyacımızı gideriyor olacağız. Visual Studio 2013 zaten Git Source Provider entegrasyonu ile gelmektedir. Sadece aktifleştireceğiz.  Sizleri video ile baş başa bırakıyorum.

kmb-udemy-reklam

Visual Studio 2012 Update 4

image

 

Visual Studio 2012 için güncelleme 4 yayınlandı. Bu güncelleme ile aşağıdaki başlıklarda çeşitli sorunlar giderilmiş, detayları için bu sayfadan bilgi edinebilirsiniz.

  • Team Foundation Server
    Windows Forms
    LightSwitch
    Hata ayıklayıcı
    Visual Studio IDE
    Windows geliştirme
    Profil Oluşturucu
    C++
    IntelliTrace
    .NET framework çekirdek
    Varlık Framework Araçları
    Telefon araçları
    Yerelleştirme
    Visual Studio Test
    Grafik tanılama
    Web Araçları
    Tanılama araçları

Bu güncellemeyi yüklemek için Visual Studio 2012 ‘yi açın. Tools menüsü altındaki Extensions & Updates ‘i çalıştırın. Sol tarafta, Updates sekmesini seçerek geçin. Ekranın sağ tarafına güncelleme gelecektir(aktif internet bağlantısı gerekir). Güncellemeyi seçin. Otomatik olarak tarayıcı penceresi açılacak ve güncelleme dosyası indirilecek. Visual Studio 2012’yi kapatın. İndirilen dosyayı çalıştırın ve yükleme adımlarını takip edin.

Tabii büyük bir fincan kahve alıp, arkanıza yaslanmayı da ihmal etmeyin. Bu işlem biraz zaman alacaktır. Göz kırpan gülümseme

SQL Server Data Tools for Visual Studio 2012

Visual Studio 2012 için SQL Server Data Tools’un yeni bir güncellemesi yayınlandı. Visual Studio 2012 için bu güncellemenizi yapmanızı öneririm. “.sql” uzantılı dosyalarla visual studio içinden çalışmamızı sağlayan önemli bir araçtır.

SQL Server Data Tools for Visual Studio 2012.

Visual Studio 2012’de Entity Framework CodeGenerationStrategy ve WCF Sorunu

Visual Studio 2012 ile çalışırken EntityFramework ve WCF ‘i bir arada kullanıyorsanız muhtemelen birkaç sorun ile karşılaşacaksınız. Ben bu sorun ile silverlight uygulaması geliştirirken bir şekilde tanışmış oldum. Öncelikle senaryomuzdan bahsetmek istiyorum.

Sorunun Tespiti;

Visual Studio 2012 ile bir silverlight uygulaması geliştirmek için gerekli projeyi oluşturdum. Projeyi .Net Framework 4.0 ve Silverlight 5 versiyonlarını kullanarak geliştirmek üzere ön ayarlamalarını yaptıktan sonra projemiz planlandığı gibi visual studio 2012 ile oluşturuluyor. Elimizde ilişkili tablolar bulunan bir SQL veritabanı mevcut. Ardından ASP.NET projemize ADO.NET Entity Data Model (EF) ekliyoruz. Modelimiz veritabanından ilişkilendirilmiş tablolarımızı okuyarak ilgili kod üretme işlemini gerçekleştiriyor. ASP.NET projemize silverlight uygulamamız ile veri alışverişinde bulunmak üzere bir WCF servisi ekliyoruz. İlişkili herhangi bir tablodan veri okuyan basit bir metot ekliyoruz. Ardından silverlight uygulamamıza WCF servisimizi Service Reference olarak ekliyoruz. Silverlight uygulamamızdan ilgili metodu çağırdığımız da servis cevabı alınamadığına dair bir hata ile karşılaşacağız. (Bu hata ilişkisiz bir tablodan veri okurken değil ilişkisi bulunan bir tablodan veri okurken meydana geliyor.)

Projenin Oluşturulması

Silverlight Projesinin Ayarlanması

ADO.NET Entity Data Model Eklenmesi

WCF Servisinin Eklenmesi

Silverlight Uygulamasına WCF Servis Eklenmesi ve Kodlama

Silverlight Uygulamasının Çalıştırılması

The remote server returned an error: NotFound.

Oluşan hata şekilden de görüldüğü gibidir. “The remote server returned an error: NotFound.

 

Sorunun Çözümü;

Yukarıda anlattığım  proje adımlarını Visual Studio 2010 ile gerçekleştirdiğinizde böyle bir sorun ile karşılaşmıyorsunuz. Projeniz sağlıklı bir şekilde çalışıyor.

  1. İlk düşündüğüm, Visual Studio 2012 ile gelen Entity Framework ‘ün versiyonunun yükselmiş olmasından kaynaklandığını düşündüm. Visual Studio 2012 üzerindeki projemdeki Entity Framework versiyonunu düşürmeye çalıştım. Bu sonucu etkilemedi.
  2. İkinci düşündüğüm, WCF servisi için yeni bir güncelleme  ya da versiyon yayınlanmış olabileceği ve benim bunu yüklemememden kaynaklı olabileceği idi. Araştırmalarım beni “WCF Data Services 5.2 RTM Tools for Visual Studio 2010/2012” ‘ye yönlendirdi. WCF servis ile ilgili bazı hataları gideren bu Tools’u yükledim. Sorunun çözümüne yaklaştığımı ve sonunda olduğunu düşünürken, tekrar aynı hata ile karşılaşmak çok can sıkıcıydı. Bu da sonucu etkilemedi.
  3. Üçüncü düşündüğüm, Entity Framework’ün ürettiği kod ‘dan şüphelenmem sonucunda oldu. Visual Studio 2012 üzerinde eklediğim ADO.NET Entity Data Model nesnesi ile projeye bir sürü yeni dosya eklendiğini fark ettim. Ayrıca üretilen koddaki miras alınan nesne de farklıydı. Neyden farklıydı diye sorduğunuzu tahmin ediyorum, Visual Studio 2010’da eklediğim ADO.NET Entity Data Model nesnesinden farklı birçok dosya ve kod söz konusuydu. Düşündüm ki eğer Visual Studio 2010 ‘daki kod sorunsuz çalışıyor ise, visual studio 2012 ‘de üretilen kod’a karşı WCF servisi gerekli tepkiyi gösteremiyor. Benim yapmam gereken Visual Studio 2012’de Visual Studio 2010’daki gibi ADO.NET Entity Data Model nesnesinin kod üretmesini sağlamak olmalı !! Bu sefer araştırmamı bunun üzerinde gerçekleştirdim. Ulaştığım bir yazıya buradan ulaşabilirsiniz. Ardından çözüme daha da çok yaklaştıran yazıya da buradan ulaşabilirsiniz. Tabii ki yapılacakları kısaca burada açıklayacağım.

Öncelikle sorun;

ADO.NET Entity Data Model nesnesinin kod üretme şeklinde(bu kesinleşti)

  • Visual Studio 2012 ‘de ADO.NET EF Modelinizi çift tıklayarak designer’ı açın.
  • Designer’da boş bir yere tıklama yaptığınızda “Properties” pencerenizde ilgili özellikler gelecektir.

image

  • Properties penceresindeki “Code Generation Strategy” özelliğinin değerini “Default” olarak değiştirin.

image

  • Ardından Solution Explorer’da Model’inize ait “*.tt” uzantılı dosyaları silin.

image

  • Modelinizin bulunduğu projenizi “Rebuild” ile yeniden derleyin.

image

  • Projenizi F5 ile çalıştırdığınızda WCF servisinizin sorun vermeden çalıştığını göreceksiniz.

 

Çözüm basit görünüyor. Sorunun tespitinde baya bir uğraştığımı ve farklı senaryolar düşündüğümden farklı noktalara gittiğimi farketmişsinizdir. Burada kolayca okuduğunuz bu sorun beni 3-4 gündür oyalıyordu. Açıkçası işimi Visual Studio 2010 üzerinden götürdüm fakat sorunu çözmem beni çok sevindirdi. Sizin içinde aynı şekilde hissettireceğiniz düşünüyorum.

 

#amenities