BAB III PERANCANGAN SISTEM 3.1. Gambaran Sistem Aplikasi … · 2017. 2. 3. · BAB III . PERANCANGAN SISTEM . Pada bab ini akan dijelaskan perancangan aplikasi dimulai dengan kebutuhan

BAB III

PERANCANGAN SISTEM

Pada bab ini akan dijelaskan perancangan aplikasi dimulai dengan kebutuhan

fungsional sistem, desain arsitektur dari sistem, perancangan database, perancangan

aplikasi web server, dan perancangan aplikasi mobile.

3.1. Gambaran Sistem

Pada sistem yang dibuat ini terbagi menjadi dua yaitu aplikasi mobile dan aplikasi

web server. Aplikasi mobile digunakan oleh pengguna bertipe dosen dan mahasiswa,

sedangkan aplikasi web server digunakan oleh pengguna bertipe administrator. Aplikasi

mobile dijalankan menggunakan smartphone Android, sedangkan aplikasi web server

diakses dengan menggunakan Chrome web browser.

3.1.1 Aplikasi Mobile

Dalam aplikasi mobile terdapat dua pengguna yaitu dosen dan mahasiswa. Pengguna

bertipe mahasiswa dapat memiliki hak sebagai asisten dosen yang diatur di dalam aplikasi

web server. Semua pengguna dapat melihat semua materi yang ada. Pengguna bertipe

dosen dan mahasiswa yang memiliki hak asisten dosen dapat membuat materi, perintah

tugas, dan pengumuman yang berkaitan dengan kegiatan belajar mengajar. Pengguna

bertipe mahasiswa hanya dapat melihat pengumuman dan tugas berdasarkan matakuliah

yang diambil yang diambil oleh mahasiswa tersebut. Use case untuk dosen menggunakan

aplikasi mobile dapat dilihat pada Gambar 3.1 dan use case untuk mahasiswa dapat dilihat

pada Gambar 3.2a dan Gambar 3.2b.

Gambar 3.1 Use Case Dosen Aplikasi Mobile

Penjelasannya adalah sebagai berikut:

1. Melihat Semua Materi, Pengumuman dan Tugas

Pengguna dapat melihat materi, pengumuman dan tugas di semua kategori

matakuliah.

2. Membuat dan Mengelola Materi, Surat Tugas, Pengumuman yang dibuat

Pengguna dapat membuat materi, tugas, dan pengumuman di semua kategori

matakuliah serta dapat mengubah isi maupun menghapus yang telah dibuat oleh

pengguna.

3. Melihat Mahasiswa yang telah Mengirim Tugas

Pengguna dapat melihat daftar mahasiswa yang telah mengirimkan tugasnya.

Gambar 3.2a Use Case Mahasiswa dengan Hak Asisten Aplikasi Mobile


1. Melihat Semua Materi

Pengguna dapat melihat materi di semua kategori matakuliah.

2. Mengirim Tugas berdasarkan Matakuliah yang Diambil

Pengguna dapat mengirimkan tugas apabila perintah tugas bertipe submit atau

mahasiswa diminta untuk mengumpulkan tugas tersebut.




pengguna.

4. Melihat Mahasiswa yang telah Mengirim Tugas

Pengguna dapat melihat daftar mahasiswa yang telah mengirimkan tugasnya..

5. Melihat Perintah Tugas dan Pengumuman berdasarkan Matakuliah yang

Diambil

Pengguna hanya dapat melihat perintah tugas dan pengumuman berdasarkan

matakuliah yang diambil oleh pengguna.

Gambar 3.2b Use Case Mahasiswa tanpa Hak Asisten Aplikasi Mobile




2. Melihat Perintah Tugas dan Pengumuman berdasarkan Matakuliah yang diambil



3. Mengirim Tugas berdasarkan Matakuliah yang diambil



Dari ketiga use case dalam aplikasi mobile terdapat hubungan dua arah antara dosen

dengan mahasiswa ataupun asisten dengan mahasiswa. Seorang dosen ataupun seorang

asisten dosen dapat membuat perintah tugas yang disertai batas waktu pengumpulan tugas.

Mahasiswa yang menerima tugas ini dapat melakukan pengumpulan dengan menggunakan

aplikasi mobile sebelum batas waktu yang telah ditentukan sebelumnya. Pengumpulan

setiap tugas hanya dapat dilakukan sekali saja oleh seorang mahasiswa, oleh karena itu

mahasiswa harus berhati-hati dalam hal ini agar tidak salah saat mengumpulkan tugasnya.

Oleh karena aplikasi mobile lebih dikhususkan sebagai media informasi, maka pembuat

perintah tugas hanya dapat melihat daftar mahasiswa yang telah mengumpulkan tugas.

Gaftar alir aplikasi mobile learning dapat dilihat pada Gambar 3.3. Penjelasan gaftar

alir aplikasi mobile learning sebagai berikut:

1. Ketika aplikasi mobile dibuka maka aplikasi akan mengecek apakah session pengguna

tersimpan atau tidak. Jika session pengguna tersimpan maka aplikasi akan menuju ke

halaman utama, namun jika tidak tersimpan session pengguna maka aplikasi akan

menampilkan form login dimana pengguna harus melakukan autentikasi diri. Jika

autentikasi berhasil maka session baru akan dibuat dan aplikasi akan menuju halaman

utama.

2. Pada halaman utama terdapat tiga bagian besar yaitu konten utama, drawer layout, dan

quick button. Konten utama akan menampilkan halaman berdasarkan menu yang

dipilih oleh pengguna di drawer layout. Saat pertama kali pengguna masuk halaman

utama maka menu thread yang dipilih secara otomatis. Bagian kedua adalah drawer

layout, dalam drawer layout ini terdapat lima menu yang bisa dipilih yaitu menu

thread, menu task, menu news, menu my profile dan menu logout. Bagian ketiga

adalah quick button, bagian ini terdapat tiga button yaitu create thread, create task,

create news.

3. Saat pengguna memilih menu thread maka konten utama akan menampilkan daftar

ulasan singkat materi dengan urutan teratas adalah materi yang terbaru dipublikasikan.

Pengguna dapat mengetahui lebih detil isi materi tersebut dengan menyentuh pada

bagian materi yang dikehendakinya.

4. Saat pengguna memilih menu task maka konten utama akan menampilkan daftar tugas

dengan urutan teratas adalah tugas yang terbaru dipublikasikan. Pengguna dapat

mengetahui lebih detil isi tugas tersebut dengan menyentuh pada bagian tugas yang

dikehendakinya.

5. Saat pengguna memilih menu news maka konten utama akan menampilkan daftar

pengumuman dengan urutan teratas adalah pengumuman yang terbaru dipublikasikan.

