Cimande 2.0 Quick Start Guide

(1)

Cimande 2.0 Quick Start Guide

BAB I

(2)

Tujuan

• Mengetahui dan Memahami Eclipse IDE

• Mengetahui dan Memahami Maven dan M2Eclipse

• Mengetahui dan Memahami Apache Tomcat

• Mengetahui dan Memahami MySQL Database

Materi Pembelajaran

1.1.

Eclipse IDE

Eclipse adalah sebuah IDE (Integrated Development Environment) untuk

mengembangkan perangkat lunak dan dapat dijalankan di semua platform (

platform-independent). Berikut ini adalah sifat dari Eclipse:

• Multi - platform

Target sistem operasi Eclipse adalah Microsoft Windows, Linux, Solaris, AIX, HP-UX

dan Mac OS X

• Mulit - language

Eclipse dikembangkan dengan bahasa pemrograman Java, akan tetapi Eclipse

mendukung pengembangan aplikasi berbasis bahasa pemrograman lainnya, seperti

C/C++, Cobol, Phyton, Perl, PHP dan lain sebagainya

• Multi - role

Selain sebagai IDE untuk pengembangan aplikasi, Eclipse pun bisa digunakan untuk

aktivitas dalam siklus pengembangan perangkat lunak, seperti dokumentasi, test

perangkat lunak, pengembangan web, dan lain sebagainya.

Eclipse pada saat ini merupakan salah satu IDE favorit dikarenakan gratis dan open

(3)

macam plugin yang tersedia di Eclipse :

– Subversion

– m2eclipse

– Glassfish Integration

– Jboss Tools

– STS (SpringSource Tool Suite)

– EGIT (Git Eclipse Plugin)

– Mercurial Eclipse (Mercurial Eclipse Plugin)

– Windows Builder

1.2.

Maven dan m2eclipse

Maven adalah salah satu build tool populer yang memiliki fungsi mirip seperti Ant, akan

tetapi dengan pendekatan yang lebih kompleks dan sangat berbeda dengan Ant. Maven

sangat baik digunakan dalam pengembangan proyek yang dikerjakan secara berkelompok.

M2eclipse merupakan plugin yang mendukung pengembangan software berbasis maven

pada Eclipse IDE.

1.3.

Apache Tomcat

Apache Tomcat adalah servlet container yang dikembangkan oleh Apache Software

Foundation. Tomcat mengimplementasikan spesifikasi Java Servlet dan JSP dan

menyediakan “pure Java” HTTP web server untuk menjalankan kode Java. Tomcat dapat

dijalankan di banyak sistem operasi seperti Windows, Linux, Mac, dll.

Tomcat memiliki fitur-fitur canggih seperti pesan kesalahan yang dapat dikonfigurasi,

autentikasi berbasis basis data dan lain-lain. Tomcat juga didukung oleh sejumlah antarmuka

pengguna berbasis grafik (GUI) yang memungkinkan penanganan server menjadi lebih

(4)

1.4.

MySQL Database

MySQL adalah perangkat sistem manajemen basis data opensource dibawah lisensi

GNU General Public Licence. MySQL merupakan database terpopupler di dunia saat ini yang

sering menjadi pilihan dalam penggunaan aplikasi berbasis web. Paket instalasi MySQL

(5)

Cimande 2.0 Quick Start Guide

BAB II

(6)

Tujuan

• Mengetahui dan Memahami Instalasi Eclipse IDE

• Mengetahui dan Memahami Instalasi m2eclipse

Materi Pembelajaran

2.1. Instalasi Eclipse IDE

Eclipse versi terbaru dapat di download di http://eclipse.org/. Berikut langkah-langkah

instalasi Eclipse IDE.

• Download Eclipse, pilih versi sesuai dengan sistem operasi yang digunakan. Gunakan

Eclipse IDE for Java EE Developer.

• Setelah proses download selesai extract paket yang telah terdownload (instalasi

Eclipse IDE tidak menggunkan wizard sama sekali). Kemudian jalankan Eclipse

