• Feb
  • 16
  • 2014

NedirTV, 8. yıl etkinliği 1 Mart’da…

Tags: | View: 274 | Comments:

Nedir-TVNedirTv‘nin her yıl düzenlenen etkinliği, bu sene 8.si ile 1 Mart 2014 Cumartesi günü Bahçeşehir Üniversitesi’nin Beşiktaş kampüsünde. Her zamanki gibi çeşitli konularda, oldukça keyifli sunumlar sizleri bekliyor olacak.   Burak Selim Şenyurt, Ercan Bozkurt, Muhammed Cuma Tahiroğlu
ve Nezih Tınas’ın sunumlarının olacağı bu etkinliğe bu adresten ücretsiz bir şekilde üye olarak katılımınızı belirtebilirsiniz. Etkinliğin programı aşağıdaki gibi;

 

10:00 Gizli Tehlike: Anti-Patterns
11:10 Yazılım Geliştirmede Sadelik (Lean Software Development)
12:20 Bilişim Sektöründeki Saçma Kariyer Planları
14:00 Yazılımcılar İçin Kişisel Gelişim ve Zaman Yönetim Taktikleri
15:10 Yazılımcı Perspektifinden NoSQL

 

  • Feb
  • 10
  • 2014

Seattle

Tags: | View: 290 | Comments:

Geçen hafta Seattle’a gitme fırsatı yakaladım. Amerika’ya da ilk defa gidiyor olduğumdan benim için oldukça heyecanlı ve zevkli bir zaman dilimi oldu. Müzikle az çok ilgilenenler grunge’ın çıkış noktasının Seattle olduğunu ve Nirvana, Pearl Jam, Alice In Chains, Soundgarden, Melvins gibi grupların buradan çıktığını bilir. IT sektörü ile haşır neşir olanlar da, Microsoft, Amazon gibi şirketlerin merkezlerinin Seattle’da olduğunu duymuştur. Bu iki konuda hayatımda önemli bir nokta olduğu için, benim için heyecanlı bir seyahetti…Neyse…

Space NeedleABD’de başka bir yere gitmediğim için çok bir karşılaştırma yapamacağım oralar ile. Ancak İstanbul’a göre oldukça küçük, huzurlu ve rahat bir şehir…Ya da bölge…Ya da ne zıkkımsa işte… Belki biraz Ankara… 2 milyon ile ikisinden de küçük, o yüzden çok da mantıklı bir karşılaştırma yapmadım sanırım. Asıl olay huzurlu ve rahat bir yer olması işte.

Amerika’nın en kuzeyinde, Kanada sınırında olması biraz soğuk ve genel olarak yağmurlu bir havaya sahip olmasında büyük etken olsa da, umulduğu gibi çok fazla kar yağan bir yer değil(miş). Ben kışın ortasında kar ile karşılanırım diye umuyordum ki, güneşli bir hava ile karşılaştım. Eeee daha demin soğuk demiştin, şimdi güneş diyorsun diyenlere, Seattle’da güneşin sadece aydınlatma amaçlı olduğunu söyleyebilirim. Bunun dışında sıcaklık konusunda pek bir etkisi yok…Ciddi ciddi soğuk yani…Ama bir Ankara’lı olarak, yemişim Seattle’ın soğunu…

Space NeedleSeattle, çok fazla turistlik bir yer değil. Şunu yapmaya gidim, şunu görmeye gidim diyecek pek bir şey yok…Haa biraz kuzeyinde kayak açısından extreem sporlar yapabileceğiniz dağlar varmış ama bilemiyorum. Bunun dışında Space Needle ve EMP Museum, Seattle’ın en büyük turist atraksiyon yerleri…Space Needle, Ankara’yı ve Atakule’yi bilenler için çok yeni bir şey değil. Tıpkısının aynısının, “Made In USA” etiketli olanı. Biraz daha büyük, biraz daha uzun…Komple bütün Seattle’ı görebiliyorsunuz. Turist atraksiyonu olması adına gidilip, bol bol fotoğraf çekilebilir. Tepede ayrıca bir restoran var, döne döne yemek yiyebiliyorsunuz. Gece, ışıklı bir Seattle manzarası ile değişik bir tecrübe olabilir…

Space Needle’ın hemen aşağısında EMP Museum var. Bence Seatle’da mutlaka gidilmesi gereken yegane yer…Gerçi genel olarak sergileri nasıl oluyor bilemiyorum ama benim bulunduğum zaman diliminde Nirvana, Jimi Hendrix ile oldukça ayrıntılı bölümler, Icons of Science Fiction adında bilim kurgu dünyasının televizyon ve sinemadaki örneklerinden örnekler, korku sinemasına ayrıl bir bölüm, Block By Block adında legodan yapılmış gökdelenlerin sergilendiği bir bölüm ve Martin Schoeller’in Close Up fotoğraf sergisi vardı. Lego ve Martin Schoeller dışındakiler sanırım sürekli sergi.

EMP

Müzede ayrıca oldukça geniş bir mini-stüdyo(lar) var. Bunlara arkadaşlarınız ile girip, jam session yapabiliyorsunuz. Gitardan,davula oldukça eğlenceli zaman geçirebileceğiniz bir şekilde yapmışlar. Oldukça uzun bir zaman geçirdim diyebilirim müzede. Bir an bile sıkılmadım…Bu arada müze, Microsoft kurucularından Paul Allen’nın ön ayak olup, kurduğu bir müze. Bu notu da eklemeden geçmiyim…Paul Allen, Seattle’ın sanırım fahri sahibi bu arada…