6. Saat pengguna memilih menu my profile maka konten utama akan menampilkan

halaman yang berisi menu change password untuk mengganti password pengguna,

menu my post untuk mengelola materi yang dibuat oleh pengguna, menu my news

untuk mengelola pengumuman yang dibuat oleh pengguna, menu my task untuk

mengelola perintah tugas yang dibuat oleh pengguna dan melihat siapa saja yang sudah

mengirimkan tugas tersebut, menu my draft untuk mengelola materi yang belum

sempat dipublikasikan oleh pengguna.

7. Saat pengguna memilih quick button create thread maka aplikasi akan mengecek

terlebih dahulu apakah pengguna memiliki akses atau tidak untuk membuat materi

baru. Apabila aplikasi mendapati pengguna memiliki akses maka halaman akan

berpindah ke halaman form membuat materi baru. Jika tidak memiliki akses maka akan

muncul pesan yang memberi tahu pengguna bahwa pengguna tidak memiliki akses.

Apabila pengguna belum menyelesaikan materi yang sedang dibuatnya maka aplikasi

akan menyimpan langkah demi langkah yang telah dibuat pengguna sebelumnya dan

dapat melanjutkannya dengan masuk ke menu my draft pada menu my profile di

drawer layout.

8. Saat pengguna memilih quick button create task maka aplikasi akan mengecek terlebih

dahulu apakah pengguna memiliki akses atau tidak untuk membuat tugas baru. Apabila

aplikasi mendapati pengguna memiliki akses maka halaman akan berpindah ke

halaman form membuat tugas baru. Jika tidak memiliki akses maka akan muncul pesan

yang memberi tahu pengguna bahwa pengguna tidak memiliki akses.

9. Saat pengguna memilih quick button create news maka aplikasi akan mengecek

terlebih dahulu apakah pengguna memiliki akses atau tidak untuk membuat

pengumuman baru. Apabila aplikasi mendapati pengguna memiliki akses maka

halaman akan berpindah ke halaman form membuat pengumuman baru. Jika tidak

memiliki akses maka akan muncul pesan yang memberi tahu pengguna bahwa

pengguna tidak memiliki akses.

10. Saat pengguna memilih menu logout maka aplikasi akan menghapus data session

pengguna dan kemudian halaman menuju halaman login.

Mulai

Session

tersimpan?

Halaman List

Materi

Ya

Halaman Login

Tidak

Verifikasi Login Login Sukses?

YaTidak

User memilih menu

materi?

Halaman Detil

Materi

User memilih menu

Pengumuman?

Tidak

Halaman List

PengumumanYa

User memilih menu

Tugas?

Tidak

Halaman List

TugasYa

User memilih button

Create Materi

User memiliki

akses?

Ya

Form Tambah

Materi

Ya

Materi selesai

dibuat?

Halaman

Preview

Publikasikan

Materi?

Simpan di

database

tabel thread

Ya

User memilih button

Create Task

User

memiliki

akses?

Ya Form Tambah

Tugas

User memilih button

Create News

User

memiliki

akses?

Ya Form Create

PengumumanYa

User memilih menu

My Profile

Tidak

Halaman My

ProfileYa

User memilih button

My Post

Tampilkan List

My MateriYa

KelolaUser memilih My

News

Tidak

Tampilkan List

My NewsYa

User memilih My

Task

Tidak

Tampilkan List

My TaskYa

Lihat Pengirim

Tugas?

Tidak

Selesai

Ya

User memilih

salah satu

materi?

YaYa

Tidak

Tidak

Tidak

Ya

Halaman Detil

Materi

User memilih

salah satu

Tugas?

Ya

Tidak

Sign Out?

Tidak

Ya

Tidak

Tidak

Simpan di

database tabel

draftTidak

User memilih My

Draft

Tidak

Tampilkan

List My Draft

Tidak

Ya

Tampilkan List

Pengirim

Tugas

Ya

Tidak

Tidak

Tidak

Tidak

Gambar 3.3 Gaftar Alir Aplikasi Mobile Learning

3.1.2 Aplikasi Web Server

Dalam aplikasi web server terdiri dari dua bagian yaitu aplikasi administrator dan

aplikasi e-learning. Aplikasi administrator lebih fokus menangani manajemen data - data

yang akan mengalami perubahan secara berkala maupun dalam kondisi mendesak. Data -

data yang ditangani di aplikasi ini seperti data dosen, data mahasiswa, data matakuliah, data

registrasi matakuliah, dan data kegiatan belajar mengajar. Use case untuk administrator

menggunakan aplikasi web server dapat dilihat pada Gambar 3.4.

.

Gambar 3.4 Use Case Administrator


1. Import Data Perkuliahan

Administrator dapat mengimpor data - data yang berhubungan dengan

perkuliahan agar memudahkan penambahan data dalam jumlah besar.

2. Manajemen Data Perkuliahan

Administrator dapat memanajemen data meliputi melihat data, memasukkan

data baru, melakukan perubahan data, atau menghapus data.

Gaftar alir aplikasi administrator dapat dilihat pada gambar 3.5.

Mulai Halaman Login Verifikasi AdminVerifikasi

berhasil?

Selesai

Menu UtamaPilih menu

Pengajar?

Pilih menu

Mahasiswa?

Tidak

Menu Manajemen

PengajarYa

Menu Manajemen

MahasiswaYa

Pilih menu

Matakuliah?

Tidak

Menu Manajemen

MahasiswaYa

Pilih menu

RMK?

Tidak

Menu Manajemen

MahasiswaYa

Ya

Sign Out?Tidak Ya

Tidak

Tidak

Gambar 3.5 Gaftar Alir Aplikasi Administrator


1. Ketika aplikasi web server dibuka maka akan ditampilkan halaman sign in

dimana administrator harus melakukan autentikasi diri. Jika autentikasi berhasil

maka administrator dapat masuk ke menu aplikasi. Jika tidak tetap pada halaman

sign in dengan pesan autentikasi tidak berhasil.

2. Pada halaman menu utama terdapat empat menu utama yaitu pengajar untuk

masuk pada manajemen data pengajar, mahasiswa untuk masuk pada manajemen

data mahasiswa, matakuliah untuk masuk pada manajemen data matakuliah dan

RMK untuk masuk pada manajemen data registrasi matakuliah. Selain itu

terdapat pilihan sign out untuk keluar dari aplikasi.

3. Jika administrator memilih menu pengajar maka akan masuk pada halaman

menu manajemen pengajar dimana admin dapat melakukan aksi menambah,

melakukan perubahan, menghapus, atau melakukan pencarian data pengajar. Jika

tidak maka tetap pada halaman menu utama.

