• Tidak ada hasil yang ditemukan

1. MENGINSTALL FLEX BUILDER pada ECLIPSE

N/A
N/A
Info
Unduh - Bebas
Protected

Academic year: 2021

Membagikan "1. MENGINSTALL FLEX BUILDER pada ECLIPSE"

Copied!
32
0
0

Memuat.... (Lihat teks lengkap sekarang)

Unduh sekarang ( 32 Halaman )

Teks penuh

(1)

1 [email protected] 

1.  MENGINSTALL  FLEX BUILDER pada ECLIPSE 

·  Install jdk‐6u7‐windows‐i586‐p 

·  Extract eclipse‐jee‐ganymede‐SR1‐win32 keD:\DEVELOPERS 

(2)

2 [email protected] 

2.  Menginstall SERVER  apache‐tomcat‐6.0.18 

·  Install apache‐tomcat‐6.0.18  diD:\DEVELOPERS 

Port: 8080  Username : admin

(3)

3 [email protected] 

3.  Membuat Database 

·  Membuat database dengan nama prototypedb dan tabel mahasiswa  Username : root  Password : 

o

  Jalankan XAMPP 

o  Jalankan browser,  browse kehttp://localhost/phpmyadmin/ 

o  Pilih tab SQL, Dan masukkan sintak berikut  CREATE TABLE IF NOT EXISTS `mahasiswa` (  `id` bigint(20) NOT NULL auto_increment,  `nrp` varchar(7) default NULL,  `nama` varchar(50) default NULL,  `tgl_lahir` datetime default NULL,  PRIMARY KEY  (`id`)  ) ENGINE=MyISAM  DEFAULT CHARSET=latin1 AUTO_INCREMENT=16 ;  INSERT INTO `mahasiswa` (`id`, `nrp`, `nama`, `tgl_lahir`) VALUES  (1, '0672102', 'ade', '1986‐05‐17 00:00:00');

(4)

4 [email protected]  o  Klik tombol GO 

4.  Menggunakan BlazeDS 

·  Extract file blazeds‐bin‐3.2.0.3978 

·  Rename file blazeds.war menjadi prototype.war 

·  Jalankan Apache Tomcat 

(5)

5 [email protected]  ·  Jalankan browser, browse kehttp://localhost:8080/manager/html 

·  Lihat pada “select war file to upload” ,browse prototype.war, dan klik tombol deploy 

·  Jalankan eclipse 

(6)

6 [email protected]  ·  Pilih FILE > New > Project  ·  Pilih project  > next  ·  Hilangkan selected pada Use default location  ·  Browse keD:\DEVELOPERS\Tomcat 6.0\webapps\prototype  ·  Project name:  prototype

(7)
(8)

8 [email protected] 

5.  Menggunakan Spring dan Hibernate 

·  klik File > new > Java Project  ·  project name : Prototype1B  ·  Buat file java Mahasiswa.java, sebagai mapping di  Prototyoe1B>src  o  Dengan package :flex.samples.spring.prototype

(9)

9 [email protected] 

· Clik kanan pada folrder src , pilih new >class

· Buat atribuat pada Mahasiswa.java  private long idMhs; 

private String nrp;  private String nama;  private Date tglLahir;

· buat getterAndSetter 

(10)