Space Needle’dan şehir merkezine(downtown) bölgesine 30-35 dakikada yürüyerek gidebiliyorsunuz. Tavsiye ederim. Sokak dolaşmasını seven biri olarak genelde tercih ettiğim bir ulaşım yöntemi olan tabanway’ı Seattle’da oldukça kullandım diyebilirim. (:

IMG_4401

Downtown bölgesinde Pike Place Market, Seattle’ın en orjinal ve gezmesi keyifli yerlerinden biri. Adından anlaşılacağı üzere bizdeki pazarlar gibi bir yer. Sadece kapalı bir mekan. Yemek yiyebileceğiniz yerlerden, meyve-sebze satışı yapan yerlere, eski eşya satan dükkanlardan, el işi ıvır zıvır satan stantlara kadar oldukça çeşit sizi bekliyor. Dükkanlara girip kafayı yemek mümkün…

Seattle, Starbucks’ın ilk açıldığı yer. Kahve sevenler için ilk Starbucks’ı da Pike Place Market’in karşısında bulabilirsiniz. İçini aynen korumuşlar. Ben çok ilgilenmedim ama önünde ve içinde ciddi bir kalabalık vardı. Downtown’dan şehrin güneyine doğru Pioneer Square’e doğru yürüyüp, biraz daha sokak gezip belki değişik bir şeylere rastlamanız mümkün. Pioneer Square, Seattle’ın eski bir merkezi olduğundan gezerken binalar falan biraz daha göze hoş geliyor. Ama Downtown’un hareketi ve kalabalıklığı yok.

IMG_4411Seattle’ın çevresi bilimum park ve göllerden oluşmakta, dolayısıyla gezecek oldukça yer var. Ama tabi kışın soğukta pek mantıklı olmuyor. Seattle ve çevresi aynı zamanda bir çok teknoloji firmasının merkezini bünyesinde barındırıyor. Bellevue ve Redmond’da ki Microsoft ofisleri ve kampüsü sanırım bu açıdan Seattle ile en özdeşmiş yer. Amazon’nun da merkezi, Cisco,Google, Facebook, Blackberry gibi firmalarında ciddi anlamda önem verdikleri ofisleri burada. IT sektörü içerisinde, yazılım ile uğraşıyorsanız özellikle Redmond’a gitmenizi tavsiye ederim. Ayrıca Boeing’in de merkezi ve fabrikası burada, hatta kendi müzesi bile var. Ama ne yazık ki gitme şansım olamadı ):

9 günlük Seattle seyahatimin en akılda kalıcı yanı sanırım SuperBowl’du…Amerikan futbolunun bu en önemli finaline, Seattle’ın SeaHawks takımı kalmış. Benim hiç alakam olmasa da, bir hafta boyunca Seattle’da ki tek olay bu maça hazırlıktı. Bütün restoran ve cafelerde bu maça hazırlık, tüm Seattle’da yaşayanların üstünde formalar, arabalarda bayraklar herkes bu maçı bekliyordu. Maçı izleme ve sonrasına katılma şansım ne yazık ki olamadı ama bir haftalık hazırlığın, SeaHawks galibiyeti ile doruk noktasına ulaştığı haberlerini aldım. Go SeaHawks…Seneye de katıl da, belki yine denk gelirim :D

IMG_4442 IMG_4444 IMG_4347

2014’e kıtalar arası gezi olayı ile başladım…Bakalım bu sene bizi nereye götürecek…2014’ün ilk yazısı oldu…Bayadır ihmal etmişim bu arada onu fark ettim…Ayıp bana…

  • Nov
  • 25
  • 2013

TypeScript ve “interface”…

Tags: , , | View: 444 | Comments:

TypeScript’de interface kavramı,  Javascript’deki, genişletilebilirliği sağlayan en esnek yapı. Normalde Javascript’de interface kavramı bildiğiniz üzere yok. Dolayısıyla type-safe bir yapı oluşturmak, doğası gereği zor. TypeScript’de ki interface’ler temel olarak bu zorluğu ortadan kaldırmak için geliştirilmiş diyebiliriz.

TypeScript’deki interface, temelinde bir tip tanımından başka birşey değildir. class ve function‘lar nesnelerin davranışlarını tanımlarken, interface‘ler nesnelerin tiplerini tanımlar şeklinde düşünebiliriz. Javascript’de interface kavramı olmadığı için TypeScript’de bir interface tanımladığınız ve compile ettiğiniz zaman, onun bir Javascript kodu üretmediğini görürsünüz. Bu noktada interface’lerin compile zamanında tipleri tanımladığını ve geliştirme aşamasında da kolaylık sağladığını belirtmek isterim.

Aşağıda TypeScript’de nasıl bir interface tanımlarız bunu basitçe görebilirsiniz. IShape diye adlandırdığımız interface’imizin getPerimeter() diye,-daha sonra içeriğini tanımlayacağımız, bir fonksiyonu var.

interface IShape {
getPerimeter(): number;
}

Şimdi bu interface’den yaratacağımız Square sınıfımıza bir bakalım. “implements” anahtar kelimesi ile sınıfımızın IShape interface’inden oluşacağını belirtiyoruz. Aslında burada Square sınıfımızın tipi IShape arayüzü ile tanımlı olacaktır da demiş oluyoruz.

class Square implements IShape {

}

