Vaadin Introduction

Merhaba arkadaslar,

Çabalamak bizden, muvaffakiyet Allahtan.

Vaadin yazılarına giriş yazısıyla başlamış bulunmaktayız. Blogu az çok takip ediyorsanız giriş yazılarında genel olarak konu hakkında bilgiler verip neden/niçin/ne zaman kullanmalıyız gibi bilgiler yer alıyor. Vaadin giriş yazısında da buna benzer yapı olacaktır. İlk yazısını yazdık son yazısını da yazmak nasip olur insaAllah

Vaadin Java Web Framework

Kullanıcı dostu arayüzü, sürdürebilinir, yüksek kaliteli web applicationlar yazabilmeyi sağlayan bir Java Web Framework’udur. Vaadin’in temelinde iki türlü yaklaşım mevcutr. Bunlar server-side ve client-engine. Server side yaklaşımda basit-kullanışlı web applicationlar yazılır. Desktop app gibi görülebilir. AWT, Swing benzeri gibidir ancak daha basittir. Server side tarafı control logic ve busines logic kısımlarını içerir. Client engine tarafı ise ui rendering kısımlarını gerçekleştirir.

Vaadin konularını incelerken Java swing desktop yaklaşımının web’e taşındıgı izlemini kafamda canlandı. Ancak standalone desktop app’dan daha kolay. Vaadin yazarken diğer web teknolojilerini öğrenmek zorunda degilsiniz. Html, Css ve Javascript bilmeden/çok bulaşmadan gayet iyi web applicationlar yazmanızı sağlar. Ayrıca core Java kodu yazarak bildiğimiz sularda yüzmemizi sağlayacaktır.

Ne zaman? niçin kullanmalıyım? sorularına cevap olarak hızlıca yazmanınz gereken bir web application oldugunda, css/js/html bilmediginiz durumlarda hayat kurtarıcı olabilecektir.

Vaadin yazılarına başlamadan önce her zaman söylediğim gibi Servlet’lerin yapısını, temel HTTP bilgilerini ve kısmen Java web yapısını bilmeniz gerekiyor. Servlet’leri bilmiyorsanız Java EE olaylarına girmeyin arkadaslar, ilerde her yerde ister Jsf yazın ister Struts, Vaadin vs yazın ister başka şeyler yazın mutlaka Servlet^lere yolunuz düşecektir. Blogda Servlet yazılarına bakabilirsiniz.

 

Vaadin Architecture

Her zaman oldugu gibi öncelikle nasıl yazıldıgından çok niçin yazıldıgını ögrenmemiz gerekiyor.

architecture-vaadin7-hi

Yukarıdaki Vaadin mimarisine baktığımızda Server side ve Client side olarak ayrıldıgını görebiliriz. Client side tarafı browserda ui rendering gibi javascipt kodu çalışır ve ui aksiyonlarını içerir. Browserda çalışması için ek plugin vs’ye ihtiyaç duymaz. Vaadin arka planda java kodunun ui koduna çevrilmesi için GWT(Google Web Toolkit) kullanır. GWT kısaca java kodunu javascipt olarak compile eden bir yapı.  UI Logic ise Server side tarafında yer alır ve Servletlere benzer çalışır.  Dikkat ederseniz client side tarafında da server side tarafında da pure Java kodu yazıyoruz.

Vaadin 3rd pluginleri de desteklemekte, bircok faydalı plugin bulunmakta.

Vaadin UI

Server side tarafta isleri hallediyoruz, css/js/html’e bulasmıyoruz dedik. Peki nasıl olacak bu? com.vaadin.ui.UI sınıfını kullanarak. Vaadin application bir yada birden falza UI class’a sahip olabilir. Aynı zamanda bir page birden fazla UI içerebilir. UI classını inherit eden class’lar init methodunu yazmak zorundarır. User sayfaya erişmek istediginde init methodu çağrılacaktır.

UI mimarisine bakalım biraz;

application-architecture-hi

 

UI logic Server side tarafında demistik. Bir Vaadin uygulaması bir yada birden fazla UI’a sahip olabilir. Aynı safyada birden fazla ui olabilir. Abstract olan UI sınıfını kalıtıp init methodunu kullanarak bunu gerçekleştiriyoruz. Client side tarafında ajax kullanılarak client-server arasında iletişim gerçekleşiyor. Gelen istek Servlet yada Portlet(daha sonra deginecegim) tarafından karşılanır ve UI aksionu alınır. init() methodu ile sayfa çizilir, event’lar ayarlanır vs gibi işlemler yapılır. Giriş yazısı oldugu için çok fazla detaya girmeyeceğim.

Örnek bir Hello yazalım ve çıktıyı görelim;

Bir sonraki yazıda Vaadin projesi oluşturmayı gösterecegim. Bu yazıda sadece hello diyelim

Öncelikle UI oluşturacağız;

com.example.vaadinhelloword.VaadinHelloWordUI

Tomcatte çalıştırıp sayfaya gidelim;

Screenshot from 2016-02-04 22:34:37

 

Gördüğünüz gibi hiç bir html/css/js yazmadan core java yazarak bir web application yazdık. Çok basit de olsa yazdık

Örnek projeye linkten erişebilirsiniz : VaadinHelloWord

Github üzerinden de şuradan erişebilirsiniz : VaadinTutorials

Giriş yazısın sonuna geldik arkadaslar. İlerleyen yazılarda Vaadinin temellerine daha fazla iniyor olacağız.

~ A.Akkus

 

1383 Total Views 2 Views Today