Upload
muhja-mufidah
View
41
Download
0
Embed Size (px)
DESCRIPTION
Dokumen Perancangan Perangkat Lunak WEBTIIK (Website Praktikum Perangkat Lunak)
Citation preview
REKAYASA PERANGKAT LUNAK IF - DDOKUMEN PERANCANGAN PERANGKAT LUNAK
WEBTIIK
UNTUK :PRAKTIKAN DI PTIIK
Dipersiapkan oleh:Kelompok 6
Andriansyah Yusuf Rizal (135150201111122)Muhja Mufidah Afaf Amirah (135150207111120)
Mochamad Imam Sya’roni (125150201111066)Fadhel Suryana Putra (125150207111070)Regina Anky Chandra (135150207111067)
Laboratorium
RekayasaPerangkat LunakProgram Teknologi Informasi dan Ilmu Komputer
Nomor Dokumen Halaman
SEL01-Sxx <xx:no grp> #/jml #Revisi : 3 Tanggal:
30 Oktober 2014
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
DAFTAR PERUBAHAN
Revisi Deskripsi
A
B
C
D
F
G
INDEX
TGL
A
10/10/14
B
24/10/14
C
31/10/14D E F G H
Ditulis
Oleh
Kelompokx Kelompox Kelompokx
Diperiksa
Oleh
Asprak Asprak Asprak
Disetujui
Oleh
ii
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
DAFTAR HALAMAN PERUBAHAN
Halaman Revisi Halaman Revisi
iii
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
DAFTAR ISI
WEBTIIK................................................................................................................... i
DAFTAR PERUBAHAN..............................................................................................ii
DAFTAR HALAMAN PERUBAHAN........................................................................... iii
DAFTAR ISI............................................................................................................. iv
DAFTAR TABEL.......................................................................................................vi
DAFTAR DIAGRAM................................................................................................vii
DAFTAR GAMBAR.................................................................................................viii
BAB 1 PENDAHULUAN............................................................................................1
1.1 Deskripsi Umum Dokumen....................................................................1
1.2 Tujuan Penulisan Dokumen...................................................................1
1.3 Lingkup Masalah....................................................................................1
1.4 Definisi, Istilah, dan Singkatan...............................................................2
1.5 Referensi...............................................................................................3
BAB 2 DESKRIPSI PERANCANGAN GLOBAL.............................................................4
2.1 Perancangan Arsitektur.........................................................................4
2.1.1 Data Flow Diagram........................................................................4
2.1.2 Fungsi Tambahan........................................................................11
2.2 Perancangan Data...............................................................................11
2.3 Perancangan Antarmuka.....................................................................11
2.3.1 Perancangan Antarmuka.............................................................11
2.3.2 Deskripsi Pertukaran Data...........................................................12
2.4 Lingkungan Pengembangan Sistem.....................................................12
2.4.1 Software......................................................................................12
2.4.2 Sistem Operasi............................................................................12
2.4.3 Hardware.....................................................................................12
2.4.4 Arsitektur Sistem.........................................................................12
BAB 3 DESKRIPSI PERANCANGAN RINCI...............................................................14
3.1 Perancanan Komponen.......................................................................14
3.1.1 Modul Administrator...................................................................14
3.1.2 Modul User (Asisten)...................................................................14
3.1.3 Modul User (Praktikan)...............................................................15
iv
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
3.2 Perancangan Data...............................................................................16
3.3 Perancangan Antarmuka.....................................................................16
3.3.1 Antarmuka Pengguna .................................................................16
3.3.2 Mekanisme Pertukaran Data.......................................................18
v
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
DAFTAR TABEL
No table of figures entries found.This is an automatic table of contents. To use it, apply heading styles (on the Home tab) to the text that goes in your table of contents, and then update this table. If you want to type your own entries, use a manual table of contents (in the same menu as the automatic one).
vi
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
DAFTAR DIAGRAM
vii
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
DAFTAR GAMBAR
viii
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
BAB 1 PENDAHULUAN
1.1 Deskripsi Umum DokumenDokumen Perancangan Perangkat Lunak (DPPL) ini dibagi menjadi 3 bagian
utama. Bagian pertama yaitu pendahuluan. Bagian ini mencakup tentang deskripsi umum dokumen, tujuan dari penulisan dokumen, lingkup masalah dari perangkat lunak yang dikembangkan, definisi serta istilah dan singkatan yang digunakan dalam dokumen ini, serta referensi yang digunakan dalam pemmbuatan dokumen.
Pada bagian kedua yaitu deskripsi perancangan global. Pada bagian ini akan berisikan tentang perancangan arsitektur yangmana DFD diterjemahkan menjadi transform dan transaction mapping, perancangan data yang akan menjelaskan proses normalisasi diagram ERD yang telah ada di dalam dokumen kebutuhan sebelumnya, perancangan antarmuka berdasarkan fungsi yang ada di dalam sistem, serta menjelaskan lingkungan yang termasuk ke dalam pengembangan sistem.
Bagian terakhir, bagian ketiga , yaitu desjripsi perancangan rinci. Pada bab ini berisikan perancangan komponen yang menjelaskan 3 modul utama dan algoritma 3 method utama yang ada di dalamnya, perancangan data tentang database yang sudah ternormalisasi, dan perancangan antarmuka berdasarkan fungsi dan unsur-unsur tertentu.
1.2 Tujuan Penulisan DokumenDokumen ini berisi Deskripsi Perancangan Perangkat Lunak (DPPL) perangkat
lunak WEBTIIK (Website Praktikum PTIIK). Tujuan dari penulisan dokumen ini adalah untuk memberikan penjelasan mengenai perangkat lunak yang akan dibangun baik berupaa gambaran umum maupun penjelasan detail dan menyeluruh. Dokumen ini juga bertujuan untuk merancang perangkat lunak yang sesuai dengan spesifikasi kebutuhan perangkat lunak dan sebagai dokumen sebelum perangkat lunak diimplementasikan oleh pengembang.
Pengguna dari dokumen adalah pengembang perangkat lunak WEBTIIK (Website Praktikum PTIIK). Dokumen ini akan digunakan sebagai acuan dalam proses pengembangan dan sebagai bahan evaluasi pada saat proses pengembangan perangkat lunak berlangsung ataupun pada tahap akhir pengembangan. Dengan adanya dokumen DPPL ini diharapkan pengembangan perangkat lunakakan lebih terarah dan terfokus serta tidak menimbulkan ambiguitas bagi pengembang.
1.3 Lingkup MasalahPerangkat lunak yang akan dikembangkan adalah WEBTIIK (Website
Praktikum PTIIK), yaitu perangkat lunak yang berjalan pada platform website
1
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
yang berfungsi sebagai media pendukung serta penyampaian dan penerimaan informasi interaktif untuk praktikum laboratorium komputer dasar di PTIIK. Pengguna dari WEBTIIK ini adalah asisten praktikum dan praktikan. Dengan adanya perangkat, akan memudahkan pengguna tentang informasi seputar kegiatan praktikum seperti pengumuman, penilaian, dan sebagainya. Untuk merealisasikannya, perangkat akan dirancang untuk berjalan dari dua sisi, sisi server yaitu Localhost/Hosting, sedangkan dari sisi client yaitu Web Browser yang diakses oleh pengguna seperti Mozilla Firefox, Chrome, Safari, dan sebagainya. Data-data di dalam perangkat akan disimpan di dalam database yang akan dibuat dengan DBMS berupa Heidi SQP dan DBDesigner.
Untuk memenuhi kebutuhan pengguna seperti yang telah dispesifikasikan sebelumnya, maka fungsi-fungsi yang disediakan diantaranya yaitu :
Fungsi pengumuman : untuk melihat dan memasang pengumuman seputar kegiatan praktikum
Fungsi upload soal : untuk mengunggah soal dari challange, UTS, dan UAP oleh asisten
Fungsi nilai : untuk melihat nilai yang didapat oleh praktikan
Fungsi forum : untuk menuliskan pertanyaan dan jawaban atau komentar
Fungsi home : sebagai halaman utama dari website setelah pengguna login
1.4 Definisi, Istilah, dan SingkatanDefinisi, Istilah, dan Singkatan Keterangan
WEBTIIK Website Praktikum PTIIKMerupakan aplikasi penunjang untuk kegiatan praktikum laboratorium komputer dasar, khususnya Pemrograman Dasar
DPPL Dokumen Perancangan Perangkat LunakMerupakan dokumen yang berisi deskripsi perancangan perangkat lunak
SKPL Spesifikasi Kebutuhan Perangkat LunakDokumen hasil analisis yang berisi spesifikasi kebutuhan user
IEEE Institute of Electrical and Electronics EngineeringMerupakan standar internasional untuk pengembangan dan perancangan perangkat lunak
User Orang yang menggunakan sistem WEBTIIKAdministrator Orang yang bertugas mengelola data dan sistemDCD Data Context Diagram
Merupakan diagaram yang menggambarkan hubungan sistem dengan lingkungannya
DFD Data Flow DiagramDiagram yang menggambarkan aliran data dalam sistem
ERD Entitiy Relationship DiagramDiagram yang menggambarkan relasi antara entitas dan atribut dari masing-masing entitas
SQL Structured Query Language
2
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
DBMS Database Management SystemTCP/IP Standar komunikasi data yang digunakan oleh komunitas internet dalam
proses tukar-menukar data dari satu komputer ke komputer lain dalam jaringan internet.
Tabel 1 Definisi, Singkatan, dan Akronim
1.5 ReferensiDokumen-dokumen yang digunakan sebagai referensi dalam pembuatan
DPPL ini adalah sebagai berikut :
1. IEEE Std. 830-1993, IEEE Recommended Practice for Software Requirement Specification.
2. Jurusan Teknik Informatika – Institut Teknologi Bandung Panduan GL01, Panduan Penggunaan dan Pengisian Spesifikasi Kebutuhan Perangkat Lunak (SKPL).
3. Direktorat Teknologi Informasi dan Komunikasi – Universitas Pendidikan Indonesia, Spesifikasi Kebutuhan Perangkat Lunak (Template).
4. Spesifikasi Kebutuhan Perangkat Lunak (SKPL) WEBTIIK (Website Praktikum PTIIK).
3
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
BAB 2 DESKRIPSI PERANCANGAN GLOBAL
2.1 Perancangan Arsitektur
2.1.1 Data Flow Diagram
1. DFD Memproses Seleksi Asisten
Diagram 1 DFD Memproses Seleksi Asisten
Dalam DFD Memproses Seleksi Asisten terdapat satu jenis pemetaan aliran data, yaitu transaction mapping. Maka dari itu proses-proses dipisahkan sebagai berikut:
Transaction : soal_seleksi
Transaction Center : Memperoleh Soal
Action Path : Memperoleh Jawaban, Memproses Seleksi Asisten
- Refactor
4
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
Diagram 2 Refactoring DFD Memproses Seleksi Asisten
2. DFD Memperoleh Praktikum
Diagram 3 DFD Memperoleh Praktikum
Dalam DFD Memperoleh Praktikum terdapat satu jenis pemetaan aliran data, yaitu transform mapping. Maka dari itu proses-proses dipisahkan sebagai berikut:
Incoming flow : Memperoleh Soal
5
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
Transform center : Memperoleh Praktikum
Outgoing flow : Memperoleh Pengumuman, Memperoleh Komentar
- Refactor
Diagram 4 Refactoring DFD Memperoleh Praktikum
3. DFD Forum
Diagram 5 DFD Forum
Dalam DFD Forum terdapat satu jenis pemetaan aliran data, yaitu transform mapping. Maka dari itu proses-proses dipisahkan sebagai berikut:
Incoming flow : seleksi, tanya_jawab
Transform center : Forum
6
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
Outgoing flow : Memperoleh Komentar
- Refactor
Diagram 6 DFD Refactor Forum
4. DFD Menghitung Nilai
Diagram 7 DFD Menghitung Nilai
Dalam DFD Menghitung Nilai terdapat satu jenis pemetaan aliran data, yaitu transform mapping. Maka dari itu proses-proses dipisahkan sebagai berikut:
Incoming flow : Memperoleh Soal, Menghitung Nilai
7
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
Transform center : Memperoleh Jawab
Outgoing flow : Menghitung Nilai Akhir
- Refactor First Iteration
Diagram 8 Refactoring First-Iteration DFD Menghitung Nilai
- Refactor Second Iteration
Diagram 9 Refactoring Second-Iteration DFD Menghitung Nilai
8
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
5. DFD Memperoleh Kelas
Diagram 10 DFD Meperoleh Kelas
Dalam DFD Memproses Seleksi Asisten terdapat satu jenis pemetaan aliran data, yaitu transaction mapping. Maka dari itu proses-proses dipisahkan sebagai berikut:
Transaction : kelas
Transaction Center : Memproses Permintaan Kelas
Action Path : Melakukan Update Kelas, Menerima Kelas
- Refactor
9
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
Diagram 11 Refactoring DFD Memperoleh Kelas
6. DFD WEBTIIK
Diagram 12 DFD WEBTIIK (1 Sistem Keseluruhan)
Dalam DFD WEBTIIK terdapat satu jenis pemetaan aliran data, yaitu transform mapping. Maka dari itu proses-proses dipisahkan sebagai berikut:
10
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
Incoming flow : Melakukan Update Kelas, Menerima Kelas, Memvalidasi Kelas, Memperoleh Soal
Transform center : Memproses Seleksi Asisten
Outgoing flow : Memproses Permintaan Kelas, Menerima Asisten, Memperoleh Pengumuman, Memperoleh Komentar, Memperoleh Praktikum, Forum, Menghitung Nilai, Menghitung Nilai Akhir, Mengerjakan Tugas
- Refactor First Iteration
Diagram 13 Refactoring First-Iteration DFD WEBTIIK
- Refactor Second Iteration
Diagram 14 Refactoring First-Iteration DFD WEBTIIK
11
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
2.1.2 Fungsi Tambahan
WEBTIIK menggunakan web service Apache.
2.2 Perancangan Data
Diagram 15 ER Diagram WEBTIIK
Pada diagram ERD kami semua proses sudah dirasa normal oleh karena itu bila dipaksakan normalisasi akan terjadi ketidaksinkronan pada database kami.
2.3 Perancangan Antarmuka
2.3.1 Perancangan Antarmuka
User Familiarity : User familiarity dalam sistem WEBTIIK menggunakan tombol button yang biasa digunakan oleh user seperti home, pengumuman dan lain-lain.
Konsistensi : Konsistensi diterapkan pada warna tampilan WEBTIIK, dari tampilan home, pengumuman dan fitur-fitur lain menggunakan warna yang sama.
Minimal Surprise : Prinsip minimal surprise yang diterapkan pada sistem ini adalah tidak menggunakan banyak pop up dan java script. Sehingga user sudah terbiasa dan tidak akan terkejut ketika ada response dari sistem yang berbeda.
Recoverability : Pada sistem juga terdapat tombol back atau undo yang mengijinkan user untuk recovery.
12
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
User Guidance : Apabila terjadi error atau kesalahan maka akan muncul feedback atau pemberitahuan dari sistem bahwa aktivitas yang baru saja dilakukan sistem tidak tercatat dan user dapat merefresh ulang laman.
User Diversity : Antarmuka dan fasilitas interaksi yang disediakan oleh sistem akan berbeda untuk masing-masing user, yaitu berbeda antara praktikan dan asisten.
2.3.2 Deskripsi Pertukaran Data
Apache adalah web service yang kami gunakan dalam pengembangan perangkat lunak ini. Apache adalah sebuah nama web server yang bertangguna jawab pada request-response HTTP dan logging informasi secara detail. Selain itu, Apache juga diartikan sebagai suatu web server yang kompak, modular, mengikuti standar protokol HTTP, dan tentu saja sangat digemari.
Web server apache bekerja dengan model thread based. Web server ini menggunakan proses (thread) untuk menerima dan merespon permintaan.
2.4 Lingkungan Pengembangan Sistem
2.4.1 Software
DBMS : Heidi SQP, DBDesigner
Text Editor: Sublime Text
Web Service : Apache
2.4.2 Sistem Operasi
Windows 10
2.4.3 Hardware
Processor Intel(R) Core(TM) i5-4200U CPU @1.60GHz 2.30 GHz, RAM 4.00 GB Hard Disk 500GB
13
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
2.4.4 Arsitektur Sistem
Gambar 1 Arsitektur Sistem
Sistem kami menggunakan arsitektur 3 tier, yang terdiri dari client, dan 2 buah database server. Client berupa asisten, praktikan, dan admnistrator server berupa Heidi SQP dan DBDesigner.
14
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
BAB 3 DESKRIPSI PERANCANGAN RINCI
3.1 Perancanan Komponen
3.1.1 Modul Administrator
1) Algoritma Autentifikasi Asisten Dan Praktikan
if (username, email, and password = true) then
berhasil login
else
gagal login (login lagi)
Tabel 1 Algoritma Autentifikasi Asisten Dan Praktikan
2) Algoritma Menyetujui Request Kelas Asisten
requestKelas (admin)
input (kelas)
if kelas (asisten) tersedia then
kelas berhasil diinputkan
else
kelas tidak berhasil diinputkan
Tabel 2 Algoritma Menyetujui Request Kelas Asisten
3) Algoritma Tambah Jadwal
tambahJadwal (admin)
input (jadwal)
if jadwal (asisten) tersedia then
jadwal berhasil diinputkan
else
jadwal tidak berhasil diinputkan
Tabel 3 Algoritma Tambah Jadwal
3.1.2 Modul User (Asisten)
1) Algoritma Upload Jawaban
uploadJawaban (asisten)
15
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
input (jawaban)
if jawaban (asisten) benar then
jawaban berhasil di upload
else
jawaban tidak berhasil di upload
Tabel 4 Algoritma Upload Jawaban
2) Algoritma Input Nilai Praktikan
nilaiPraktikan (asisten)
input (nilai)
if nilai (asisten) benar then
nilai berhasil diinputkan
else
nilai tidak berhasil diinputkan
Tabel 5 Algoritma Input Nilai Praktikan
3) Algoritma Memilih Kelas
dataJadwal (admin)
pilihan memilih_kelas (asisten)
if tersedia (ya) then
memilih_kelas berhasil
else
memilih_kelas tidak berhasil
Tabel 6 Algoritma Memilih Kelas
3.1.3 Modul User (Praktikan)
1) Algoritma Jawab Soal
jawabSoal (praktikan)
input (jawaban)
if jawaban (praktikan) yakin then
jawaban berhasil dijawab
else
jawaban tidak berhasil dijawab
16
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
Tabel 7 Algoritma Jawab Soal
2) Algoritma Tanya Asisten
inboxPertanyaan (asisten)
input (pertanyaan)
if pertanyaan (praktikan) yakin then
pertanyaan berhasil dikirim
else
pertanyaan tidak berhasil dikirim
Tabel 8 Algoritma Tanya Asisten
3) Algoritma Lihat Nilai
tampilNilai
if (nilai = true ) then
nilai berhasil dilihat
else
nilai tidak berhasil dilihat
Tabel 9 Algoritma Lihat Nilai
3.2 Perancangan Data
Diagram 16 Physical Data Model
17
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
3.3 Perancangan Antarmuka
3.3.1 Antarmuka Pengguna
1) Halaman Login
No Nama objek Tipe Keterangan
1 Enter Email ID Text Field Mengisi email user yang ingin didaftarkan
2 Enter Password Text Field Mengisi password untuk akun user
3 Tombol Login Button Masuk ke sistem
4 Register Button Mendaftarkan user
2) Halaman Home
18
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
No Nama objek Tipe Keterangan
1 Pengumuman Read Melihat pengumuman yang telah di-post
2 Data Asisten Read Melihat daftar/data asisten
3 More Pengumuman Button Melihat pengumuman yang di post administrator
3) Halaman Pengumuman
No Nama objek Tipe Keterangan
1 Pengumuman Read Melihat pengumuman yang telah di-post
19
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
2 Read More Button Melihat pengumuman yang di post administrator
4) Halaman Forum Tanya Jawab
No Nama objek Tipe Keterangan
1 Judul Text Masuk ke dalam forum diskusi sesuai judul
2 Enter Subject Text Field Menuliskan mata kuliah
3 Enter Message Text Field Menuliskan pertanyaan kepada asisten
4 Post Thread Button Memposting pertanyaan
5) Melihat dan Memposting Komentar
20
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
No Nama objek Tipe Keterangan
1 Leave a Comment Text Field Memberikan komentar
2 Komentar Text Melihat komentar yang telah di post oleh user lain
3 Submit Button Memposting komentar
6) Halaman Data Asisten
No Nama objek Tipe Keterangan
1 Nama Read Melihat daftar nama asisten
2 Kelas Read Melihat kelas asisten
3 Kontak Read Melihat kontak asisten
21
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
7) Halaman Lihat Soal
No Nama objek Tipe Keterangan
1 Kode Soal Read Melihat kode soal
2 Judul Soal Read Melihat judul soal
3 Lihat soal/challenge Text Praktikan memilih soal untuk dilihat
8) Halaman Pengumpulan Tugas
No Nama objek Tipe Keterangan
1 Pilih ID Tugas Dropdown Memilih ID tugas
2 Choose file Button Memilih file yang akan diupload
3 File Name Read Melihat nama file yang akan diupload
4 Input jawaban Button Mengunggah
22
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
jawaban
9) Halaman Lihat Nilai
No Nama objek Tipe Keterangan
1 Nama Read Melihat nama praktikan
2 NIM Read Melihat nim praktikan
3 Nilai Read Melihat nilai yang ditulis oleh asisten
10) Halaman Log Out
No Nama objek Tipe Keterangan
1 Photo profile Photo Menampilkan foto profil user
2 ID Read Menampilkan ID user
3 Tombol Logout Button Keluar dari sistem
23
212
3212
DOKUMEN PERANCANGAN PERANGKAT LUNAK
Nomor DokumenRevisi : x
3.3.2 Mekanisme Pertukaran Data
Pertukaran data tidak menggunakan Framework tertentu. Ketika user menekan tombol pada user interface maka akan langsung di redirect ke halaman yang diinginkan dan mengirim perintah supaya menampilkan ke user interface, database mengirim data yang dibutuhkan oleh halaman sehingga ditampilkan p ada user interface.
24