Bu noktada Visual Studio’nun verdiği bir uyarının altını çizmek isterim. Yukarıdaki gibi bir ifadede, Visual Studio, Square sınıfının getPerimeter() fonkisyonunun implement edilmediğini söyleyerek hata verecektir. TypeScript’deki interface kavramının en güzel yanı aslında bu. Javascript’de tiplerin genişletilebilirliğini yönetmek zor olduğundan, çok fazla hata yapmak mümkün olabiliyordu. Ancak TypeScript’in bu özelliği ile genişletilebilirlik özelliği tamamen bizim kontrolümüze geçmiş oluyor.

TypeScript

Yavaştan Square sınıfımızı biraz daha anlamlı hale getirmeye başlıyalım ve interface’mizin getPerimeter() fonkisyonunu kare için tanımlayalım.

class Square implements IShape {
    private length: number;
    constructor(l: number)
    {
        length = l;
    }
    getPerimeter(): number {
        return length * 4;
    }
   
}

Compile ettiğimiz zaman, aşağıdaki gibi bir javascript kodunu elde edeceğiz. Dikkat ederseniz, IShape’e dair herhangi bir tanım, herhangi bir ifade yok.

var Square = (function () {
    function Square(l) {
        length = l;
    }
    Square.prototype.getPerimeter = function () {
        return length * 4;
    };
    return Square;
})();

window.onload = function () {
    var s = new Square(4);
    console.log(s.getPerimeter());
};

Yukarıda interface’ler TypeScript’de genişletilebilirliği sağlayan en önemli kavram demiştim. Peki nasıl yapıyoruz bunu?

Javascript, type-safe bir dil olmadığı için, execution anında TypeScript sayesinde tip ekleyip, tipleri genişletebiliriz. Mesela var olan Date tipini genişletip yeni bir metod ekleyelim. Bu metod, bulunduğumuz günün adını versin bize. Bunun için mevcut Date tipini, aynı isimle bir interface yaratıp getTodayName() metodu ile genişletiyoruz.

interface Date {
    getTodayName(): string;
}

Bu metodun içeriğini daha sonra, Date tipinin prototpye’ları arasında implement ediyoruz. Javascript ile haşır neşir olanların oldukça tanıdık olduğu bir ifade olacaktır.

Date.prototype.getTodayName = function () {

    var d = new Date();
    var weekday = new Array(7);
    weekday[0] = "Pazar";
    weekday[1] = "Pazartesi";
    weekday[2] = "Salı";
    weekday[3] = "Çarşamba";
    weekday[4] = "Perşembe";
    weekday[5] = "Cuma";
    weekday[6] = "Cumartesi";

    var name = weekday[d.getDay()];
    return name;
}

Daha sonra Date tipinde bir değişken tanımladığımız zaman onun getTodayName() diye bizim yeni eklediğimiz fonksiyona da sahip olduğunu göreceğiz.


window.onload = () => {

    var d: Date = new Date();
    console.log(d.getTodayName());

};

TypeScript’de interface kavramı basitçe böyle. OOP yaklaşımlarını Javascript tarafında uygulayabilmek için güzel bir yapı. Artık yapabilecekleriniz sizin elinizde…

  • Nov
  • 13
  • 2013

“Kodcu” vs. “Yazılımcı”

Tags: , | View: 841 | Comments:

Kodcu ya da yazılımcı…Fark eder mi? Pek farkında olunmadan, yapılan farklı işlerden ve projelerden dolayı, yazılım geliştirenlere söylenen bir tanım ikiside aslında…Yapılan işi, -yazılım geliştirme, hangisi daha iyi anlatıyor tartışılır. Tartışmak çok da anlamlı mı onu da bilemiyorum. Ama çevremdeki yazılım geliştiren kişileri ve yapılan işleri düşündüğümde kendimce bir şey saçmaladım. Paylaşmazsam olmaz dedim. :D

Kodcu da yazılımcı da, ikiside yazılım geliştiren kişilerdir, bir kere bunda bir anlaşalım. Ama yazılım geliştirme yöntemleri ve tercihleri farklı kişilerdir. Ve ikisi de bir yazılım geliştirme evresinde gerekli ve önemli rol oynayan kişilerdir. Kodcu, yazılımcıya göre daha çözüm odaklı olabilir. Problemin biran önce çözülmesi kodcu, problemin kaliteli bir şekilde çözülmesi de yazılımcı için önceliklidir. Kodcu, yazılım geliştirirken, hedefinde neyin olduğuna daha iyi bir şekilde odaklanır. Yazılımcı, hedefe giderken, yolda tökezlememek için tedbirli olur. Yazılımcı, başından itibaren geliştirilen yazılımın yaşam döngüsünün bilincinde olur, ona göre geliştirir. Kodcu, yazılımın doğmasına odaklanır. Yazılımcı, yazılım mühendisliğinin ya da literatürün söylediği şeyleri dikkate alır, kodcu bu konulara çok bulaşmadan daha özgür olabilir. Yazılımcı, güvenlik,erişebilirlik,modülerlik gibi çeşitli kalite özelliklerine kafa yorarken, kodcu çözüm sağlayan daha kolay evet diyebilir.