4. Jika administrator memilih menu mahasiswa maka akan masuk pada halaman

menu manajemen mahasiswa dimana administrator dapat melakukan aksi

menambah, melakukan perubahan, menghapus, atau melakukan pencarian data

mahasiswa. Jika tidak maka tetap pada halaman menu utama.

5. Jika administrator memilih menu matakuliah maka akan masuk pada halaman

menu manajemen matakuliah dimana administrator dapat melakukan aksi

menambah, melakukan perubahan, menghapus, atau melakukan pencarian data

matakuliah. Jika tidak maka tetap pada halaman menu utama.

6. Jika administrator memilih menu RMK maka akan masuk pada halaman menu

manajemen registrasi matakuliah dimana admin dapat melakukan aksi import

data registrasi matakuliah. Jika tidak maka tetap pada halaman menu utama.

7. Jika administrator memilih untuk sign out maka akan keluar dari aplikasi. Jika

tidak maka tetap pada halaman menu utama.

Aplikasi e-learning memiliki fungsi yang hampir sama dengan aplikasi mobile

learning. Dengan adanya aplikasi e-learning akan membantu memudahkan proses belajar

mengajar apabila tidak memungkinkan atau menjadi tidak praktis jika menggunakan

aplikasi mobile. Use case untuk pengguna menggunakan aplikasi e-learning dapat dilihat

pada Gambar 3.6 dan Gambar 3.7.

Gambar 3.6 Use Case Dosen Aplikasi Web Server


1. Melihat Semua Materi, Pengumuman dan Tugas

Pengguna dapat melihat materi, pengumuman dan tugas di semua kategori

matakuliah.




pengguna.

3. Mengunduh Tugas yang Dikirimkan Mahasiswa

Pengguna dapat mengunduh dokumen yang telah dikirimkan mahasiswa sebagai

tanda telah melakukan perintah tugas yang dibuat oleh pengguna.

Gambar 3.7a Use Case Mahasiswa dengan Hak Asisten Aplikasi Web Server




2. Mengirim Tugas berdasarkan Matakuliah yang Diambil






pengguna.

4. Mengunduh Tugas yang Dikirimkan Mahasiswa

Pengguna dapat mengunduh dokumen yang telah dikirimkan mahasiswa sebagai

tanda telah melakukan perintah tugas yang dibuat oleh pengguna.

5. Melihat Perintah Tugas dan Pengumuman berdasarkan Matakuliah yang

Diambil



Gambar 3.7b Use Case Mahasiswa tanpa Hak Asisten Aplikasi Web Server




2. Melihat Perintah Tugas dan Pengumuman berdasarkan Matakuliah yang diambil



3. Mengirim Tugas berdasarkan Matakuliah yang diambil



Gaftar alir aplikasi web e-learning dapat dilihat pada gambar 3.8.

Mulai

Session

tersimpan?

Halaman List

Materi

Ya

Halaman Login

Tidak

Verifikasi Login Login Sukses?

YaTidak

User memilih menu

materi?

Halaman Detil

Materi

User memilih menu

Pengumuman?

Tidak

Halaman List

PengumumanYa

User memilih menu

Tugas?

Tidak

Halaman List

TugasYa

User memilih button

Create Materi

User memiliki

akses?

Ya

Form Tambah

Materi

Ya

Materi selesai

dibuat?

Halaman

Preview

Publikasikan

Materi?

Simpan di

database

tabel thread

Ya

User memilih button

Create Task

User

memiliki

akses?

Ya Form Tambah

Tugas

User memilih button

Create News

User

memiliki

akses?

Ya Form Create

PengumumanYa

User memilih menu

My Profile

Tidak

Halaman My

ProfileYa

User memilih button

My Post

Tampilkan List

My MateriYa

KelolaUser memilih My

News

Tidak

Tampilkan List

My NewsYa

User memilih My

Task

Tidak

Tampilkan List

My TaskYa

Lihat Pengirim

Tugas?

Tidak

Selesai

Ya

User memilih

salah satu

materi?

YaYa

Tidak

Tidak

Tidak

Ya

Halaman Detil

Materi

User memilih

salah satu

Tugas?

Ya

Tidak

Sign Out?

Tidak

Ya

Tidak

Tidak

Simpan di

database tabel

draftTidak

User memilih My

Draft

Tidak

Tampilkan

List My Draft

Tidak

Ya

Tampilkan List

Pengirim

Tugas

Ya

Unduh File

Tugas?

Tidak

Unduh FileYa

Tidak

Tidak

Tidak

Tidak

Gambar 3.8 Gaftar Alir Aplikasi Web E-learning

Penjelasan gaftar alir aplikasi e-learning sebagai berikut:

1. Ketika aplikasi mobile dibuka maka aplikasi akan mengecek apakah session

pengguna tersimpan atau tidak. Jika session pengguna tersimpan maka aplikasi

akan menuju ke halaman utama, namun jika tidak tersimpan session pengguna

maka aplikasi akan menampilkan form login dimana pengguna harus melakukan

autentikasi diri. Jika autentikasi berhasil maka session baru akan dibuat dan

aplikasi akan menuju halaman utama.

2. Pada halaman utama terdapat tiga bagian besar yaitu konten utama, drawer

layout, dan quick button. Konten utama akan menampilkan halaman

berdasarkan menu yang dipilih oleh pengguna di drawer layout. Saat pertama

kali pengguna masuk halaman utama maka menu thread yang dipilih secara

otomatis. Bagian kedua adalah drawer layout, dalam drawer layout ini terdapat

lima menu yang bisa dipilih yaitu menu thread, menu task, menu news, menu

my profile dan menu logout. Bagian ketiga adalah quick button, bagian ini

terdapat tiga button yaitu create thread, create task, create news.

3. Saat pengguna memilih menu thread maka konten utama akan menampilkan

daftar ulasan singkat materi dengan urutan teratas adalah materi yang terbaru

dipublikasikan. Pengguna dapat mengetahui lebih detil isi materi tersebut

dengan menyentuh pada bagian materi yang dikehendakinya.

4. Saat pengguna memilih menu task maka konten utama akan menampilkan daftar

tugas dengan urutan teratas adalah tugas yang terbaru dipublikasikan. Pengguna

dapat mengetahui lebih detil isi tugas tersebut dengan menyentuh pada bagian

tugas yang dikehendakinya.

5. Saat pengguna memilih menu news maka konten utama akan menampilkan

daftar pengumuman dengan urutan teratas adalah pengumuman yang terbaru

dipublikasikan.

6. Saat pengguna memilih menu my profile maka konten utama akan menampilkan

halaman yang berisi menu change password untuk mengganti password

pengguna, menu my post untuk mengelola materi yang dibuat oleh pengguna,

