Anasayfa » Genel, Java ve Java Teknolojileri

Eclipse Üzerinde Tomcat-JSF-Primefaces-JPA Hibernate Kullanarak Web Uygulaması Geliştirme

22 Aralık 2012 13.151 kez okundu 9 yorum
1 Star2 Stars3 Stars4 Stars5 Stars (2 oy,5 üzerinden : 5,00 )
Loading...

jsf_logo

Merhaba arkadaşlar, bugünkü yazımda eclipse üzerinde jsf, primefaces, hibernate ve tomcat kullanarak full web uygulaması geliştireceğim. Öncelikle kurulumlardan bahsedip, arkasından basit bir örnek yapacağım.

Kullanacağım teknolojiler şunlar;

  • Eclipse Juno
  • Jsf 2.0
  • Primefaces 3.3.1
  • Hibernate 3
  • Mysql Connector 5.0
  • Tomcat 7
  • Wampserver 2.2

Yazımızın sonunda hazırladığım tüm kodları ve kullandığım tüm kütüphaneleri paylaşacağım.

Uygulamamıza eclipse üzerinde proje başlatarak başlayalım.

New -> Dinamic Web Project
Project Name: FullWebKodMerkeziNet
Target runtime: Apache Tomcat v7.0 (Eğer 7 yok ise yanında bulunan new runtime ile indirebilirsiniz)
Dinamic web module version: 3.0
Finish.

FullWebKodMerkeziNet/WebContent/WEB-INF/lib altına ilgili kütüphaneler kopyalanır. (Kütüphaneleri yazı sonunda paylaştığım uygulamanın içerisinde bulabilirsiniz.) Kopyalanan bütün kütüphaneler eclipse üzerinde seçilir.

Sağ tık -> Build Path -> Add to Build Path diyerek uygulamaya dahil edilir.

/WebContent/ altına “pages” adında klasör açılır. /WebContent/pages/ altına index.xhtml adında dosya oluşturulur.

index.xhtml

?View Code XML
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">
<f:view contentType="text/html">
	<h:head>
		<f:facet name="first">
			<meta content='text/html; charset=UTF-8' http-equiv="Content-Type" />
			<title>FullWebKodMerkeziNet</title>
		</f:facet>
	</h:head>
 
	<h:body>
		<h:form>
			<p:panel id="panel" header="Yeni Makale" style="margin-bottom:10px;">
				<p:messages id="messages" />
				<h:panelGrid columns="2">
					<h:outputLabel for="baslik" value="Makale Başlığı" />
					<p:inputText id="baslik" required="true"
						value="#{makaleManaged.makale.baslik}" />
 
					<h:outputLabel for="icerik" value="Makale İçeriği" />
					<p:inputText id="icerik" value="#{makaleManaged.makale.icerik}"
						/>
 
					<h:outputLabel for="yazar" value="Yazar" />
					<p:inputText id="yazar" value="#{makaleManaged.makale.yazar}" />
				</h:panelGrid>
			</p:panel>
 
			<p:commandButton value="Kaydet" update="panel"
				style="margin-right:20px;" action="#{makaleManaged.makaleKaydet}" />
 
		</h:form>
 
 
	</h:body>
</f:view>
</html>

Java Resources/src altına net.kodmerkezi.managed paketi açılır. Java Resources/src/ net.kodmerkezi.managed/ altına MakaleManaged.java oluşturulur.

Java Resources/src altına net.kodmerkezi.entity paketi açılır. Java Resources/src/net.kodmerkezi.entity/ altına Makale.java oluşturulur.

MakaleManaged.java

?View Code JAVA
package net.kodmerkezi.managed;
 
import java.util.List;
 
import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;
import javax.persistence.EntityManager;
import javax.persistence.EntityManagerFactory;
import javax.persistence.Persistence;
import javax.persistence.criteria.CriteriaQuery;
 
import net.kodmerkezi.entity.Makale;
/**
 * 
 * @author Gürcan Kavakçı
 *
 */