Kodcu vs. yazılımcıKodcu biraz daha özgür düşünebildiği için, aklındaki fikirleri daha çabuk gerçekleştirebilir. Çözüm odaklı düşündüğünden, kullanacağı teknoloji üzerinde fazla komplike arayışlara girmez, çözümüne uygun, hızlı geliştirme yapabileceği teknolojiyi seçer. Startup’lar bu açıdan kodcular için uygun olabilir. Kodcular teknolojiyi daha hızlı tüketirler. Çözümü hızlı gerçekleştirebilmek için bu hafta Ruby ile geliştirme yaparken, haftaya PHP’ye geçebilirler. Yazılımcılar, bu geçişleri çok hızlı yapamazlar. Daha fazla parametreyi değerlendirme aşamasında ele alırlar. Kodcular, yazılımın kullanım anına göre yaklaşımlarda bulunurken, yazılımcılar, yazılımın uzun yaşaması için geliştirme yaparlar.

Kodcu, anlık çözüm geliştirirken, yazılımcılar büyük çerceve içindeki resimi görüp uzun soluklu yazılımları hedefler. Kodcu, yazılımcıya göre, herşeyin yapılabileceğine daha çok inanır. Yazılımcı tecrübeleri doğrultusunda, problemlere daha şüpheyle yaklaşır.

Kodcu, her sektörde rahatken, yazılımcı kurumsal ölçekli orta ve büyük sektörlerde rahattır. Kodcu, problemlere geliştirdiği yazılım penceresinden bakarken, yazılımcı bütün sistem için bakar. Kodcunun geliştirdiği yazılımlar, oluşturduğu çözümler yazılımcının yaklaşımları ile olgunlaşır.

Başta söylediğim gibi yazılımcı da kodcu da, yazılım geliştirme evresinde beraber olması gereken ve önemli rol oynayan kişiler. Yukarıda bahsettiğim farklılıklara çok katılmıyor olabilirsiniz, gerçekten böyle olduğu için yazdığım şeyler de değil aslında. Ama farklı iş ihtiyaçları ve sektörlerde, yazılım geliştirirken, geliştirdiğimiz çözümleri, neden geliştirdiğimizi, geliştirirken nelere dikkat etmemiz gerektiğini sorgulamamızı sağlayan iki kavram olarak düşünüyorum. Kısacası her yazılım geliştiren kişi bazen kodcu, bazen de yazılımcı olmak durumundadır diyerekten bitiriyorum…Kalın sağlıcakla…

  • Nov
  • 01
  • 2013

TypeScript’de fonksiyonları nasıl “overload” ederiz?

Tags: , , | View: 419 | Comments:

TypeScript’de yazdığımız metodları, alışmış olduğumuz şekilde ne yazık ki overload edemiyoruz. Ama tabi ki bu, TypeScript, “overloading”‘i desteklemiyor demek değil. Hatta TypeScript’in spesifikasyonunda overload desteğinin olduğunu görebilirsiniz.

Aşağıdaki gibi, C#’dan benzer bir yaklaşım ile yapabileceğimizi düşünsekte, aşağıdaki kodu derlemeye çalıştığımızda hata alıyor olacağız.

class MainClass {
    MethodA(): void {
       
    }
    MethodA(s: string): void {
        
    }

    MethodA(s: number, p: string) {

    }
}

window.onload = () => {

    var s: MainClass = new MainClass();
    s.MethodA('TEST');


};

Alacağımız hata “Duplicate identifier ‘MethodA’” şeklinde bir şey olacaktır. Bunun sebebi Javascript tarafında, fonkisyonların tek bir tanımının olması gerekliliği. Peki nasıl yapacağız?

Overload yapacağımız metodların, deklarasyonlarını ayrıca belirtmemiz gerekiyor. Daha sonra bu deklerasyonlara uyumlu, tek bir metod ile metoda gelen parametrelerin tiplerini kontrol ederek overload özelliklerini tanımlayabiliriz.

class MainClass {
    MethodA(): void; //1.MethodA
    MethodA(s: string): void;//2.MethodA
    MethodA(s: number, p: string): void;//3.MethodA

    MethodA(s?:any,p2?:string): void {

        if (s && typeof s == "string")
        {
            alert('2.MethodA');
        }
        else if ((s && typeof s == "number") && (p2 && typeof p2 == "string"))
        {
            alert('3.MethodA');
        }
        else if(s===undefined && p2 ===undefined)
        {
            alert('1.MethodA');
        }

    }
   
}

window.onload = () => {

    var s: MainClass = new MainClass();
    s.MethodA();
    s.MethodA('Hello');
    s.MethodA(1,'Hello');

};

Burada önemli olan methodların içini tanımladığımız en son MethodA()’nın parametreleri ve içeriği. Dikkat ederseniz parametrelerin yanında “?” var. Bu o parametrenin olmayabileceğini de söylüyor. 2 parametre için de “?”ni koyuyor olmamız, boş parametre ile çağırabileceğimiz ilk MethodA deklarasyonunu sağlıyor. İlk parametrenin “any” keyword’ü ile olması da, o parametrenin herhangi bir tipde olabileceğini belirtiyor.

Bu sayede TypeScript’de metodlarımızı overload edebiliyor. Çok alışa gelmiş bir yöntem değil ama mevcut Javascript alt yapısından dolayı bu şekilde yapabiliyoruz ne yazık ki.

Kodumuzun derlendiğinde ortaya çıkan Javascript’de aşağıdaki gibi olacaktır.

  • Oct
  • 31
  • 2013

TypeScript ve Inheritance…

Tags: , , | View: 393 | Comments:

Son zamanlarda TypeScript ile ilgili bir şeyler paylaşmaya çalışıyorum. Yine TypeScript’den bahsediyor olacağım. Bu sefer TypeScript’de OOP’den aşina olduğumuz “Inheritance” kavramını TypeScript’de nasıl oluşturuyoruz bunu anlatmaya çalışacağım. Önceki yazılarda örneklendirdiğim, kod parçalarından devam edeceğim için, önceki yazılara bir göz atmanızı tavsiye ederim. Zaten karmaşık bir dilim var ve bazen çok saçmalıyorum farkındayım.(Buna da bir ara ayrıca değiniyor olacağım). Neyse…Siz yine de mutlaka bir okuyun.

 

Javascript’in genişletilebilir özelliğini, TypeScript’de de, sınıfları “extend“(keyword) ederek kullanabiliyoruz. Ama tabiki bazı şeyleri yapamıyoruz. Bunlardan en önemlisi C#’da ana sınıfta, protected keyword’ü ile koruma altına aldığımız değişkenlerimize türettiğimiz sınıfta ulaşabiliyor olmamız. Ne yazık ki TypeScript’de bu mevcut değil. Şu an ki versiyonunda yok, v1.0′da da olacakmış gibi gözükmüyor. TypeScript’de türettiğimiz sınıfta, ana sınıftaki bir değişkene ulaşmak istiyorsak eğer, ana sınıfta o değişkeni public olarak tanımlamamız gerekmekte. Bunun dışında abstract kavramını da ne yazık ki TypeScript’de kullanamıyoruz.

Önceki yazılarda, Note diye bir sınıf yapmıştım hatırlarsanız. Bu sefer o sınıftan türeyen yeni bir sınıf yaratalım. Bu sınıfta ek olarak, saati gösterebileceğimiz bir ekleme yapalım. Alışveriş listemize bir şey eklediğimiz zaman artık onun saatini de göstermiş olalım bu sayede.


class ExtendedNote extends Note {
    private _date: HTMLElement;

    //Eğer sınıfımızın constructor'ını yazacaksak
    //burada önemli bir nokta var.
    //Basesınıfın da constructor'ını çağırabilmemiz
    //için super() metodunu kullanmamız gerekmekte.
    constructor(text: string) {

        super(text);
        this._date = document.createElement("div");
        this._date.innerText = "Added @ "+ new Date().toTimeString();
        this._date.innerText += this.GetText();
        this._container.appendChild(this._date);

    }

    public ToString(): string
    {
        return this._date.innerText;
    }

    //Note sınıfında olan GetText'i bu şekilde override edebiliriz.
    //Burada dikkat ederseniz super keyword'ü ile Note
    //sınıfındaki GetText metodunu da kullanabiliyoruz.
    public GetText():string
    {
        //super.GetText(),Note sınıfındaki GetText'i çağıracaktır.
        return super.GetText()+' ExtendedNote';
    }

}

Burada “extends” keyword’ü ile ExtendedNote sınıfımız Note sınıfından türemiş oluyor. ExtendedNote sınıfından, Note sınıfında public olarak belirtilmiş tüm değişkenlere ve metodlara ulaşabiliriz.

TypeScript’de base class’da ki bir metodu ezebiliyoruz. Yani türettiğimiz yeni sınıfta, önceki metodun işleyişini değiştirebiliyoruz. Bunun için super keyword’ünü kullanıyoruz. Burada özellikle belirtmek isterim ki super keyword’ü ile base class’daki sadece public fonksiyonlara ulaşabilirsiniz.

Önceki örneklerde yaratmış olduğum CustomHTMLControl’de küçük bir değişiklik ile artık bu ExtendedNote’umuzu kullanabiliriz.

    public onClick(ev: MouseEvent) {
        //Listemizdeki eleman sayısını artırıyoruz.
        //Belki bu sayıyı göstermek isteriz.
        this.noteCount += 1;

        //Array'e ekliyoruz.
        this._notes.push(new ExtendedNote(this.inputField.value));
        this.inputField.value = '';
        this.Render();

    }

Böylece TypeScript’de, OOP’den aşina olduğumuz kavramlar ile çok fazla bir değişiklik yapmadan, sadece yeni bir sınıf yazarak aslında belki de, uygulamamızı genişletebiliyoruz.

TypeScript

Yazının devamında komple güncellenmiş örneğin kodlarına ulaşabilirsiniz. Umarım yavaş yavaş bazı şeyler daha da anlaşılıyor oluyordur.

  • Oct
  • 28
  • 2013

Basit bir TypeScript örneği ile başlıyoruz…

Tags: , , | View: 549 | Comments:

Önceki yazılarımdan bir tanesinde TypeScript’den bahsetmeye çalışmıştım. Sonunda da oldukça basit bir kod örneği ile biraz dikkatleri çekmek istemiştim. Javascript oldukça esnek bir dil olduğundan, öğrenmesi daha doğrusu düşündüğünüz şeylerin implementation’ı biraz zor. TypeScript, OOP notasyonlarına daha uygun bir dil olduğu için, OOP ile uğraşanlara bu açıdan bazı şeyler daha kolay gelecektir. Ama bu noktada da Javascript’in ve TypeScript’in iyi anlaşılıyor olması gerekmekte. Bundan dolayı önceki örnek üzerinden giderek, çok basit bir şekilde bir örnek daha paylaşmak istiyorum. Bunun üstüne birşeyler koyarak TypeScript tarafında bazı şeyleri beraberce zamanla görmüş olabiliriz. İlerleyen günlerde OOP yaklaşımlarına ve C#’daki benzer şeylere göre örnekleri geliştiriyor olacağım. Sizinde sorularınız olursa, sormaktan çekinmeyin. Bu arada çok basit diyorum ama tabi ki temel Javascript bilgisi şart…