menu my news untuk mengelola pengumuman yang dibuat oleh pengguna, menu

my task untuk mengelola perintah tugas yang dibuat oleh pengguna dan melihat

siapa saja yang sudah mengirimkan tugas tersebut serta mengunduh file tugas

tersebut, menu my draft untuk mengelola materi yang belum sempat

dipublikasikan oleh pengguna.

7. Saat pengguna memilih quick button create thread maka aplikasi akan

mengecek terlebih dahulu apakah pengguna memiliki akses atau tidak untuk

membuat materi baru. Apabila aplikasi mendapati pengguna memiliki akses

maka halaman akan berpindah ke halaman form membuat materi baru. Jika

tidak memiliki akses maka akan muncul pesan yang memberi tahu pengguna

bahwa pengguna tidak memiliki akses. Apabila pengguna belum menyelesaikan

materi yang sedang dibuatnya maka aplikasi akan menyimpan langkah demi

langkah yang telah dibuat pengguna sebelumnya dan dapat melanjutkannya

dengan masuk ke menu my draft pada menu my profile di drawer layout.

8. Saat pengguna memilih quick button create task maka aplikasi akan mengecek


tugas baru. Apabila aplikasi mendapati pengguna memiliki akses maka halaman

akan berpindah ke halaman form membuat tugas baru. Jika tidak memiliki akses

maka akan muncul pesan yang memberi tahu pengguna bahwa pengguna tidak

memiliki akses.

9. Saat pengguna memilih quick button create news maka aplikasi akan mengecek


pengumuman baru. Apabila aplikasi mendapati pengguna memiliki akses maka

halaman akan berpindah ke halaman form membuat pengumuman baru. Jika

tidak memiliki akses maka akan muncul pesan yang memberi tahu pengguna

bahwa pengguna tidak memiliki akses.

10. Saat pengguna memilih menu logout maka aplikasi akan menghapus data

session pengguna dan kemudian halaman menuju halaman login.

DA

TA

QU

ER

Y

JSON

3.2. Desain Arsitektur Sistem

Sistem yang dibangun terdiri dari aplikasi mobile sebagai client untuk menampilkan

informasi seperti data produk dan aplikasi web server yang menyediakan informasi ke

client. Arsitektur dari sistem dapat dilihat pada gambar 3.9.

Gambar 3.9 Bagan Arsitektur Sistem

Penjelasan dari arsitektur adalah sebagai berikut:

1. Web Server

Aplikasi ini bertugas mengatur data pengguna, materi, pengumuman, dan lain

sebagainya dimana data tersebut disimpan dalam database server. Selain itu

aplikasi ini bertugas juga sebagai server web service untuk menerima permintaan

dari client melalui HTTP POST atau HTTP GET untuk diolah dan mengirimkan

hasilnya kembali ke client dalam format JSON.

2. Database Server

Database server bertugas sebagai media penyimpanan data pengguna, materi,

pengumuman, dan lain sebagainya.

3. Aplikasi Mobile

Aplikasi mobile adalah aplikasi client yang digunakan oleh pengguna untuk

menampilkan informasi. Data dan informasi mengenai materi, tugas,

pengumuman dan lain sebagainya didapat dari web server.

HT

TP

PO

ST

/GE

T

Internet

JS

ON

HTTP POST/GET

Komputer

Server

Database

Server Aplikasi

Mobile

3.3. Perancangan Database

Database yang digunakan pada aplikasi web server adalah MySQL. Entity

Relationship Diagram (ERD) pada database server ditunjukkan pada Gambar 3.10 dan

Enhanced Entity Relationship Diagram ditunjukkan pada Gambar 3.11.

Gambar 3.10 Entity Relationship Diagram Database Server

Gambar 3.11 Enhanced Entity Relationship Diagram Database Server

Tabel pada database yaitu tabel Administrator, User, TypeUser, Category,

Thread, ThreadContent, Draft, DraftContent, Task, TaskSubmit, News, KBM

dan RegMakul. Tabel Administrator digunakan untuk menyimpan informasi

administrator. Tabel User digunakan untuk menyimpan informasi pengguna client. Tabel

TypeUser digunakan untuk informasi macam - macam tipe pengguna client. Tabel

Category digunakan untuk menyimpan informasi matakuliah. Tabel Thread digunakan

untuk menyimpan data materi utama dan berhubungan langsung dengan tabel

ThreadContent yang menyimpan langkah - langkah dari materi itu sendiri. Tabel Draft

digunakan untuk menyimpan data materi yang belum dipublikasikan atau belum selesai

dibuat dan berhubungan langsung dengan tabel DraftContent yang menyimpan langkah

– langkah dari draft itu sendiri. Tabel Task digunakan untuk menyimpan informasi

perintah tugas, sedangkan tabel TaskSubmit digunakan untuk menyimpan informasi

submit tugas. Tabel News digunakan untuk menyimpan informasi pengumuman, tabel KBM

digunakan untuk menyimpan informasi kegiatan belajar mengajar di kelas dan tabel

RegMakul yang berisi informasi registrasi matakuliah mahasiswa. Attribute masing-masing

tabel dapat dilihat pada Tabel 3.1.

Tabel 3.1. Tabel Atribut Database Server

TABLE

NAME

ATTRIBUTE

NAME

CONTENTS TYPE FORMAT REQUIRED PK/FK FK

REFERENCE

TABLE

Administrat

or

idAdministrator Administrator

number

int(10) Yes PK

userid Administrator id varchar(45) Yes

password Password

Administrator

varchar(45) Yes

nameAdministrat

or

Nama

Administrator

varchar(45) Yes

TypeUser idTypeUser tipe user id int(10) Yes PK

nameTypeUser nama tipe user varchar(45) Yes

User idUser id pengguna int(10) Yes PK

Email email pengguna varchar(75) Yes

Password password

pengguna

varchar(45) Yes

nameUser nama pengguna varchar(45) Yes

noInduk nomor Induk varchar(45) Yes

photoUser foto pengguna varchar(45) Yes

activeUser status keaktifan enum(‘0’,’1’) Yes

TypeUser_idTyp

eUser

tipe user id int(10) Yes FK TypeUser

Tabel 3.1. Tabel Atribut Database Server (lanjutan)

TABLE

NAME

ATTRIBUTE

NAME


REFERENCE

TABLE

Category idCategory kategori id int(10) Yes PK

kodeCategory kode kategori varchar(45) Yes

nameCategory nama kategori varchar(45) Yes

statusCategory status kategori varchar(45) Yes

ThreadCont

ent

idThreadContent konten thread id int(10) Yes PK

levelContent level konten tinyint(3) Yes

titleContent judul konten varchar(255) Yes