(7)

• Pilih workspace yang akan digunakan sebagai tempat penyimpanan proyek dan metadata eclipse.

(8)

2.2. Instalasi M2Eclipse

Cimande menggunakan Ant Build Tool hingga versi 1.3.5, pada versi mayor 2.0

Cimande menggunakan Maven untuk mendukung dependency management dan archetype

untuk memudahkan pembuatan proyek dibawah Cimande SDK. Penggunaan maven adalah

berbasis perintah/command, Eclipse menyediakan m2e untuk memudahkan pembuatan

aplikasi berbasis maven pada Eclipse IDE. Berikut langkah instalasi m2e.

(9)

• Masukkan link http://download.eclipse.org/technology/m2e/releases/ ke dalam kolom Work with kemudian tekan enter, tunggu beberapa saat hingga muncul daftar plugin

yang dapat diinstal.

Catatan: Link update site dapat berubah-ubah setiap saat, keterangan lebih lengkap

terdapat pada http://eclipse.org/m2e/. Instalasi plugin membutuhkan koneksi

internet.

(10)

• Lakukan semua proses, terakhir tekan tombol Finish, maka Eclipse akan mulai men-download semua plugin yang dibutuhkan.

• Restart Eclipse

Secara default ketikan m2e diinstal, secara otomatis Maven juga akan ikut terinstal sehingga

instalasi m2e tidak membutuhkan instalasi Maven secara terpisah.

(11)

Cimande 2.0 Quick Start Guide

BAB III

(12)

Tujuan

1.

Mengetahui dan Memahami Pembuatan Maven Project

2.

Mengetahui dan Memahami Generate Schema dengan Maven Build

Materi Pembelajaran

3.1 Menjalankan Cimande Project

Sebagai permulaan, kita akan membuat cimande project untuk menampilkan form

Admin Cimande, dengan langkah – langkah sebagai berikut :

• Buat sebuah database dengan nama cimande.

• Buat Maven project dengan cara File → New → Other → Maven → Maven Project

• Pilih lokasi dimana proyek akan disimpan, jika tidak ada perubahan secara default Eclipse akan meletakkan proyek pada workspace yang telah dipilih

ketika Eclipse pertama kali dijalankan.

• Pada field Catalog pilih All Catalogs kemudian pada field Filter ketik org.blueoxygen

(13)

Catatan: Dalam beberapa kasus eclipse tidak secara otomatis mengindex catalog yag terdapat pada maven central, sehingga ketika memasukkan filter, daftar archetype yang diinginkan tidak muncul. Masalah ini dapat diatasi dengan memasukkan archetype secara manual, pilih Add Archetype

• Masukkan Group Id dan Artifact Id. Sebagai contoh:

GroupId : org.blueoxygen

(14)

Berikut baris perintah bilamana menggunakan maven console.

mvn archetype:generate

-DarchetypeGroupId=org.blueoxygen.cimande -DarchetypeArtifactId=cimande-archetype-blank -DarchetypeVersion=2.0

-DgroupId=org.blueoxygen -DartifactId=sample

(15)

• Buka file konfigurasi, hibernate.properties, sesuaikan beberapa property sesuai dengan database, seperti:

◦ hibernate.connection.username → username database

◦ hibernate.connection.password → password database

◦ hibernate.connection.url → url dan nama database yang digunakan

• Masukkan perintah untuk menggenerate table schema dengan cara klik kanan project

→ Run As → Maven Build. Isi Goals dengan perintah hibernate3:hbm2ddl

• Untuk mengimport data table kedalam database gunakan perintah

(16)

• Jalankan perintah tomcat:run, maka secara otomatis Maven akan mendeploy aplikasi ke dalam server serta menjalankan server.

• Setelah server berhasil dijalankan, proyek dapat dibuka melalui url

http://localhost:8080/{artifactId}. Masukkan username admin dan password