@ManagedBean
@RequestScoped
public class MakaleManaged {
	private Makale makale;
	private List<Makale> makaleler;
 
	EntityManagerFactory emf = Persistence
			.createEntityManagerFactory("FullWebKodmerkeziNetPU");
	private EntityManager em;
 
	public Makale getMakale() {
		return makale;
	}
 
	public void setMakale(Makale makale) {
		this.makale = makale;
	}
 
	public MakaleManaged() {
		if (this.makale == null) {
			this.makale = new Makale();
			this.makale.setYazar("Gürcan Kavakçı");
			// TODO Auto-generated constructor stub
		}
	}
 
	public String makaleKaydet() {
 
		System.out.println("Makale kaydedildi");
 
		EntityManager em = emf.createEntityManager();
 
		em.getTransaction().begin();
 
		em.persist(this.makale);
 
		em.getTransaction().commit();
 
		em.close();
		emf.close();
 
		return "makaleler";
 
	}
	@SuppressWarnings({ "unchecked", "rawtypes" })
	public List<Makale> getMakaleler() {
		if (makaleler == null) {
 
			EntityManager em = emf.createEntityManager();
			CriteriaQuery cq = em.getCriteriaBuilder().createQuery();
			cq.select(cq.from(Makale.class));
			return em.createQuery(cq).getResultList();
 
		}
 
		return makaleler;
	}
 
	public void setMakaleler(List<Makale> makaleler) {
		this.makaleler = makaleler;
	}
	public void resetMakale()
	{
		makale = new Makale();
	}
 
}

Makale.java

?View Code JAVA
package net.kodmerkezi.entity;
 
import javax.persistence.Column;
import javax.persistence.Entity;
import javax.persistence.GeneratedValue;
import javax.persistence.GenerationType;
import javax.persistence.Id;
/**
 * 
 * @author Gürcan Kavakçı
 *
 */
@Entity
public class Makale {
	private static final long serialVersionUID = 1L;
	@Id
	@GeneratedValue(strategy = GenerationType.AUTO)
	private Long id;
	private String baslik;
	@Column(length=100000)
	private String icerik;
	private String yazar;
 
	public Long getId() {
		return id;
	}
 
	public void setId(Long id) {
		this.id = id;
	}
 
	public String getBaslik() {
		return baslik;
	}
 
	public void setBaslik(String baslik) {
		this.baslik = baslik;
	}
 
	public String getIcerik() {
		return icerik;
	}
 
	public void setIcerik(String icerik) {
		this.icerik = icerik;
	}
 
	public String getYazar() {
		return yazar;
	}
 
	public void setYazar(String yazar) {
		this.yazar = yazar;
	}
 
	public static long getSerialversionuid() {
		return serialVersionUID;
	}
 
	@Override
	public int hashCode() {
		int hash = 0;
		hash += (id != null ? id.hashCode() : 0);
		return hash;
	}
 
	@Override
	public boolean equals(Object object) {
		// TODO: Warning - this method won't work in the case the id fields are
		// not set
		if (!(object instanceof Makale)) {
			return false;
		}
		Makale other = (Makale) object;
		if ((this.id == null && other.id != null)
				|| (this.id != null && !this.id.equals(other.id))) {
			return false;
		}
		return true;
	}
 
	@Override
	public String toString() {
		return "net.kodmerkezi.entity[ id=" + id + " ]";
	}
}

Proje Properties (proje sağ tık) -> Project Facets -> Java Server Faces -> 2.0 -> further configuration  available -> Type: Disable Library Configuration -> OK -> Apply -> OK

WebContent/WEB-INF/web.xml şu şekilde duzenlenir.

