JSF Dersleri – JSF Nedir? Giriş,IDE Kurulumu Ve İlk Uygulama

JSF NEDİR?

JSF (Java Server Faces) Java programlama dilinin standart web çatısıdır. JSF çatısı 2.0 versiyonundan önce JSP sayfaları içinde yazılabilirken 2.0 sürümü ile birlikte Facelet mimarisine geçmiştir ve .xhtml uzantılı sayfalar üzerinde yazılmaya başlanmıştır. JSF MVC (Model – View – Controller) mimarisine yapısına dayanan bir frameworktür. Ayrıca JSF Component Based yani bileşen tabanlı bir frameworktür. Bu da şu demektir ki JSF’de kullanıma hazır bileşenler yer almaktadır. Örneğin HTML’deki table etiketine karşılık çok daha hızlı ve pratik bir şekilde PanelGrid ya da DataTable bileşenleri ile işinizi halledebilirsiniz.

JSF GELİŞTİRMEK İÇİN NELERE İHTİYAÇ VAR?

Hepsinden önce JSF geliştirebilmek için Java SE programlama dilini bilmeniz gerekmektedir. Bu dili biliyorsanız bir IDE (Integrated Development Environmet – Tümleşik Geliştirme Ortamı) ile JSF’yi kolayca geliştirebilirsiniz. JSF geliştirmek için şu anda çok popüler 3 IDE var. Bunlar: Eclipse, Netbeans ve IntelliJ Idea’dır. Ben bunlardan Eclipse ve Netbeans kullanıyorum. Yazılarımı yazarken de Netbeans kullanacağım.

JDK KURULUMU

Öncelikle eğer bilgisayarımızda JDK kurulu değilse onu kuruyoruz. Bunun için Oracle’ın web sitesindeki JDK indirme adresine gidiyoruz. JDK için buraya tıklayarak, indirme sayfasına ulaşabilirsiniz.

Windows kullandığınızı düşünerek, uygun olan 32bitlik veya 64bitlik kurulum dosyasını bilgisayarımıza indiriyoruz ve çalıştırıp kuruyoruz.

Eğer Debian tabanlı bir GNU/Linux dağıtımı kullanıyorsanız terminalden / konsol ekranından şu komutları vererek JDK’yı kurabilirsiniz:

sudo add-apt-repository ppa:webupd8team/java

sudo apt-get update

sudo apt-get install oracle-java8-installer

MAC OS X ortamı için de kurulum Windows ile aynıdır. Bilgisayarınıza uygun JDK’yı indirip çift tıklayarak kurabilirsiniz.

NETBEANS KURULUMU

JSF geliştirmek için birde geliştirme ortamına ihtiyacımız var. Geliştirme ortamlarından biri olan Netbeans’ın kurulumuna bakalım. Kurulumu Windows için oldukça basit.

Bu adresten Netbeans’ın indirme sayfasına gidiyoruz:

Şu an güncel olarak Netbeans 8.0.2 sürümü kullanılıyor. Bizim derslerimiz için yukarıdaki 5 farklı sürümden Java EE ve All sürümleri işimize yarayanlardır. Eğer C/C++/PHP vs. de geliştirmek isterseniz All sürümünü indirebilirsiniz. Ama sadece Java EE çalışacaksanız Java EE sürümü yeterlidir. İndirdikten sonra Windows ve Mac OS ortamlarında kurulum dosyasına çift tıklayıp kurulumu gerçekleştirebilirsiniz. Kurulum ekranı karşınıza geldiğinde Apache Tomcat de kurmak isterseniz “Customize” butonuna tıklıyor, Apache Tomcat seçeneğine de işaretliyoruz. Okey diyoruz ve programımızı kuruyoruz.

Linux ortamında indirilen .sh script dosyasını terminal aracılığı çalıştırıp Netbeans’i kurabilirsiniz. Bunun için yapmanız gereken şöyledir:

chmod +x indirilenDosyaninAdi.sh
sudo sh ./indirilenDosyaninAdi.sh

İLK PROJE: MERHABA DÜNYA

Gelenektir ilk örnek her zaman için “Hello World” yani “Merhaba Dünya” olur. Biz de bir “Hello World” örneği yaparak ilk yazımızı sonlandıralım.

NetBeans programını açıyor ve sol üstten turuncu renkteki New Project ikonuna tıklıyoruz ya da File -> New Project diyoruz. Karşımıza proje tipini soran ekran gelecek. Sol kısımdan Java Web, sağ kısımdan ise Web Application seçiyoruz ve Next butonuna tıklıyoruz.

Karşımıza projemizin adını soran bir ekran gelecek. Projenize istediğiniz herhangi bir ismi verin burada. Ben JSFDersleri1 adını veriyorum. Yine Next diyelim ve sonraki adıma geçelim;

Şimdi de karşımıza projemizi çalıştıracak olan sunucuyu seçeceğimiz ekran gelecek. Benim tavsiyem başlangıç’tan bir yere kadar Apache Tomcat ile gitmeniz şeklinde olacak. Listede bir de Glassfish Server bulunmakta. Glassfish Server bir uygulama sunucusu iken Tomcat bir uygulama katmanıdır. Bu nedenle Tomcat biraz daha hızlı çalışır ve hafiftir. İlerde JSF projeinize daha çok kurumsal yapılar koymak istediğinizde Tomcat zaten size yetersiz gelecek ve Glassfish ya da başka bir uygulama sınucusu kullanacaksınız. Şimdilik bir süre Tomcat kullanalım 🙂

Bu ekranda bize projemizde hangi framework üzerinde çalışmayı istediğimizi soruyor. Biz Java Server Faces seçeneğini işaretliyoruz ve Finish butonu ile işlemleri sonlandırıyoruz.

Ve işte, projemizin ana sayfası geldi. Birkaç kod yazarak ekranımızı renklendirelim. Açılan index.xhtml sayfası içerisindeki kodlara bakalım. Burada 1 ve 2. satırdaki kodlar Xml tanımlamaları ile alakalı. 3 ve 4. satırlar kullanılacak kütüphaneler ile akalı. Şimdilik orası ile işimiz yok.

ve arasında ise sayfamızın başlığını belirlediğimiz … etiketi bulunuyor. Bir sayfa başlığı yazıyoruz. Ayrıca head etiketleri arasına CSS kodlarımızı da yazabiliriz.

ve etiketleri arasına ise asıl işi yapacak kodlarımızı yazacağız. Aşağıdaki kod bir Merhaba Dünya örneğidir. JSF kodlarımızı bir h:form etiketinin arasına yazarız ve h:outputText ile de ekrana çıktı alırız. Bu kısımlara sonraki yazılarda yine değineceğimiz için bu kısım üzerinde şimdilik fazla durmaya gerek yok.

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html">
    <h:head>
        <title>JSF Hello World Örneği</title>
    </h:head>
    <h:body>
        <h:form>
            <h:outputText value="Merhaba Dünya :)"/>
        </h:form>
    </h:body>
</html>

F6 tuşuna basarak ya da üst menüden Run butonuna tıklayarak projemizi çalıştırıyoruz. Tarayıcımızda ilgili kodlar çalışacak ve ekranda yazımız görüntülenecek.

Sonuç

Sonuç olarak İlk makalemizde;

JSF’nin ne olduğunu öğrendik,
Geliştirme ortamımızı kurduk,
İlk uygulamamızı yazdık.

JSF için yazdığım tüm dersler aşağıda listelenmiştir. İlgili yazının üstüne tıklayarak yazıya ulaşabilirsiniz. Bir sonraki makalemizde JSF’de Form Bileşenleri konusunda görüşmek üzere.