(17)

Cimande 2.0 Quick Start Guide

BAB IV

(18)

Tujuan

1. Mengetahui dan Memahami Project Cimande

2. Mengimplementasikan CRUD dalam Project Cimande

Materi Pembelajaran

4.1 Cimande 2.0 Overview

Cimande adalah sebuah aplikasi berbasis MVC yang menggunakan Velocity sebagai

presentation layer, Struts sebagai controller, serta Hibernate sebagai modelnya. Integrasi antara Struts dengan Hibernate menggunakan Spring dan Integrasi Struts dengan Velocity

menggunakan XWork. Beberapa keunggulan Cimande 2.0 daripada versi sebelumnya yaitu :

a. Maven Build Tool

Jika Cimande versi sebelumnya menggunakan Ant sebagai Build Tool, pada Cimande 2.0

ini menggunakan Maven dengan plugin dan dependency managementnya yang sangat

powerful. Hal ini juga menghilangkan kesan Cimande yang kurang ramah dengan IDE

selain Eclipse, sehingga developer yang akan mengembangkan aplikasi diatas Cimande

dapat memilih menggunakan IDE sesuai yang dikehendaki

b. Archetype

Cimande 2.0 telah di-host di java.net , dengan Nexus yang telah termirror dengan Maven

Central membuat para developer yang akan mengembangkan Cimande cukup menggenerate Archetype untuk membuat sebuah workspace yang siap pakai

c. REST

REST (Representational State Transfer) merupakan sebuah arsitektur dari sistem jaringan dimana setiap server hanya menyajikan konten data yang diminta oleh client tanpa

mempengaruhi client itu sendiri. Dengan adanya fitur REST, Cimande 2.0 menyediakan

beberapa layer presentation (multiple presentation) yang mendukung output selain html,

(19)

d. Multiple Datasource

Cimande 2.0 dapat mengambil datasource selain database, contohnya Content

Management dengan CMIS dan Workflow dengan Joget

e. Security Interceptor (Debus)

Security Interceptor ini merupakan penyempurnaan dari beberapa celah keamanan

Cimande versi sebelumnya

f. Social Network Support

Cimande 2.0 mendukung koneksi ke beberapa jejaring sosial seperti Facebook dan Twitter

4.2 Pembuatan Package

Dalam implementasi CRUD Cimande 2.0 kali ini kita tidak menggunakan contoh

Item-Category lagi, namun kita akan membuat form untuk pengisian keterangan diri seseorang.

Setelah membuat Maven project dan mengimportnya ke Eclipse pada BAB sebelumnya,

sekarang kita perlu membuat package – package sebagai tempat kita meletakkan java class.

Buat 4 package di dalam package org.blueoxygen, yaitu package entity, dao,

service, dan controller. Fungsi pembuatan package – package tersebut adalah sebagai

berikut :

• Package org.blueoxygen.entity

Package ini berisi entity class yang berfungsi sebagai penghubung framework dengan

database. Pembuatan table dan semua variabel yang akan ditampilkan dalam

database di deklarasikan disini

• Package org.blueoxygen.dao

Data Access Object (DAO) merupakan sebuah object yang menyediakan sebuah

(20)

operasi tertentu tanpa memperlihatkan detail database. Penerapan konsep ini sering

disebut dengan separation of concern, dimana setiap kode dipisahkan berdasarkan

fungsinya sehingga kode diatasnya hanya perlu mengetahui secara abstrak cara

mengakses data tanpa perlu mengetahui bagaimana akses ke sumber data di

implementasikan

• Package org.blueoxygen.service

Service merupakan sebuah objek yang berfungsi untuk menyederhanakan kumpulan

kode besar seperti library. Dalam kasus database kita dapat menggunakan Service

untuk mengelompokkan beberapa DAO dalam sebuah transaksi

• Package org.blueoxygen.controller

Controller adalah sebuah layer yang bekerja untuk mengatur urusan “antar layer”,

(21)