descContent deskripsi konten text No

imageContent gambar konten varchar(255) No

videoContent video konten varchar(255) No

fileContent file konten varchar(255) No

Thread_idThread id Thread int(10) Yes FK Thread


TABLE

NAME

ATTRIBUTE

NAME


REFERENCE

TABLE

Thread idThread thread id int(10) Yes PK

timeCreated waktu thread

dibuat

timestamp yyyy-mm-dd hh:mm:ss Yes

lastEdited waktu terakhir

diubah

timestamp yyyy-mm-dd hh:mm:ss No

Category_idCate

gory

id kategori int(10) Yes FK Category

User_idUser id pembuat

thread

int(10) Yes FK User

Draft idThread draft id int(10) Yes PK

timeCreated waktu draft

dibuat


lastEdited waktu terakhir

diubah


Category_idCate

gory


User_idUser id pembuat draft int(10) Yes FK User


TABLE

NAME

ATTRIBUTE

NAME


REFERENCE

TABLE

DraftConte

nt

idThreadContent konten draft id int(10) Yes PK

levelContent level konten tinyint(3) Yes

titleContent judul konten varchar(255) Yes

descContent deskripsi konten text No

imageContent gambar konten varchar(255) No

videoContent video konten varchar(255) No

fileContent file konten varchar(255) No

Thread_idThread id Thread int(10) Yes FK Draft

News idNews id berita int(10) Yes PK

contentNews deskripsi berita text Yes

titleNews judul berita varchar(255) Yes

timeNews waktu berita

dibuat


userNews pembuat berita int(10) Yes

categoryNews id kategori

berita

int(10) Yes FK Category


TABLE

NAME

ATTRIBUTE

NAME


REFERENCE

TABLE

Task idTask id tugas int(10) Yes PK

titleTask judul tugas varchar(255) Yes

contentTask konten tugas text Yes

fileTask sisipan file varchar(255) No

timeTask waktu tugas

dibuat


deadlineTask batas waktu

pengumpulan


submitTask tipe tugas tinyint(3) Yes

categoryTask kategori tugas int(10) Yes FK Category

userTask pembuat tugas int(10) Yes FK User

TaskSubmit idTaskSubmit id pengumpulan

tugas

int(10) Yes PK

fileTaskSubmit file tugas varchar(255) Yes

noTaskSubmit id tugas int(10) Yes FK Task

userTaskSubmit pengumpul

tugas

int(10) Yes FK User

dateTaskSubmit waktu

dikumpulkan



TABLE

NAME

ATTRIBUTE

NAME


REFERENCE

TABLE

KBM idKBM id KBM int(10) Yes PK

idCategoryKBM kategori KBM int(10) Yes FK Category

tipePengajar tipe pengajar int(10) Yes FK TypeUser

idUserKBM id pengguna int(10) Yes FK User

RegMakul idRegMakul id registrasi

matakuliah

int(10) Yes PK

categoryRegMak

ul


userRegMakul id pengguna int(10) Yes FK User

3.4. Perancangan Aplikasi Web Server

Aplikasi web server dirancang dengan menggunakan bahasa script PHP: Hypertext

Preprocessor (PHP) versi 5.4.16 dengan framework Codeigniter versi 2.2.0 yang telah

mendukung arsitektur Model-View-Controller (MVC). Arsitektur dari aplikasi web server

bisa dilihat pada Gambar 3.12.

Gambar 3.12 Arsitektur Aplikasi Web Server

Penjelasan dari arsitektur aplikasi web server adalah sebagai berikut:

CI_Controller

CI_Controller adalah class yang berfungsi sebagai controller untuk menangani

dan menjembatani model, libraries, helpers, view, dan resources lain.

PHP CODEIGNITER

CONTROLLER

CI_CONTROLLER

VIEW

HTML

MODEL

CI_MODEL

WEB SERVICE CONTROLLER

REST CONTROLLER

MO

BIL

E C

LIE

NT

AN

DR

OID

JSON

HTTP POST / GET

Update Presentation

Update Data

Get Data

DATA QUERY

DATABASE MYSQL

CI_Controller akan memanggil model, atau resources lain sesuai permintaan,

mengolah data, dan menampilkannya melalui view. Terdapat juga controller khusus

untuk menangani operasi web services ke client yaitu REST_Controller. Pada

aplikasi ini terdapat 14 buah controller yaitu admin.php untuk menangani fungsi

administrator, home.php untuk menangani fungsi manajemen data thread dan

sekaligus menjadi halaman utama pada aplikasi web server, login.php untuk

menangani fungsi halaman login, task.php untuk menangani fungsi manajemen

data tugas, news.php untuk menangani fungsi manajemen data pengumuman,

category.php untuk menangani fungsi manajemen data matakuliah,

profile.php untuk menangani fungsi manajemen data yang dimiliki pengguna,

download.php untuk menangani fungsi yang berhubungan dengan unduh

dokumen, upload.php untuk menangani fungsi yang berhubungan dengan unggah

dokumen, lecture.php untuk menangani fungsi manajemen data dosen pada

aplikasi administrator, student.php untuk menangani fungsi manajemen data

mahasiswa pada aplikasi administrator, rmk.php untuk menangani manajemen data

registrasi matakuliah, verifylogin.php untuk menangani fungsi login, dan

services.php untuk menangani fungsi web services.

CI_Model

CI_Model adalah class yang berfungsi sebagai model dimana berfungsi untuk

menangani operasi pada database, atau fungsi-fungsi pengolahan data. Terdapat tujuh

buah model yang dibuat yaitu userModel.php untuk menangani operasi query pada

database khusus data yang berhubungan dengan client user, adminModel.php untuk

menangani operasi query pada database khusus data yang berhubungan dengan

aplikasi administrator, categoryModel.php untuk menangani operasi query pada

database khusus data yang berhubungan dengan matakuliah, threadModel.php

untuk menangani operasi query pada database khusus data yang berhubungan dengan

materi, taskModel.php untuk menangani operasi query pada database khusus data

yang berhubungan dengan tugas, newsModel.php untuk menangani operasi query

pada database khusus data yang berhubungan dengan pengumuman, dan

rmkModel.php untuk menangani operasi query pada database khusus data yang

berhubungan dengan registrasi matakuliah.

View

View berfungsi untuk menangani tampilan web pada aplikasi dimana dipanggil secara

spesifik oleh controller. File view mempunyai format PHP.

3.4.1. Konfigurasi Aplikasi Web Server

Untuk melakukan konfigurasi pada aplikasi, codeigniter sudah menyediakan file-file

konfigurasi yang terletak pada berkas config. Konfigurasi yang dilakukan antara lain:

Konfigurasi Database