TypescriptCapture1

Bu örneğimizde daha önceki yazıdaki kod parçasını biraz dana anlamlı hale getiriyoruz. Basit bir alışveriş listesi yapıyor olacağız. Bir tane text alanından girdiğimiz şeyleri, listemize atıyor olacağız. Daha sonra listemizdeki bir elemana tıkladığımızda, onu listeden üstünü çizerek kaldırmış olacağız.

 

 

 

Bunun için önce alışveriş listemizdeki elemanları temsil edecek Note diye bir sınıf yapıyoruz.

//Alışveriş listemizdeki elemanları temsil edecek
//Note diye bir sınıfımız olsun.
class Note {

    //DOM'daki HTMLElement tipinde karşılığı
    private _container: HTMLElement;
    //Listedeki elemanımız içeriği
    private _text: string;

    constructor(t: string) {
        //Constructor'da text'imizi set ediyoruz.
        this._text = t;

        //DOM'da ki elemanı bir DIV olarak tanımlayıp
        //text'i bu div'in innertext değişkenine atıyoruz.
        this._container = document.createElement("div");
        this._container.innerText = this._text;

        //DIV'imize tıklandığı zaman listemizdeki elemanın
        //üstünü çizip,italik yapıyoruz
        this._container.onclick = () =>
        {
            this._container.style.textDecoration = 'line-through';
            this._container.style.fontStyle = 'italic';
        }
    }

    public GetText(): string {
        return this._text;
    }

    //Listemizdeki item'ı verilen HTML parent elemanına
    //ekleyip, render yapıyoruz diyebiliriz.
    public Render(parent:HTMLElement) {
        parent.appendChild(this._container);
    }

}

Alışveriş listemizi yaratacak olan sıfımızıda aşağıdaki gibi tanımlıyoruz.


class CustomHTMLControl {

    container: HTMLElement;
    header: HTMLElement;
    content: HTMLElement;
    footer: HTMLElement;
    inputField: HTMLInputElement;
    private button: HTMLInputElement;

    //Listemizde ki elemanları Note tipinde bir array'de tutuyoruz.
    private _notes: Note[] = [];
    private noteCount: number = 0;

    constructor(element: HTMLElement) {

        //DOM içerisindeki gerekli elemanları yaratıyoruz
        //Burada içeriği almak için bir tane input alanımız
        //bir tane button yeterli olacaktır.
        //Button'a tıkladığımızda, Note tipinde bir elemanı
        //listemize ekliyoruz.
        this.container = element;
        this.header = document.createElement('div');
        this.header.innerText = 'This is a Shopping List';
        this.container.appendChild(this.header);

        this.inputField = document.createElement("input");
        this.inputField.type = "text";

        this.container.appendChild(this.inputField);

        this.content = document.createElement("div");
        this.button = document.createElement("input");
        this.button.type = "button";
        this.button.value = "Add";

        //Burada bind(this) ifadesini kullanmazsak
        //onClick metodunda bu sınıf içerisinde ki local
        //değişkenlere ulaşamıyor oluruz. Bunun yerine
        //Fat Arrow fonksiyon deklarasyonunu da yapabiliriz.
        //TypeScript Fat Arrow deklarasyonunu da destekliyor.
        this.button.onclick = this.onClick.bind(this);

        this.content.appendChild(this.button);
        this.container.appendChild(this.content);

        this.footer = document.createElement("div");

        this.container.appendChild(this.footer);
    }

    public onClick(ev: MouseEvent) {
        //Listemizdeki eleman sayısını artırıyoruz.
        //Belki bu sayıyı göstermek isteriz.
        this.noteCount += 1;

        //Array'e ekliyoruz.
        this._notes.push(new Note(this.inputField.value));
        this.inputField.value = '';
        this.Render();

    }

    public Render(): void {
        //Array'mizden alıp; -ki burada aldığımız eleman Note tipinde olacaktır.
        var note = this._notes.pop();
        note.Render(this.content);
    }

}

window.onload = () => {
    //HTML sayfamızdaki herhangi bir div içeriğine ekliyoruz
    //oluşturduğumuz kontrolü
    var parent = document.getElementById('content');
    var customControl = new CustomHTMLControl(parent);
};

  • Oct
  • 24
  • 2013

Scrum’ın yaratıcılarından Jeff Sutherland, Ocak 2014′de İstanbul’da…

Tags: , , | View: 496 | Comments:

Agile yazılım geliştirme metodolijilerinden Scrum‘ın yaratıcılarından biri olan Jeff Sutherland 16-17 Ocak 2014 tarihinde Scrum Turkey’in düzenlediği bir etkinlikle İstanbul’da. 2 günlük bir eğitim için ülkemizde bulunacak Jeff Sutherland, bu etkinlik kapsamında Certified Scrum Master eğitimini veriyor olacak. Özellikle Jeff Sutherland’dan bu eğitimi almak, böyle bir fırsata sahip olmak kaçırılmayacak bir fırsat. İlgilenenlere ve imkanı olanlara şiddetle tavsiye ederim. İmkanı olanlara diyorum çünkü ücretli bir eğitim. Daha fazla ayrıntıyı ve katılım ile ilgili bilgileri http://www.creatorofscruminturkey.com/ adresinden takip edebilirsiniz.