?View Code XML
<?xml version="1.0"?>
<web-app version="3.0" xmlns="http://java.sun.com/xml/ns/javaee"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd">
	<display-name>FullWebKodmerkeziNet</display-name>
	<servlet>
		<servlet-name>Faces Servlet</servlet-name>
		<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
		<load-on-startup>1</load-on-startup>
	</servlet>
	<servlet-mapping>
		<servlet-name>Faces Servlet</servlet-name>
		<url-pattern>*.xhtml</url-pattern>
	</servlet-mapping>
	<welcome-file-list>
		<welcome-file>/pages/index.xhtml</welcome-file>
	</welcome-file-list>
	<context-param>
		<param-name>javax.faces.PROJECT_STAGE</param-name>
		<param-value>Development</param-value>
	</context-param>	
</web-app>

Java Resources/src altına META-INF adında klasörü açılır. İçine persistence.xml oluşturulur.

persistence.xml

?View Code XML
<?xml version="1.0" encoding="UTF-8"?>
 
<persistence version="2.0"
	xmlns="http://java.sun.com/xml/ns/persistence" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://java.sun.com/xml/ns/persistence http://java.sun.com/xml/ns/persistence/persistence_2_0.xsd">
 
	<persistence-unit name="FullWebKodmerkeziNetPU" transaction-type="RESOURCE_LOCAL">
		<provider>org.hibernate.ejb.HibernatePersistence</provider>
 
		<properties>
			<property name="javax.persistence.jdbc.driver" value="com.mysql.jdbc.Driver" />
			<property name="javax.persistence.jdbc.url" value="jdbc:mysql://localhost:3306/fullweb?characterEncoding=UTF-8" />
			<property name="javax.persistence.jdbc.user" value="root" />
			<property name="javax.persistence.jdbc.password" value="" />
			<property name="hibernate.dialect" value="org.hibernate.dialect.MySQL5InnoDBDialect" />
			<property name="hibernate.connection.shutdown" value="true" />
			<property name="hibernate.hbm2ddl.auto" value="update" />
			<property name="hibernate.show_sql" value="true" />
			<property name="hibernate.format_sql" value="true" />
		</properties>
	</persistence-unit>
</persistence>

pages/ altına makaleler.xhtml oluşturulur.

makaleler.xhtml

?View Code XML
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">
<f:view contentType="text/html">
	<h:head>
		<f:facet name="first">
			<meta content='text/html; charset=UTF-8' http-equiv="Content-Type" />
			<title>FullWebKodMerkeziNet</title>
		</f:facet>
	</h:head>
 
	<h:body>
		<p:dataTable id="makalelerTable" value="#{makaleManaged.makaleler}"
			var="makale" emptyMessage="Kayıt Yok" paginator="true" rows="10"
			paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
			rowsPerPageTemplate="5,10,15">
			<p:column>
				<f:facet name="header">
					<h:outputText value="Başlık" />
				</f:facet>
 
				<h:outputText value="#{makale.baslik}" />
			</p:column>
 
			<p:column>
				<f:facet name="header">
					<h:outputText value="Yazar" />
				</f:facet>
 
				<h:outputText value="#{makale.yazar}" />
			</p:column>
			<p:column>
				<p:commandButton value="Oku" icon="ui-icon-bullet"
					onclick="makaleDetailDialogWidget.show();"
					update=":makaleDetailDialogForm">
					<f:setPropertyActionListener target="#{makaleManaged.makale}"
						value="#{makale}" />
				</p:commandButton>
			</p:column>
 
		</p:dataTable>
		<ui:include src="/pages/makaleDetailDialog.xhtml" />
	</h:body>
</f:view>
</html>

pages/ altına makaleDetailDialog.xhtml oluşturulur.

makaleDetailDialog.xhtml

?View Code XML
<!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:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">
<h:body>
	<p:dialog widgetVar="makaleDetailDialogWidget"
		id="otobusDetailDialogId" width="500" modal="true" closable="true"
		draggable="false" resizable="false">
		<h:form id="makaleDetailDialogForm" prependId="false">
			<p:panel header="#{makaleManaged.makale.baslik}" footer="#{makaleManaged.makale.yazar}">
				<h:outputText escape="false"
					value="#{makaleManaged.makale.icerik}" />
			</p:panel>
		</h:form>
	</p:dialog>
</h:body>
</html>