10 bY [email protected]  · Buat Interface data accses object dengan nama MahasiswaDAO  o  Dengan package :flex.samples.spring.prototype  o  Klik kanan pada folder src, pilih new > Interface  package flex.samples.spring.prototype;  import java.util.Collection;  import org.springframework.dao.DataAccessException;  public interface MahasiswaDAO { 

public Collection findAll() throws DataAccessException ;  public void createMahasiswa(Mahasiswa mahasiswa) throws  DataAccessException ; 

public void updateMahasiswa(Mahasiswa mahasiswa) throws  DataAccessException ; 

public String deleteMahasiswa(String mahasiswa) throws  DataAccessException ; 

(11)

11 bY [email protected]  ·  Buat class implement dari Interface MahasiswaDAO.java dengan nama MahasiswaDAOImpl.java  o  Dengan package :flex.samples.spring.prototype  o  Klik kanan pada folder src, pilih new > Class  package flex.samples.spring.prototype;  import java.util.Collection;  import org.hibernate.HibernateException;  import org.hibernate.Query;  import org.hibernate.Session;  import org.hibernate.SessionFactory;  import org.springframework.dao.DataAccessException;  import org.springframework.orm.hibernate3.SessionFactoryUtils;  public class MahasiswaDAOImpl implements MahasiswaDAO{ 

private SessionFactory sessionFactory; 

public void setSessionFactory(SessionFactory sessionFactory) {  this.sessionFactory = sessionFactory; 

}  public SessionFactory getSessionFactory() {  return this.sessionFactory;  }  @Override  public void createMahasiswa(Mahasiswa mahasiswa)  {  Session session = 

SessionFactoryUtils.getSession(getSessionFactory(),  false); 

try { 

session.save(mahasiswa);  } catch (HibernateException e) { 

throw 

SessionFactoryUtils.convertHibernateAccessException(e);  } 

} 

@Override 

public String deleteMahasiswa(String nama)  {  Session session = 

SessionFactoryUtils.getSession(getSessionFactory(),false);  try{  String hql = "delete from Mahasiswa where nama  ='"+nama+"'";  Query query = session.createQuery(hql);  int row = query.executeUpdate();  if (row == 0){  return "Doesn't deleted any row!";

(12)

12 bY [email protected]  }  else{  return "Deleted Row: " + row;  }  }catch (HibernateException e) {  throw 

SessionFactoryUtils.convertHibernateAccessException(e);  } 

} 

@Override 

public Collection findAll()  {  Session session = 

SessionFactoryUtils.getSession(getSessionFactory(),  false); 

try { 

return session.createQuery("from Mahasiswa").list();  } catch (HibernateException e) { 

throw 

SessionFactoryUtils.convertHibernateAccessException(e);  } 

} 

@Override 

public void updateMahasiswa(Mahasiswa mahasiswa) throws  DataAccessException { 

Session session = 

SessionFactoryUtils.getSession(getSessionFactory(),  false); 

try { 

session.update(mahasiswa);  } catch (HibernateException e) { 

throw 

SessionFactoryUtils.convertHibernateAccessException(e);  } 

}  }

(13)

13 bY [email protected]  ·  Buat folder lib pada Prototype1B 

o  Klik kanan pada folder Prototype1B , pilih new>folder 

o  Copy librari(terdapat pada folder DEVELOPMENT/lib)  ke folder Prototype1B>lib  o  Library :  Ant‐antlr‐1.6.5.jar  Antlr‐2.7.6.jar  Asm‐attrs.jar  Asm.jar  Cglib‐2.1.3.jar  Commons‐collections‐2.1.1.jar  Commons‐logging.jar  Dom4j‐1.6.1.jar  Hibernate3.jar  Jta.jar  Log4j‐1.2.11.jar  Mysql‐connector‐java‐5.1.6‐bin.jar  Spring.jar

(14)

14 bY [email protected]  ·  Buat buld path 

o  Klik kana pada Prptotype1B >build Path>Configure >Build Path>  o  Pilih tab libraries, klik tombol Add Jars

(15)
(16)

16 bY [email protected]  Masukkan jars dari Prototype1B>lib 

(17)

17 bY [email protected]  ·  Compile Prototype1B 

·  Klik kanan pada folder Prototype1B>Run As>java Application > cancel 

·  Copy class – class java (Prototype1B /bin/)yang sudah di install ke Prototype >WEB‐ 

INF>classes 

(18)

18 bY [email protected]  ·  Jika folder bin belum terbuka,dapat dilakukan hal berikut 

(19)

19 bY [email protected] 

·  Buat file Mahasiswa.hbm.xml padaprototype /WEB‐ 

INF/classes/flex/samples/spring/prototype/  ·  Masukkan script berikut: 

<?xml version="1.0"?> 

<!DOCTYPE hibernate­mapping PUBLIC "­//Hibernate/Hibernate Mapping DTD  3.0//EN" "http://hibernate.sourceforge.net/hibernate­mapping­3.0.dtd"  []> 

<hibernate­mapping package="flex.samples.spring.prototype">  <class name="Mahasiswa" table="mahasiswa"> 

<id name="idMhs" type="long" column="id" unsaved­value="0">  <generator class="identity"/> 

</id> 

<property name="nama" column="nama" length="20"/>  <property name="nrp" column="nrp" length="7"/> 

<property name="tglLahir" column="tgl_lahir" length="40"/>  </class> 

</hibernate­mapping>

·  Copy‐kan SpringFactory.class SpringFactory$SpringFactoryInstance.class (file terdapat di folder  DEVELOPMENT/factory/bin ) padaprototype/WEB‐INF/classes/flex/samples/factories

(20)

20 bY [email protected]  ·  Tambahkan script berikut pada  prototype/WEB‐INF/flex/service‐config.xml 

­­­ 

</system>  <factories> 

<factory id="spring" class="flex.samples.factories.SpringFactory"/>  </factories> 

­­­

· Buat file prototype/WEB­INF/applicationContext.xml

· Masukkan script berikut 

<?xml version="1.0" encoding="UTF­8"?> 

<!DOCTYPE beans PUBLIC "­//SPRING//DTD BEAN//EN" 

"http://www.springframework.org/dtd/spring­beans.dtd">  <beans> 

<bean id="dataSource" 

class="org.springframework.jdbc.datasource.DriverManagerDataSource">  <property name="driverClassName" value="com.mysql.jdbc.Driver"/>  <property name="url" value=" jdbc:mysql://localhost/prototypedb"/>  <property name="username" value="root"/> 

<property name="password" value=""/>  </bean>  <bean id="sessionFactory"  class="org.springframework.orm.hibernate3.LocalSessionFactoryBean">  <property name="mappingResources">  <list> 

<value>flex/samples/spring/prototype/Mahasiswa.hbm.xml</value>  </list> 

</property> 

<property name="hibernateProperties">  <props> 

<prop 

key="hibernate.dialect">org.hibernate.dialect.HSQLDialect</prop> 

</props>  </property> 

<property name="dataSource"><ref bean="dataSource"/></property>  </bean>  <bean id="txManager"  class="org.springframework.orm.hibernate3.HibernateTransactionManager">  <property name="sessionFactory">  <ref local="sessionFactory"/>  </property>  </bean>  <bean id="mahasiswaDAOBeanTarget"  class="flex.samples.spring.prototype.MahasiswaDAOImpl">  <property name="sessionFactory" ref="sessionFactory"/>  </bean>

(21)

21 bY [email protected]  <bean id="mahasiswaDAOBean" 

class="org.springframework.transaction.interceptor.TransactionProxyFact  oryBean"> 

<property name="transactionManager" ref="txManager" />  <property name="target" ref="mahasiswaDAOBeanTarget" />  <property name="transactionAttributes"> 

<props> 

<prop key="create*">PROPAGATION_REQUIRED</prop>  <prop key="update*">PROPAGATION_REQUIRED</prop>  <prop key="delete*">PROPAGATION_REQUIRED</prop>  <prop key="*">PROPAGATION_REQUIRED,readOnly</prop>  </props>  </property>  </bean>  </beans> ·  Tambahkan scrip berikut padaprototype/web.xml  ­­­­  </resource­ref>  ­­>  <context­param> 

<param­name>contextConfigLocation</param­name> 

<param­value>/WEB­INF/applicationContext.xml</param­value>  </context­param>  <listener>  <listener­class>org.springframework.web.context.ContextLoaderListener  </listener­class>  </listener>  </web­app>  Tambahkan script berikut pada prototype/WEB­INF/flex/remoting­  config.xml  ­­­­  </default­channels>  <destination id="mahasiswaService">  <properties> 

<factory>spring</factory> 

<source>mahasiswaDAOBean</source>  </properties> 

</destination>  ­­­ 

Tambahkan script berikut pada prototype/WEB‐INF/flex/remoting‐config.xml  <?xml version="1.0" encoding="UTF­8"?> 

<service id="remoting­service" 

class="flex.messaging.services.RemotingService">  <adapters>

(22)

22 bY [email protected]  <adapter­definition id="java­object"  class="flex.messaging.services.remoting.adapters.JavaAdapter"  default="true"/>  </adapters>  <default­channels>  <channel ref="my­amf"/>  </default­channels>  <destination id="mahasiswaService">  <properties> 

<factory>spring</factory> 

<source>mahasiswaDAOBean</source>  </properties>  </destination>  </service> ·  Copy librari  ke folder prototype/WEB‐INF>lib  ·  Library:  Ant‐antlr‐1.6.5.jar  Antlr‐2.7.6.jar  Asm‐attrs.jar  Asm.jar  Cglib‐2.1.3.jar  Commons‐collections‐2.1.1.jar  Commons‐logging.jar  Dom4j‐1.6.1.jar  Hibernate3.jar  Jta.jar  Log4j‐1.2.11.jar  Mysql‐connector‐java‐5.1.6‐bin.jar  Spring.jar

(23)

23 bY [email protected]  ·  Untuk mengecek apakah konfigurasi berhasil. Jalankan Apache Tomcat 

(24)

24 bY [email protected]  ·  Membuat FrontEnd dengan Flex  o  Klik File>new >other>Flex Builder/Flex Project  o  Project name: Prototype1  o  Apllication type :J2EE  o  Tandain Use Remote Object Access Service  o  Hilangkan tanda pada Create combine Jva/Flex Project using wtp

(25)

25 bY [email protected]  o  Klik tombol next 

o  Pada Configure J2EE server 

o  Hilangkan tanda pada Use default Location For Locat LifeCycle data Services Server  o  Root folder , browse ke:D:\DEVELOPERS\Tomcat 6.0\webapps\prototype 

o  Root Url :http://localhost:8080/prototype  o  Context root: /prototype 

(26)

26 bY [email protected]  ·  Membuat File Mahasiswa.as  o  Klik kana pada folder src,  pilih new>ActionScript Class  o  Masukkan script berikut:  package  {  [Bindable]  [RemoteClass(alias="flex.samples.spring.prototype.Mahasiswa")]  public class Mahasiswa  {  public function Mahasiswa()  {  }  public var idMhs:int;  public var nrp:String;  public var nama:String;  public var tglLahir:Date;  }  }

(27)

27 bY [email protected]  ·  Membuat komponen form dengan nama UpdateForm .mxml  o  Klk kanan pada folder src, pilih New>MXML Component  o  Klik finish  o  Masukkan Script Berikut:  <?xml version="1.0" encoding="utf­8"?>  <mx:Form xmlns:mx="http://www.adobe.com/2006/mxml" xmlns="*"  height="30%" width="100%" backgroundColor="#6B9BF3"> 

<mx:Script>  <![CDATA[  import mx.rpc.events.ResultEvent;  import mx.rpc.events.FaultEvent;  import mx.collections.ArrayCollection;  import mx.controls.Alert;  private function  resultHandlerUpdateMhs(event:ResultEvent):void{

(28)

28 bY [email protected]  Alert.show("updating is success"); 

} 

private function faultHandler(event:FaultEvent):void{  Alert.show(event.fault.faultString, "Error");  } 

]]>  </mx:Script> 

<mx:RemoteObject id="srv" destination="mahasiswaService">  <mx:method name="updateMahasiswa" 

result="resultHandlerUpdateMhs(event)" fault="faultHandler(event)"/>  </mx:RemoteObject> 

<Mahasiswa id="mahasiswa"  nrp="{nrp.text}" 

nama="{nama.text}" 

tglLahir="{dateF.selectedDate}"  /> 

<mx:FormItem label="NRP" width="177"  borderColor="#F9EB0A" color="#2D2B2B"> 

<mx:TextInput width="126" id="nrp"  text="{mahasiswa.nrp}"/> 

</mx:FormItem> 

<mx:FormItem label="NAMA" width="178"  borderColor="#FBE709" color="#42423E"> 

<mx:TextInput width="131" id="nama"  text="{mahasiswa.nama}"/> 

</mx:FormItem> 

<mx:FormItem label="T_LAHIR" height="22"  width="178"> 

<mx:DateField  id="dateF" width="112" /> 

</mx:FormItem> 

<mx:Button label="Update"  click="srv.updateMahasiswa(mahasiswa)"/>  </mx:Form> ·  Membuat Form Main  o  Klik kanan pada folder src, pilih New>MXML Application  o  Filename:Prototype.mxml  o  Layout:Vertical

(29)

29 bY [email protected]  o  Masukkan script berikut : Prorotype.mxml 

<?xml version="1.0" encoding="utf­8"?> 

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns="*"  layout="vertical" width="100%" height="100%" 

backgroundGradientAlphas="[1.0, 1.0]"  backgroundGradientColors="[#EAC768, #EDE19D]"  creationComplete="init()" borderColor="#E0BA0B">  <mx:Script>  <![CDATA[  import mx.rpc.events.ResultEvent;  import mx.rpc.events.FaultEvent;  import mx.collections.ArrayCollection;  import mx.controls.Alert;  import mx.utils.ObjectUtil;  [Bindable]  private var dataMahasiswa:ArrayCollection; 

private function init():void{  srv.findAll(); 

} 

private function 

resultHandlerMahasiswa(event:ResultEvent):void{ 

dataMahasiswa= event.result as ArrayCollection;  }  private function  resultHandlerCreateMhs(event:ResultEvent):void{  Alert.show("creating is success");  srv.findAll();  }

(30)

30 bY [email protected]  private function  resultHandlerDeleteMhs(event:ResultEvent):void{  srv.findAll();  Alert.show( ObjectUtil.toString(event.result)  );  } 

private function faultHandler(event:FaultEvent):void{  Alert.show(event.fault.faultString, "Error");  } 

]]>  </mx:Script> 

<mx:RemoteObject id="srv" destination="mahasiswaService">  <mx:method name="findAll" 

result="resultHandlerMahasiswa(event)" fault="faultHandler(event)"/>  <mx:method name="createMahasiswa" 

result="resultHandlerCreateMhs(event)" fault="faultHandler(event)"/>  <mx:method name="deleteMahasiswa" 

result="resultHandlerDeleteMhs(event)" fault="faultHandler(event)"/>  </mx:RemoteObject> 

<Mahasiswa id="mahasiswa"  nrp="{nrp.text}" 

nama="{nama.text}" 

tglLahir="{dateF.selectedDate}"  /> 

<mx:Label text="Prototype" fontFamily="Courier New" 

fontStyle="italic" fontWeight="bold" fontSize="28" textAlign="left"  width="172" color="#010908"/> 

<mx:VBox width="100%" height="100%"> 

<mx:Label text="Tabel Mahasiswa" fontWeight="bold"  fontSize="17" color="#050000"/> 

<mx:DataGrid width="100%" height="30%" id="listMhs"  dataProvider="{dataMahasiswa}" alternatingItemColors="[#D8AD3A,  #EAC768]" alpha="1.0" themeColor="#FFFFFF"> 

<mx:columns> 

<mx:DataGridColumn headerText="NRP"  dataField="nrp"/> 

<mx:DataGridColumn headerText="NAMA"  dataField="nama"/> 

<mx:DataGridColumn headerText="TGL LAHIR"  dataField="tglLahir"/> 

</mx:columns>  </mx:DataGrid> 

<mx:HBox width="100%" height="100%">  <mx:Form height="30%" width="30%"  backgroundColor="#D8AD3A" backgroundAlpha="0.57"> 

<mx:FormItem label="NRP" width="177"  color="#171403">

(31)

31 bY [email protected]  <mx:TextInput width="130" id="nrp"/>  </mx:FormItem> 

<mx:FormItem label="NAMA" width="178"  color="#110F01"> 

<mx:TextInput width="130" id="nama"/>  </mx:FormItem> 

<mx:FormItem label="T_LAHIR" height="22"  width="178" color="#090800" borderColor="#01080D"> 

<mx:DateField id="dateF" width="112"/>  </mx:FormItem> 

<mx:Button label="Insert" color="#090800"  click="{srv.createMahasiswa(mahasiswa)}"/> 

</mx:Form>  <UpdateForm 

mahasiswa="{Mahasiswa(listMhs.selectedItem)}" width="30%" height="30%"  backgroundColor="#D8AD3A" backgroundAlpha="0.58"/> 

<mx:Form height="30%" width="30%"  backgroundColor="#D8AD3A" backgroundAlpha="0.57"> 

<mx:FormItem label="Nama" width="177"  borderColor="#F9EB0A" color="#2D2B2B"> 

<mx:TextInput width="126" id="nama2"/>  </mx:FormItem> 

<mx:Button label="Delete"  click="srv.deleteMahasiswa(nama2.text)"/> 

</mx:Form>  </mx:HBox> 

</mx:VBox>  </mx:Application>

(32)

32 bY [email protected]  ·  Menjalankan Aplikasi 

o  Klik kanan pada Prototype.mxml , pilih Set Default Applicaton  o  Klik kanan pada Project Prototype1, pilih Run As>Flex Application

Referensi

Unduh sekarang ( PDF - 32 Halaman - 1.07 MB )

Dokumen terkait