Eğitime katılma imkanı ya da fırsatı bulumayacaklar için 16 Ocak 2014 akşamı 19:00-21:00 arası Jeff Sutherland’in konuşmacı olarak katılacağı ücretsiz bir etkinlik olacak. Bunu da hatırlatmak isterim… Bu etkinlik ile ilgili ayrıntılar zaman yaklaştıkca Scrum Turkey‘in web sitesinde olacaktır. Tarihi not alıp, siteyi takip edin derim.

Jeff Sutherland İstanbul'da...

Aşağıda Jeff Sutherland’in 5-6 yıl önce Google TechTalks’da “The Secret Sauce of Improving Your Scrum Team” konulu konuşmasını da izlemenizi tavsiye ederim.

  • Oct
  • 23
  • 2013

TypeScript nedir ki acaba?

Tags: , , , , , | View: 1,007 | Comments:

TypeScript, geçen sene Microsoft’un çıkardığı yeni bir dil. Aslında tam olarak sadece yeni bir dil demek çok doğru olmaz. Javascript’in bir üst kümesi olarak ortaya çıkan, syntax olarak Javascript’e benzeyen, farklı bir grammer’i olan bir dil diye biraz daha anlamlı hale getirebiliriz.

TypeScriptJavascript, bildiğiniz üzere strongly-typed bir değil. Dolayısıyla oldukça esnek ve genişletilebilir. Oldukça güzel bir özellik belki ama geliştirmeyi zorlaştıran da bir özellik diyebilirim. C#, Java gibi strongly-typed diller ile geliştirme yapan kişiler özellikle oldukça zorlanır. TypeScript’in en büyük özelliği ve artısı belki bu noktada ortaya çıkıyor. TypeScript dilinin compile zamanında strong-type özelliği olması ama runtime’da klasik bir Javascript gibi çalışıyor olması, javascript geliştirenler için oldukça büyük bir kolaylık sağlıyor.

Bu son cümlede aslında yanlış bir ifade kullandım. Dikkat çekmek adına bile bile yaptığımı belirtmek isterim. “Javascript gibi çalışıyor” ifadesinde ki “gibi” aslında fazla oldu. TypeScript ile yapmış olduğunuz geliştirme derlendikten sonra Javascript’e dönüşüyor. Yani aslında çalışan şey direk Javascript. Javascript ile oldukça karmaşık ve zor bir şekilde yapabileceğin şeyleri, TypeScript kolayca yapmanızı sağlıyor diyebilirim.

Peki neden TypeScript? Neden şimdi?

TypeScript diline benzer, aynı yaklaşımla ortaya çıkmış CoffeeScript,Dart gibi başka diller de var aslında. Hatta bunlar TypeScript’den de önce var olan diller. Typescript’in bu açıdan farkı, .NET Framework’ündeki yaklaşım ve temel OOP prensiplerine dayalı geliştiriliyor olması. Bu açıdan server üzerinde uygulama geliştiren kişilerin, benzer yaklaşımla Javascript yazabiliyor olması TypeScript ile oldukça kolay. Özellikle Visual Studio gibi bir IDE’de yazabiliyor olmak oldukça kolaylık sağlıyor.

Neden şimdi sorusuna da; gelişen web teknolojilerinin ortaya çıkardığı ihtiyaçları, daha kaliteli ve hızlı bir şekilde karşılayabilmek adına, geliştirmenin kolay olması gerektiğinden diyerek kendi adıma cevap verebilirim.

TypesSript, inheritance, interfaces,encapsulation gibi OOP prensiplerine de destek vermekte. Dolayısıyla Javascript tarafında sadece fonksiyon olan kavramları biraz daha somut hale getirmek, hali hazırda OOP prensiplerine aşina olan kişilere oldukça kolay gelecektir.

TypeScript’e başlamak için http://www.typescriptlang.org/ adresine gitmeniz yeterli olacaktır. Visual Studio için ilgili eklentiyi yükledikten sonra, Visual Studio üzerinden, yeni gelen proje şablonları ile hemen geliştirmeye başlayabilirsiniz. Yok ben Visual Studio kullanmak istemiyorum derseniz de, Node.js üzerinden de TypeScript’i compile edebileceğiniz modül mevcut.

Daha v1.0 versiyonu ne yazık ki yayınlanmadı. 0.9.1.1 versiyonu ile ama sona çok yaklaşıldığını söyleyebilirim. Kendi projelerimde yavaştan hatta kullanmaya başladım. İlerleyen günlerde biraz daha ayrıntılı olarak TypeScript’e değiniyor olacağım. Şu an böyle giriş niteliğinde bir yazı olsun istedim. O yüzden fazla uzatmıyorum. Daha uzun ve ayrıntılı olarak aşağıda Anders Hejlsberg’ın Channel 9′da ki TypeScript videosu ve altında kendi yazdığım basit bir örnek ile bitiriyorum.

TypeScript ile yazmış olduğumuz kod örneği;


class CustomHTMLControl
{
    //sınıfımdaki değişkenler
    //3 tane HTMLElement tipinde
    //1 tane private HTMLInputElement tipinde
    //1 tane private number tipinde
    container: HTMLElement;
    header: HTMLElement;
    content: HTMLElement;
    private button: HTMLInputElement;
    private  dummy: number=0;

    //sınıfımın constructor'ı
    //bunun içinde OOP yaklaşımı doğrultusunda
    //nesnemi oluşturmak için gerekli tanımlamaları yapıyoruz
    constructor(element: HTMLElement)
    {
        this.container = element;
        this.header = document.createElement('div');
        this.header.innerText = 'This is CustomHTMLControl';
        this.container.appendChild(this.header);

        //Bir tane de metodumuz olsun
        this.initContent();
    }