Bu aşamadan sonra veritabanınızda (ben wampserver üzerinde mysql ile çalışıyorum) “fullweb” adında database oluşturun. persistence xml  dosyasını kendi ayarlarınıza göre düzenleyin. Uygulamaya sağ tıklayarak -> Run As -> Run on Server seçeneği ile Tomcat 7 üzerinde başlatın. Daha sonra browser’ınızdan http://localhost:8080/FullWebKodMerkeziNet/ adresini açarak uygulamaya erişebilirsiniz.

Açılışta karşımıza yeni makale ekleyebileceğimiz alan geliyor.

jsf_yenimakale

Kaydettiğimizde tüm makalelerin listesini görebiliyoruz.

jsf_tummakale

Okumak istediğimiz makaleyi seçtiğimizde karşımıza ayrıntıları geliyor.

jsf_makaleayrinti

Arkadaşlar bugünlük bu kadar. Takıldığınız noktalar olursa yazabilirsiniz. Bir sonraki yazımda daha kompleks yapıları anlatacağım. İyi günler

Projenin kaynak kodlarını buradan indirebilirsiniz. Rar şifresi: www.kodmerkezi.net

Bunlara da Göz Atmak İsteyebilirsiniz.

<<< Önceki:

Sonraki: >>>


Facebookta Paylaş

9 yorum »

  • Mustafa dedi ki:

    teşekkürler,
    güzel paylaşım..

    # 25 Mayıs 2013 saat 19:09
  • ender dedi ki:

    Merhaba,
    Programı indirerek tüm söylediklerinizi yaptım, fakat oku butonu aktif değil gibi görünüyor.. bastıgımda tepki vermiyor. bu konuda ne yapabilirim? eclipse üzerinden çalıştırdım..

    # 4 Haziran 2013 saat 13:50
  • Ozkan dedi ki:

    Merhaba, emeğiniz için şimdiden teşekkür ederim. Fakat kaynak kodları yüklediğiniz site yasaklanmış durumda. Başka bir yere yükleyebilir misiniz?

    # 16 Aralık 2013 saat 14:28
  • Caner dedi ki:

    Emeğinize sağlık.
    Kaynak kodlıarın linkini yenileyebilir misiniz?

    # 18 Aralık 2013 saat 10:39
  • uzeyr ozcan dedi ki:

    linkleri güncelleyebilir misiniz

    # 20 Aralık 2013 saat 08:57
  • hakan dedi ki:

    Oncelikle paylasim için tesekkurler.
    Projenin kaynak kodları ulasilamaz durumda. Kaynak kodları baska bir yere atabilirmisiniz
    (bu site uzerinde olması en guvenli yol)

    # 8 Ocak 2014 saat 14:44
  • Taha GÜR dedi ki:

    Linkleri güncelleyebilirmisiniz.

    # 19 Mart 2014 saat 12:09
  • admin dedi ki:

    En kısa zamanda kontrol edeceğim.

    # 27 Ocak 2015 saat 23:09
  • Mehmet dedi ki:

    ender dedi ki:
    Merhaba,
    Programı indirerek tüm söylediklerinizi yaptım, fakat oku butonu aktif değil gibi görünüyor.. bastıgımda tepki vermiyor. bu konuda ne yapabilirim? eclipse üzerinden çalıştırdım.

    # 4 Haziran 2013 saat 13:50

    Sanırım senin hatan primefaces ile alakalı kullandığın commandButton’un
    ajax parametresini false olarak setlerseniz düzelir.

    İyi Çalışmalar

    # 25 Mart 2015 saat 10:24

Yorum Bırakın!

Yorum yaz, yada kendi sitende trackback (Geri besleme) olarak ekle. Ayrıca RSS ile bu konuya üye olabilirsin. .

Nazik olun. Temiz tutun. Konu dışına çıkmayın. Spam yaratmayın.

Bu tagları kullanabilirsiniz:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Bloğumuz gavatarı desteklemektedir. Kendi gavatarınızı edinmek için lütfen Gravatar a üye olun.