4.3 Pembuatan Java Class

4.3.1

Buat class Person.java di package org.blueoxygen.entity

package org.blueoxygen.entity;

import java.util.Date;

import javax.persistence.Entity;

import javax.persistence.Inheritance;

import javax.persistence.InheritanceType;

import javax.persistence.Table;

import org.blueoxygen.cimande.commons.DefaultPersistence;

/**

* @author Nety Herawaty *

*/

@Entity

@Table(name = "module_person")

@Inheritance(strategy = InheritanceType.SINGLE_TABLE)

public class Person extends DefaultPersistence {

private String fname;

private String lname;

private String sex;

private Date birthdate;

private String address;

private String city;

private String country;

private String email;

private String phone;

public String getFname() {

return fname; }

public void setFname(String fname) {

this.fname = fname; }

public String getLname() {

return lname; }

public void setLname(String lname) {

this.lname = lname; }

public String getSex() {

return sex; }

public void setSex(String sex) {

this.sex = sex; }

public Date getBirthdate() {

return birthdate; }

public void setBirthdate(Date birthdate) {

(22)

public String getAddress() {

return address; }

public void setAddress(String address) {

this.address = address; }

public String getCity() {

return city; }

public void setCity(String city) {

this.city = city; }

public String getCountry() {

return country; }

public void setCountry(String country) {

this.country = country; }

public String getEmail() {

return email; }

public void setEmail(String email) {

this.email = email; }

public String getPhone() {

return phone; }

public void setPhone(String phone) {

this.phone = phone; }

}

4.3.2

Buat class PersonDao.java di package org.blueoxygen.dao

package org.blueoxygen.dao;

import java.util.List;

import org.blueoxygen.cimande.commons.LogInformation;

import org.blueoxygen.cimande.persistence.hibernate.dao.HibernatePersistenceDaoManager;

import org.blueoxygen.cimande.security.User;

import org.blueoxygen.entity.Person;

import org.hibernate.Criteria;

import org.hibernate.criterion.MatchMode;

import org.hibernate.criterion.Projections;

import org.hibernate.criterion.Restrictions;

import org.springframework.stereotype.Repository;

/**

(23)

@Repository

public class PersonDao extends HibernatePersistenceDaoManager<Person> {

public void savePerson(Person person) {

if (person == null)

return;

if (person.getId() == null) { createPerson(person);

} else if (person.getId().trim().equalsIgnoreCase("")) { createPerson(person);

} else {

person.getLogInformation() .setLastUpdateBy(getCurrentUser().getId()); person.getLogInformation().setLastUpdateDate(getCurretTime()); merge(person); } }

public long getPersonCountByCriteria(String fname, String lname) { Criteria criteria = getPersonCriteria(fname, lname); criteria.setProjection(Projections.rowCount());

return new Long(criteria.uniqueResult() + ""); }

@SuppressWarnings("unchecked")

public List<Person> getPersonByCriteria(String fname, String lname,

int limit, int page) {

return getPersonCriteria(fname, lname).setMaxResults(limit) .setFirstResult((page - 1) * limit).list(); }

private Criteria getPersonCriteria(String fname, String lname) {

Criteria criteria = sessionFactory.getCurrentSession().createCriteria( Person.class);

criteria.add(Restrictions.like("fname", fname, MatchMode.ANYWHERE)); criteria.add(Restrictions.like("lname", lname, MatchMode.ANYWHERE));

return criteria; }

private void createPerson(Person person) { User user = getCurrentUser();

LogInformation logInformation = new LogInformation(); logInformation.setCreateBy(user.getId());

logInformation.setCreateDate(getCurretTime()); logInformation.setLastUpdateBy(user.getId()); logInformation.setLastUpdateDate(getCurretTime()); person.setId(null);

person.setLogInformation(logInformation); persist(person);

(24)

4.3.3

Buat class PersonService.java di package org.blueoxygen.service

package org.blueoxygen.service;

/**

*/

public interface PersonService {

void savePerson(Person person);

void deletePerson(Person person); Person getPersonById(String id);

long getPersonCount(String fname, String lname);

List<Person> getPersonList(String fname, String lname, int limit, int page); }

4.3.4

Buat class PersonServiceImpl.java di package org.blueoxygen.service.impl

package org.blueoxygen.service.impl;

import org.blueoxygen.dao.PersonDao;

import org.blueoxygen.service.PersonService;

import org.springframework.beans.factory.annotation.Autowired;

import org.springframework.stereotype.Service;

import org.springframework.transaction.annotation.Transactional;

/**

*/

@Service

@Transactional(readOnly = true)

public class PersonServiceImpl implements PersonService {

@Autowired

private PersonDao personDao;

@Transactional

public void savePerson(Person person) {

personDao.savePerson(person); }

@Transactional

public void deletePerson(Person person) {

personDao.remove(person); }

public Person getPersonById(String id) {

(25)

public long getPersonCount(String fname, String lname) {

return personDao.getPersonCountByCriteria(fname, lname); }

@Override

public List<Person> getPersonList(String fname, String lname, int limit,

int page) {

return personDao.getPersonByCriteria(fname, lname, limit, page); }

}

4.3.5

Buat class PersonController.java di package org.blueoxygen.controller

package org.blueoxygen.controller;

import java.text.ParseException;

import java.text.SimpleDateFormat;

import javax.swing.JOptionPane;

import org.blueoxygen.cimande.commons.CimandeModuleAction;

import org.blueoxygen.service.PersonService;

import org.springframework.beans.factory.annotation.Autowired;

import com.opensymphony.xwork2.validator.annotations.RequiredStringValidator;

import com.opensymphony.xwork2.validator.annotations.Validations;

public class PersonController extends CimandeModuleAction {

@Autowired

private PersonService personService;

private Person person = new Person();

private int limit = 0;

private int page = 0;

SimpleDateFormat df = new SimpleDateFormat("dd-MM-yy");

public PersonController() {

model.put("person", person); }

// POST /module/person/create // POST /module/person/create/{id}

@Validations(requiredStrings = {

@RequiredStringValidator(fieldName = "person.fname", message = "First Name cannot be empty", trim = true),

@RequiredStringValidator(fieldName = "person.lname", message = "Last Name cannot be empty", trim = true) })

public String personPost() {

try {

person.setBirthdate(df.parse(model.get("birthdate").toString())); } catch (ParseException e) {

// TODO Auto-generated catch block

e.printStackTrace(); }

personService.savePerson(person);

(26)

// GET /module/person/create // GET /module/person/edit/{id} public String personGet() {

model.put("person", personService.getPersonById(person.getId() + ""));

// model.put("itemCategorys", itemCategoryService.getAllItemCategory()); return INPUT;

}

// DELETE /module/person/edit/{id} public String personDelete() {

personService.deletePerson(personService.getPersonById(person.getId()));

return SUCCESS; }

// POST/GET /module/person/filter public String filter() {

try {

limit = model.get("rows") == null ? 0 : new Integer(model.get(

"rows").toString());

page = model.get("page") == null ? 0 : new Integer(model

.get("page").toString()); } catch (NumberFormatException e) {

e.printStackTrace(); }

if (limit == 0 && page == 0) {

limit = 10;

page = 1; }

model.put("rows", limit);

model.put("page", page);

int count = (int) personService.getPersonCount("", "");

int total = count / limit;

if (total % limit > 0) total++; System.out.println();

model.put("persons", personService.getPersonList("", "", limit, page));

if (total == 0) total++;

model.put("total", total);

model.put("records", total);

return SUCCESS; }

(27)

4.4 Pembuatan View atau Tampilan

Pembuatan kode untuk view atau tampilan di simpan di dalam package

src/main/resources/module/template/person

4.4.1Buat view

person-create.vm

<html>

<head>

#sjhead("ajaxcache=true" "jquerytheme=lightness" "loadFromGoogle=false"

"jqueryui=true") #shead