    //private olan bu metodu sadece bu sınıf içerisinde
    //kullanabiliyoruz.
    private initContent()
    {
        this.content = document.createElement("div");
        this.button = document.createElement("input");
        this.button.type = "button";
        this.button.value = "Hello World";

        this.button.onclick = this.onClick;

        this.content.appendChild(this.button);
        this.container.appendChild(this.content);
    }
    //Button'a tıklandığında ki metodumuz
    public onClick() {

        alert('You just clicked the button');
    }

    //public bir metodumuz olsun.
    //Nesnemiz üzerinden bu metoda ulaşabiliyor olacağız.
    GetClickCount()
    {
        return this.dummy;
    }

}

window.onload = () => {
    var parent = document.getElementById('content');
    var customControl = new CustomHTMLControl(parent);

};

Derlendiği zaman ortaya çıkan Javascript kodu

var CustomHTMLControl = (function () {
    //sınıfımın constructor'ı
    //bunun içinde OOP yaklaşımı doğrultusunda
    //nesnemi oluşturmak için gerekli tanımlamaları yapıyoruz
    function CustomHTMLControl(element) {
        this.dummy = 0;
        this.container = element;
        this.header = document.createElement('div');
        this.header.innerText = 'This is CustomHTMLControl';
        this.container.appendChild(this.header);

        //Bir tane de metodumuz olsun
        this.initContent();
    }
    //private olan bu metodu sadece bu sınıf içerisinde
    //kullanabiliyoruz.
    CustomHTMLControl.prototype.initContent = function () {
        this.content = document.createElement("div");
        this.button = document.createElement("input");
        this.button.type = "button";
        this.button.value = "Hello World";

        this.button.onclick = this.onClick;

        this.content.appendChild(this.button);
        this.container.appendChild(this.content);
    };

    //Button'a tıklandığında ki metodumuz
    CustomHTMLControl.prototype.onClick = function () {
        alert('You just clicked the button');
    };

    //public bir metodumuz olsun.
    //Nesnemiz üzerinden bu metoda ulaşabiliyor olacağız.
    CustomHTMLControl.prototype.GetClickCount = function () {
        return this.dummy;
    };
    return CustomHTMLControl;
})();

window.onload = function () {
    var parent = document.getElementById('content');
    var customControl = new CustomHTMLControl(parent);
};
//# sourceMappingURL=app.js.map
  • Oct
  • 01
  • 2013

Ümit Sunar’la Windows Azure öğreniyoruz…

Tags: , , , | View: 482 | Comments:

Microsoft’tan Ümit Sunar, Windows Azure ile ilgili, baştan sona güzel bir giriş webiner serisi hazırlamış. Biraz geç paylaşıyorum ama seri daha başında ve devam ediyor. Windows Azure hakkında biraz olsun bilgi sahibi olup ama nereden başlayıp nereye gitmek konusunda soru işaretleri olanlara şiddetle tavsiye ederim…Kaçırmayın…

#1 – Windows Azure Overview: Cloud?

Title: Windows Azure Overview: Cloud?
Description: “Starting is Half the Task” and this session targets to give an overview of Cloud Computing and Windows Azure in your journey.
We’ll answer frequently asked questions such as “What is Windows Azure?”, “How Cloud Computing may help you?” and share Windows Azure resources that’ll help you to accelerate your adoption to Windows Azure
- Windows Azure InfoKit (http://aka.ms/WAInfoKit )
- Windows Azure Learning Poster (http://aka.ms/LearningPoster )
- Windows Azure Training Kit (http://aka.ms/g2jucu )
LiveMeeting URL: https://msevents.microsoft.com/CUI/EventDetail.aspx?EventID=1032565435&Culture=en-TR&community=0
Date/Time: 9/24/2013 – 3:00pm – 4:30pm
Click here to see in your local time: http://bit.ly/18RmDHF


#2 – Windows Azure Web Sites: Create your Web Site in the Cloud in 5 min

Title: Windows Azure Web Sites: Create your Web Site in the Cloud in 5 min
Description: Windows Azure Web Sites is a simple and powerful hosting platform that helps you to easily build and deploy your web applications. You can develop using ASP.NET, PHP, Node.js and Python with your favorite frameworks (MVC 4, Django, Express), integrate with source control systems and manage with PowerShell, REST API or CLI Tools.
LiveMeeting URL: https://msevents.microsoft.com/CUI/EventDetail.aspx?EventID=1032565443&Culture=en-TR&community=0
Date/Time: 10/01/2013 – 3:00pm – 4:30pm
Click here to see in your local time: http://bit.ly/19wUM0o


#3 – WAMSA #1: Windows Azure Mobile Services Academy

Title: WAMSA #1: Windows Azure Mobile Services Academy
Description: Mobile Services is state of the art cloud backend for all kind of applications and you can integrate it with almost all kind of applications. This session covers the basics of Windows Azure Mobile Services, integration with Windows Store, Windows Phone 8, iOS (iPhone, iPad), Android and HTML applications, authentication and authorization with Microsoft Account, Facebook, Twitter, Google, push notifications, source control and custom API.
Extending your applications is really simple and beneficial with Windows Azure Mobile Services.
LiveMeeting URL: https://msevents.microsoft.com/CUI/EventDetail.aspx?EventID=1032565445&Culture=en-TR&community=0
Date/Time: 10/10/2013 – 3:00pm – 4:30pm
Click here to see in your local time: http://bit.ly/15lH5FJ