Untuk dapat mengakses dan melakukan operasi pada database, maka perlu

dilakukan konfigurasi database pada codeigniter. Konfigurasi database ditangani

oleh file database.php. Konfigurasi database dapat dilihat pada Kode 3.1.

Kode 3.1 Konfigurasi Database

Pada kode tersebut dapat dilihat hostname dari database adalah localhost yang

berarti database yang digunakan terletak pada mesin server lokal. Database yang

digunakan bernama mlearning, dengan username root dan tanpa password.

Tipe dari database dapat dilihat pada $db['default']['dbdriver'] yaitu

menggunakan mysql.

Konfigurasi URL

Konfigurasi URL dilakukan untuk menentukan base url dari aplikasi.

Konfigurasi URL pada codeigniter ditangani oleh file config.php.

Konfigurasinya dapat dilihat pada Kode 3.2.

$db['default']['hostname'] = 'localhost';

$db['default']['username'] = 'root';

$db['default']['password'] = '';

$db['default']['database'] = mlearning';

$db['default']['dbdriver'] = 'mysql';

Kode 3.2 Konfigurasi URL

Konfigurasi Route

Konfigurasi route dilakukan untuk menentukan controller standar dari aplikasi

dan halaman yang diakses jika URL tidak valid. Konfigurasi route ditangani oleh

file routes.php. Konfigurasinya dapat dilihat pada Kode 3.3.

Kode 3.3 Konfigurasi Route

Pada kode tersebut dapat dilihat controller standar dari aplikasi adalah login

yang berarti ketika pertama membuka aplikasi maka akan masuk ke controller

login. Sedangkan $route['404_override'] = 'errors/error_404'

menjelaskan halaman web yang akan ditampilkan jika alamat URL tidak valid.

Konfigurasi Format Web services

Konfigurasi format web services dilakukan untuk menentukan format standar

untuk web services. Konfigurasi format web services ditangani oleh file

rest.php. Konfigurasinya dapat dilihat pada Kode 3.4.

Kode 3.4 Konfigurasi Format Web services

Pada Kode tersebut dapat dilihat format standar dari web service adalah JSON.

Selain JSON juga dapat ditentukan format standar yang lain seperti XML atau

CSV.

$config['rest_default_format'] = 'json';

$route['default_controller'] = 'login';

$route['404_override'] = 'errors/error_404';

$config['base_url'] = 'http://moodlemobile.site40.net ';

$config['index_page'] = 'index.php';

3.4.2. Autentikasi User

Ketika aplikasi web server pertama kali dibuka maka controller pertama yang

dijalankan adalah controller login dimana akan mengecek terlebih dahulu session bernama

logged in sudah aktif atau belum. Jika session belum ada maka controller login akan

menampilkan halaman sign in, namun jika session ada maka controller home akan

dipanggil. Controller verifylogin berfungsi untuk menangani autentikasi user. Proses

autentikasi user pada aplikasi dapat dilihat pada Kode 3.5.

Kode 3.5 Autentikasi User

Dari Kode 3.5 dapat dilihat bahwa aplikasi akan memanggil model user_model

untuk menjalankan fungsi pemeriksaan data admin yang tersimpan pada model tersebut

melalui fungsi $this->user_model->checkLogin().Jika fungsi tersebut

function check_database($password)

{

$session = $this->session->userdata('logged_in');

//Field validation succeeded. Validate against database

$email = $this->input->post('email');

//query the database

$result = $this->user_model->checkLogin($email, $password);

if($result)

{

$sess_array = array();

$sess_array = array(

'id' => $result->idUser,

'nama' => $result->nameUser,

'tipe' => $result->TypeUser_idTypeUser

);

$this->session->set_userdata('logged_in', $sess_array);

return TRUE;

}

else

{

$this->form_validation->set_message('check_database',

'Invalid username or password');

return false;

}}

mengembalikan nilai true maka aplikasi akan menyimpan data user pada session dan

masuk ke halaman home, tetapi jika tidak maka akan kembali ke halaman login_form

dengan pesan error. Fungsi $this->user_model->checkLogin() bertujuan

melakukan pemeriksaan data user pada database, kode nya dapat dilihat pada Kode 3.6.

Kode 3.6 checkLogin()

Dari Kode 3.6 dapat dilihat bahwa fungsi checkLogin() melakukan query ke

database dengan mencocokkan nama username dan password. Jika query memiliki data

lebih dari 0 berarti data ditemukan dan menjadi nilai kembalian pada fungsi tersebut.

3.4.3. Halaman User

Jika proses autentikasi berhasil, maka pengguna dapat memasuki halaman user.

Halaman user ini dikelola oleh controller home, controller task, controller news, controller

profile. Untuk melindungi agar semua controller tersebut hanya dapat diakses oleh user,

maka setiap controller akan melakukan pemeriksaan pada session apakah pengguna

berstatus log in atau tidak. Proses pemeriksaan tersebut dapat dilihat pada Kode 3.7.

$this->db-