</head> <body>

<tr>

#stextfield("name=person.fname" "size=25" "label=First Name")

</tr> <tr>

#stextfield("name=person.lname" "size=25" "label=Last Name")

</tr> <tr>

<input type="radio" name="person.sex" value="Male" checked="checked" /> Male    

<input type="radio" name="person.sex" value="Female" /> Female

</td> </tr>

<tr>

<td>BirthDate</td> <td>

#sjdatepicker("name=person.birthdate" "showOn=both" "changeMonth=true"

"changeYear=true" "displayFormat=dd-mm-yy" "buttonImageOnly=true" ) #end </td> </tr> <tr> <td><label for="person.address" class="label">Address </label></td> <td><textarea rows="3"

(28)

<tr>

#stextfield("name=person.city" "size=25" "label=City") </tr> <tr> <td> Country:</td> <td> <select name="person.country.id"> #foreach($c in $personCountries)

<option value="$!c.id" #if($c.id == $!person.country.id)selected #end> $!c.countryname </option> #end </tr> <tr>

#stextfield("name=person.email" "size=25" "label=Email")

</tr> <tr>

#stextfield("name=person.phone" "size=25" "label=Phone")

</tr> <tr>

<input type="submit" value="Save"> <input type="hidden"

name="person.id" value="$!person.id" />

</td> </tr> </table> </form> </body> </html>

4.4.2 Buat view person-grid-list.vm

<html>

<head>

<td colspan="10" width="100%" height="10%" align="right" bgcolor="#2554C7"><font color="white" size="8">Result Person</font></td>

(29)

</tr> <tr>

#foreach($a in $persons) <tr>

<td>$!a.fname $!a.lname</td> <td>$!a.sex</td> <td>$!a.birthdate</td> <td>$!a.address</td> <td>$!a.city</td> <td>$!a.country</td> <td>$!a.email</td> <td>$!a.phone</td> <td> <a href="edit.action?person.id=$a.id"> <img src="../../images/silk/page_edit.png" border="0" title="Edit"> </a> <a href="delete.action?person.id=$a.id">

<tr>

</tr> </table> </body>

</html>

4.5 Pembuatan Alur Data Aplikasi

4.5.1

Hibernate Mapping

Hibernate adalah perangkat untuk memudahkan akses ke database. Hibernate

menangani koneksi database dari aplikasi Java ke database server. Hibernate juga

dapat membuat tabel otomatis di database, jadi semua Entity yang ada harus

dimasukkan ke dalam file konfigurasi Hibernate

Masukkan Entity Person.java ke di package

(30)

<?xml version='1.0' encoding='utf-8'?> <!DOCTYPE hibernate-configuration PUBLIC

"-//Hibernate/Hibernate Configuration DTD 3.0//EN"

"http://hibernate.sourceforge.net/hibernate-configuration-3.0.dtd">

<hibernate-configuration> <session-factory>

</hibernate-configuration>

4.5.2

Membuat alur data di src/main/resources/cimande-struts-example.xml

<?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE struts PUBLIC

"-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"

"http://struts.apache.org/dtds/struts-2.0.dtd"> <struts>

/module/template/person/person-create.vm

</result>

/module/template/person/person-grid-list.vm

</result> </action>

filter/${limit}/${page}

</result>

/module/template/person/person-grid-list.vm

</result> </action>

/module/template/person/person-create.vm

</result>

/module/person/filter

</result> </action>

filter

</result> </action>

(31)

4.6 Cimande BackEnd

Buka web browser dan ketikan url http://localhost:8181/person/ . Kemudian login

dengan username : admin, password : blueoxygen untuk membuat module, user manager,

beserta securitynya

Ada beberapa hal yang perlu diperhatikan di dalam Cimande BackEnd, diantaranya

adalah :

• Site Manager

- Descriptor Manager : Descriptor