>select(array('idUser','photoUser','TypeUser_idTypeUser','name

User','noInduk'));

$this->db->where('email',$username);

$this->db->where('password',$password);

$query = $this->db->get('user',1);

if($query->num_rows() > 0)

{

return $query->row();

}

else return 0;

Kode 3.7 Pemeriksaan Session

Pada Kode 3.7 dapat dijelaskan bahwa aplikasi akan menjalankan fungsi

__construct() terlebih dahulu dimana akan dilakukan pemeriksaan apakah $session

bernilai true atau tidak. Jika true maka halaman user dapat dimasuki, dan jika tidak maka

akan menampilkan pesan untuk melakukan login terlebih dahulu. Nilai $session

diperoleh dari session $this->session-> userdata('logged_in').

Pada halaman ini, pengguna dapat melihat, menambah, mengubah, menghapus, dan

mencari data materi, tugas dan berita. Sebagai contoh pengguna akan melihat data

pengumuman dan pengguna melakukan klik pada link berita maka controller news akan

dijalankan dan memanggil fungsi userNews() untuk menampilkan list berita. Ketika

pengguna memilih untuk menambahkan data baru, maka controller news akan memanggil

fungsi create()yang akan menampilkan view user_news_create. Jika pengguna

sudah memasukkan data dan melakukan validasi, maka controller news akan memanggil

fungsi verifyCreate()yang akan melakukan proses menyimpan data ke database

dengan bantuan model news_model->insertNews. Proses yang sama akan dikerjakan

untuk proses melihat dan menambah materi atau tugas.

Pada saat pengguna melakukan perubahan data semisal data tugas, maka controller

task akan memanggil fungsi edit(). Fungsi tersebut akan memanggil view

user_task_edit. Setelah pengguna mengisi data dan melakukan validasi, maka

controller task akan memanggil fungsi verifyUpdate() yang akan melakukan

perubahan data pada database dengan bantuan model task_model-> updateTask().

Proses yang sama akan dikerjakan untuk proses mengubah data materi dan berita.

function __construct()

{

parent::__construct();

date_default_timezone_set('Asia/Jakarta');

$session = $this->session->userdata('logged_in');

if(!$session)

{

redirect('login');

}

}

3.4.4. Web Services

Untuk menjalankan web service, aplikasi web server menggunakan controller khusus

bernama REST_Controller dimana bekerja dengan menerapkan prinsip RESTful web

service. Class untuk menjalankan web service dapat dilihat pada Kode 3.8

Kode 3.8 Class Service

Pada kode tersebut dapat dilihat nama class Service merupakan inheritance dari

REST_Controller melalui penamaan class Service extends REST_Controller.

Untuk menjalankan fungsi REST_Controller perlu diinisialisasi library kelas tersebut

melalui fungsi require(APPPATH.'libraries/REST_Controller.php'). Kelas

ini mempunyai fungsi update_post(). Fungsi tersebut mempunyai sufiks _post yang

berarti POST, jika dipanggil dengan metode lain maka akan menampilkan pesan error.

Fungsi thread_post() berfungsi untuk mengambil data sebuah materi. Client

akan mengirim permintaan ke web server dengan menyertakan id dari materi tersebut. Web

require(APPPATH.'libraries/REST_Controller.php');

class Service extends REST_Controller{

function thread_post()

{

$json = array();

$id = $this->input->post('idThread');

$data = $this->thread_model->getThreadContent($id);

foreach($data as $row)

{

$json['thread'][]=$row;

}

if($data)

{

$this->response($json, 200);

}

else

{

$this->response(array('error' => 'Couldn\'t find any

data!'), 404);

}

}

server akan mengambil data id materi tersebut dan menjadikan data tersebut sebagai

parameter dari fungsi model thread_model->getThreadContent($id). Data hasil

dari pengembalian dari fungsi model thread_model->getThreadContent($id)

dikirimkan ke client dalam format JSON. Untuk mengakses fungsi web service ini maka

URL-nya adalah http://moodlemobile.site40.net/services/thread. Fungsi

ini akan menghasilkan JSON yang dapat dilihat pada Kode 3.9.

Kode 3.9 JSON Thread Data

{

"thread": [

{

"idThreadContent":"50",

"levelContent":"0",

"titleContent":"Make Arduino Thermometer With

LM35",

"descContent":"Hello, everyone !!! Today I'm going

to show you how to make thermometer with Arduino and LM35

termperature sensor, builded on bread board and conected

together with jumpers (bunch of cables :D).",

"imageContent":"IMG_23_0.jpg",

"videoContent":"VID_23_0.mp4",

"fileContent":"",

"Thread_idThread":"23"

},

{

"idThreadContent":"51",

"levelContent":"1",

"titleContent":"Gathering The Parts",

"descContent":"This is the list the parts needed to

make the thermometer.\r\n\r\nIf you dont have 10k pot you can

use 50k like me !\r\n\r\n1x Arduino board\r\n1x

Breadboard\r\n1x 16x2 LCD display\r\n1x LM35 sensor \r\n1x 10k

potentiometer - for adjusting the brightness of the

display\r\n19x Jumpers - to connect everything",

"imageContent":"DRAFT_2_1.jpg",

"videoContent":"","fileContent":"FILE_20_1.mp3",

"Thread_idThread":"23"}

}

]

}

3.5. Perancangan Aplikasi Mobile

Aplikasi mobile dirancang dengan menggunakan Android SDK API 18 atau Android

4.3.

3.5.1 Konfigurasi Permission dan Feature

Untuk dapat mengakses perangkat keras dan fitur yang dimiliki oleh perangkat

mobile Android, maka perlu dikonfigurasi terlebih ijin dan akses fitur atas aplikasi.

Konfigurasi permission terletak pada AndroidManifest.xml yang dapat dilihat pada

Kode 3.10

Kode 3.10 Konfigurasi Permission Aplikasi

Konfigurasi permission aplikasi antara lain:

Android.permission.INTERNET

Mengijinkan aplikasi untuk mengakses socket network.

Android.permission.ACCESS_NETWORK_STATE

Mengijinkan aplikasi untuk mengakses informasi jaringan perangkat Android.

Android.permission.WRITE_EXTERNAL_STORAGE

Mengijinkan aplikasi untuk menuliskan data pada media penyimpan luar.

Android.permission.CAMERA

Mengijinkan aplikasi untuk mengakses kamera yang ada di perangkat Android.

3.5.2 Activity

Aplikasi mobile ditangani oleh berbagai activity, dimana activity tersebut akan

menangani aksi yang ditangani oleh pengguna, dan juga menangani User Interface. Activity

yang terdapat dalam aplikasi ini adalah sebagai berikut:

LoginActivity

<uses-permission android:name="android.permission.INTERNET" />

<uses-permission

android:name="android.permission.ACCESS_NETWORK_STATE" />

<uses-permission

android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

<uses-permission android:name="android.permission.CAMERA" />

Activity ini berfungsi sebagai autentikasi pengguna sebelum masuk ke activity utama.

Ketika Button btnLogin ditekan maka permintaan verifikasi dikirim ke web

server. Kemudian, web server mengirimkan kembali respon dari verifikasi apakah

sukses atau gagal beserta pesan yang ditampilkan melalui fungsi Toast. Jika berhasil

maka data – data pengguna yang dibutuhkan di aplikasi ini akan disimpan di kelas

MyAppHelper dan intent ke MainActivity dieksekusi.

MainActivity

MainActivity merupakan activity utama dalam aplikasi ini. Semua fitur dalam

aplikasi ini haruslah melewati activity ini terlebih dahulu. Activity ini memiliki

navigation drawer sehingga dapat dengan mudah pengguna memilih menu yang

pengguna inginkan. Menu – menu yang terdapat pada navigation drawer ini yaitu

menu Thread untuk menampilkan daftar materi pada konten utama pada activity,

menu Task untuk menampilkan daftar tugas pada konten utama pada activity, menu

News untuk menampilkan daftar pengumuman pada konten utama pada activity,

menu My Profile untuk menampilkan menu-menu yang berhubungan dengan

kepemilikan dari pengguna, dan menu Logout untuk melakukan autentikasi lagi

dengan pengguna berbeda.

Dalam activity ini juga terdapat tiga quick button yaitu button create thread yang

akan menuju CreateThreadActivity, button create task yang akan menuju

CreateTaskActivity, button create news yang akan menuju

CreateNewsActivity.

ThreadActivity

Activity ini berfungsi menampilkan isi lengkap dari materi yang dipilih oleh

pengguna di MainActivity. Ketika gambar pada activity ini ditekan maka akan

menuju FullScreenImageActivity. Terdapat tautan file yang jika ditekan maka

proses mengunduh akan dilakukan. Terdapat tautan video juga yang jika ditekan akan

menuju ViewVideoActivity.

FullScreenImageActivity

Activity ini berfungsi menampilkan sebuah gambar dalam bentuk full screen. Fitur

memperbesar dan memperkecil ukuran gambar juga disertakan dalam activity ini.

ViewVideoActivity

Activity ini berfungsi menampilkan sebuah video.

TaskDetailActivity

Activity ini berfungsi menampilkan isi lengkap dari tugas yang dipilih oleh pengguna

di MainActivity. Terdapat tautan file yang jika ditekan maka proses mengunduh

akan dilakukan.

CreateThreadActivity

Activity ini berfungsi memilih category sebagai langkah awal dalam membuat materi

baru.

IntroActivity

Activity ini berfungsi sebagai form pembuatan materi yang berisi pengisian judul,

pengisian deskripsi, dan penambahan gambar.

OverviewActivity

Activity ini berfungsi menampilkan langkah - langkah yang telah dibuat di

IntroActivity dalam bentuk gridview. Pengguna dapat memilih salah satu

langkah yang akan menuju EditStepActivity.

EditStepActivity

Activity ini berfungsi sebagai form ubah langkah materi yang telah dibuat

sebelumnya.

CreateTaskActivity

Activity ini berfungsi sebagai form pembuatan perintah tugas baru.

EditTaskActivity

Activity ini berfungsi sebagai form ubah perintah tugas yang telah dibuat sebelumnya.

CreateNewsActivity

Activity ini berfungsi sebagai form pembuatan pengumuman baru.

EditNewsActivity

Activity ini berfungsi sebagai form ubah pengumuman yang telah dibuat sebelumnya.

MateriListActivity

Activity ini berfungsi menampilkan semua materi yang dibuat oleh pengguna.

TaskListActivity

Activity ini berfungsi menampilkan semua perintah tugas yang dibuat oleh pengguna.

NewsListActivity

Activity ini berfungsi menampilkan semua pengumuman yang dibuat oleh pengguna.

3.5.3 Web Services

Untuk dapat mengakses web server dan menjalankan fungsi web server, aplikasi

mobile menggunakan API org.apache.http dan org.json. Pada proses web service, aplikasi

mobile mengirimkan permintaan ke web server melalui protokol HTTP. Kemudian di web

server fungsi akan dijalankan dan akan mengembalikan data dalam format JSON. Ada dua

tahapan kerja yang dilakukan pada proses web service aplikasi mobile yaitu:

Melakukan koneksi HTTP

Aplikasi mobile mengirimkan permintaan web server dan mendapatkan data melalui

koneksi HTTP. Proses koneksinya dapat dilihat pada Kode 3.11.

Kode 3.11 Kelas ServiceHandler

static String response = null;

public final static int GET = 1;

public final static int POST = 2;

public String makeServiceCall(String url, int method) {

return this.makeServiceCall(url, method, null);

}

public String makeServiceCall(String url, int

method,List<NameValuePair> params) {

try {

DefaultHttpClient httpClient = new

DefaultHttpClient();

HttpEntity httpEntity = null;

HttpResponse httpResponse = null;

if (method == POST) {

HttpPost httpPost = new HttpPost(url);

if (params != null) {

httpPost.setEntity(new

UrlEncodedFormEntity(params));

}

httpResponse = httpClient.execute(httpPost);

} else if (method == GET) {

if (params != null) {

String paramString =

URLEncodedUtils.format(params, "utf-8");

url += "?" + paramString;

}

HttpGet httpGet = new HttpGet(url);

httpResponse = httpClient.execute(httpGet);

}

httpEntity = httpResponse.getEntity();

response = EntityUtils.toString(httpEntity);

} catch (UnsupportedEncodingException e) {

e.printStackTrace();

} catch (ClientProtocolException e) {


} catch (IOException e) {


}

return response;

}

Proses yang dikerjakan:

a. Menginisialisasi DefaultHttpClient httpClient dan HttpPost

httppost = new HttpPost(url) dimana aplikasi akan melakukan

koneksi dengan HTTP POST ke variabel url. Apabila melakukan koneksi

dengan HTTP GET maka HttpGet httpGet = new HttpGet(url);

b. Jika ada parameter pada metode POST maka httpPost.setEntity(new

UrlEncodedFormEntity(params)), sedangkan pada metode GET maka

akan dilakukan penambahan pada variabel url.

c. Melakukan eksekusi httpResponse =

httpclient.execute(httppost). httpResponse berisi hasil respon dari

fungsi httppost yang dieksekusi. Kemudian httpResponse diambil entity

nya dan disimpan di httpEntity.

d. Melakukan eksekusi response =

EntityUtils.toString(httpEntity). Kode ini berarti mengubah entity

ke bentuk String dan disimpan ke dalam variabel response.

Parsing JSON

Pada tahap ini data JSON yang telah diterima dari web server akan diuraikan untuk

kemudian dipakai sesuai dengan kebutuhan di activity tersebut. Contoh proses

parsing JSON dapat dilihat pada kode 3.12.

Kode 3.12 Parsing JSON

JSONObject jsonObj = new JSONObject(jsonStr);

// Getting JSON Array node

tasks = jsonObj.getJSONArray("task");

// looping through All Contacts

for (int i = 0; i < tasks.length(); i++) {

JSONObject c = tasks.getJSONObject(i);

String id = c.getString("idTask");

String title = c.getString("titleTask");

String time = c.getString("timeTask");

String cat = c.getString("nameCategory");

String submit = c.getString("submitTask");

}

Proses yang dikerjakan:

a. Membuat sebuah JSONObject dan mengisinya berdasarkan respon dari web

server melalui fungsi JSONObject jsonObj = new

JSONObject(response);

b. Melakukan penyaringan data produk dan dimasukkan pada JSONArray

tasks melalui fungsi JSONArray

products=jsonObj.getJSONArray("task").

c. Mengambil data JSONObject c = tasks.getJSONObject(i). Proses

mengambil data ditentukan dengan format data yang akan disimpan semisal data

String dengan cara c.getString("idTask").

Documents

BAB III PERANCANGAN SISTEM 3.1. Gambaran Sistem Aplikasi … · 2017. 2. 3. · BAB III . PERANCANGAN SISTEM . Pada bab ini akan dijelaskan perancangan aplikasi dimulai dengan kebutuhan