- Module Manager : Module Function

Role Manager

Role Privilage

Role Site Privilage

- Multi Site : Site

- User Management : Company

Job Position

User Manager

(32)

4.6.1

Descriptor Manager

Descriptor digunakan untuk otomatisasi action new dan search yang akan

dieksekusi berdasarkan namespace yang di deklarasikan dalam

cimande-struts-example.xml

Membuat Descriptor Person :

1. Name : person

(33)

4.6.2

Module Function

Module Function digunakan untuk membuat Menu Dinamis. Menu utama

menggunakan thread master id “master” sedangkan submenu menggunakan

thread master id menu utama / menu diatasnya. Jika dikehendaki sebuah menu

mengeksekusi sebuah action new / search, maka tambahkan descriptor

berdasarkan descriptor yang dibuat

Membuat Module Function Person :

1. Name : md_person

2. Description : Person

3. Thread Master Id : Master

(34)

4.6.3

Site

Digunakan untuk membuat site yang nantinya digunakan untuk memisahkan

site masing – masing role yang dibuat

Membuat Site Person :

1. Name : person_site

2. Description : Person Site

(35)

4.6.4

WF Role

Digunakan untuk membuat role yang bertujuan untuk membedakan hak akses

dari masing – masing user yang diregistrasikan di dalam framework cimande

Membuat Role Person :

1. Name : person

2. Description : Person

(36)

4.6.5 Role Manager

Digunakan untuk menentukan site dari role yang telah dibuat. Hal ini bertujuan

untuk memisahkan dan memilah menu yang tersedia untuk masing – masing

role yang berbeda

Membuat Role Manager Person :

Masuk ke dalam module function person yang ada di role manager, kemudian

(37)

(38)

4.6.5

Role Privilage

Digunakan untuk menentukan menu yang disediakan untuk role terpilih

berdasarkan Module Function yang telah dibuat

Membuat Role Privilage Person :

Masuk ke dalam module function person yang ada di role privilage, kemudian

(39)

4.6.6

Role Site Privilage

Digunakan untuk menentukan atau menambahkan menu (module function)

berdasarkan role privilage yang telah dibentuk merujuk pada site sesuai dengan

role

Membuat Role Site Privilage Person :

Masuk ke dalam module function person dan site person yang ada di role site

privilage, kemudian tambahkan module function md_person dengan cara tekan

(40)

(41)

4.6.7

User Manager

Digunakan untuk registrasi user ke dalam framework cimande . Registrasi ini

digunakan untuk user yang berkepentingan di dalam aplikasi yang akan

dibentuk menggunakan framework cimande.

Membuat User Manager Person :

1. Login : person

2. Password : person

3. Confirm Password : person

4. First Name : Person

5. Company : Blueoxygen Tech

6. Position : Manager

(42)

4.7 Cimande CRUD

Setelah membuat Cimande BackEnd, logout dan login kembali dengan username:

person, password : person

4.7.1

CREATE

(43)

(44)

4.7.2

READ

Jika button save ditekan, maka data yang telah di inputkan akan di tampilkan

4.7.3

UPDATE

(45)

4.7.4 DELETE

(46)

4.7.5 SEARCH

Pilih menu Search untuk mencari data yang pernah di inputkan

4.7 Koneksi Jejaring Sosial

Cimande 2.0 juga mendukung koneksi ke beberapa jejaring sosial seperti Facebook

dan Twitter. Untuk login ke Cimande melalui jejaring sosial, tekan icon Facebook dan Twitter

(47)

4.7.1 Koneksi Facebook

Ketika icon Facebook diklik, maka anda akan terkoneksi dengan Facebook yang

meminta untuk Request for Permission . Dan ketika button Allow ditekan akan

(48)

(49)

4.7.2 Koneksi Twitter

Untuk koneksi ke Twitter, klik icon Twitter pada form login sehingga tampil

seperti gambar dibawah ini. Jika button Authorize app ditekan, akan tampil