LAPORAN

PRAKTIKUM PEMROGRAMAN KOMPUTER

MODUL 9 – KONSEP MVC DENGAN UML
Pelaksanaan Praktikum
Hari: Senin Tanggal: 10 Mei 2021 Jam ke: 9-10

Oleh:
Nabila Meinisya Sahira
NIM: 081911733045

Dosen Pembimbing : Alfian Pramudita Putra, S.T.,M.Sc.

FAKULTAS SAINS DAN TEKNOLOGI

UNIVERSITAS AIRLANGGA
2021
A. Tujuan :
1. Mengetahui konsep dasar diagram UML
2. Aplikasi konsep MVC dengan UML
B. Dasar Teori

MVC adalah konsep arsitektur dalam pembangunan aplikasi berbasis web yang
membagi aplikasi web menjadi 3 bagian dasar dimana setiap bagian memiliki tugas-
tugas serta tanggung jawab masing-masing. Bagian-bagian tersebut adalah :

1. Model: Bertugas untuk mengatur, menyiapkan, memanipulasi dan

mengorganisasikan data dari database agar sesuai dengan instruksi dari controller.
2. View: Bertugas untuk menyajikan informasi kepada user sesuai dengan pedoman
dari controller.
3. Controller: Bertugas untuk mengatur apa yang harus dilakukan model, dan view
mana yang harus ditampilkan berdasarkan permintaan dari user.

UML atau singkatan dari Unified Modeling Language adalah bahasa untuk
menspesifikasi, memvisualisasi, membangun dan mendokumentasikan bagian-bagian
dari informasi yang kemudian diproses oleh sistem perangkat lunak,seperti pada
pemodelan bisnis dan sistem non perangkat lunak lainnya. UML berfungsi
memodelkan suatu sistem yang menggunakan konsep berorientasi objek sehingga
memudahkan para system developer untuk berdiskusi dengan bahasa pemodelan yang
mudah dipahami. UML sendiri juga memiliki beberapa aplikasi dengan menggunakan
konsep MVC yaitu;

1. Use Case Diagram untuk aplikasi penggunaan

2. Activity Diagram untuk navigasi user
3. Class diagram untuk struktur aplikasi

Contoh bentuk Use Case Diagram

 Use Case Diagram disebelah berfungsi untuk menjelaskan sistem pada ATM.
Ada 3 user pada sistem tersebut yaitu Customer, Bank, dan Teknisi ATM dimana tiap
user memiliki kewenangan yang berbeda pada subsistem ATM. User Bank memiliki
kewenangan mengatur keuangan maupun perawatan dan pemperbaikan ATM dimana
user lain hanya memiliki kewenangan pada salah satu kewenangan saja. Berdasarkan
hal diatas, penggunaan use case diagram adalah untuk memahami fungsi apa saja yang
ada di dalam suatu sistem dan siapa saja yang dapat mengakses fungsi tersebut

Contoh bentuk Activity Diagram

Diagram diatas adalah activity diagram yang menjelaskan proses pengambilan

uang di ATM. Proses pertama diawali dengan customer memulai sesi pengambilan dan
diikuti permintaan Sistem ATM untuk memasukkan PIN. Jika seandainya customer
lupa PIN miliknya, proses akan dikembalikan ke sesi awal. Ketika PIN telah
dimasukkan, PIN akan diproses apakah benar atau tidak. Proses akan berlanjut jika PIN
benar dan akan kembali pada sesi ATM meminta nomor PIN customer. PIN yang telah
dimasukkan akan dikenali oleh bank. Proses berikutnya adalah ATM akan meminta
jumlah uang yang akan diambil. ATM akan memproses jumlah yang dimasukkan oleh
customer dan bank akan mengenali proses pengambilan uang tersebut. ATM,
kemudian, akan memproses pengambilan tersebut dan akan mengeluarkan uang sebesar
nilai yang dimasukkan oleh customer. Activity diagram sendiri lebih mendefinisikan
aliran aktivitas pada suatu sistem. Berbeda dengan use case diagram, activity diagram
menjelaskan proses yang saling berkaitan dan berurutan
C. Hasil dan pembahasan

Buat Object Oriented Analysis and Design (OOAD) untuk sebuah program yang
mempunyai fasilitas sebagai berikut:

a. Mencatat Nama Mata Kuliah, Jumlah SKS, dan nilai indeks prestasi (IP) per
semester
b. Menampilkan nilai IP persemester

Program ini dibutuhkan mahasiswa untuk memonitor nilai IPK mereka

1). Use Case Diagram

Use-case diagram dari program memonitor IP per semester merupakan

diagram yang digunakan untuk membuat model semua bisnis proses berdasarkan
perspektif pengguna sistem. Pada use case diagram ini terdapat simbol-simbol umum
yang perlu diperhatikan dikarenakan simbol ini merupakan syntax dari pembuatan
use case diagram. Pada use case digunakan yaitu simbol actor dan system,. Simbol
actor menggambarkan peran orang atau alat ketika berkomunikasi dengan use case
atau actor dalam program tersebut adalah mahasiswa, dosen dan staff akademik
 yang memiliki akses untuk login. Sistem merupakan Batasan system dalam relasi
yaitu simbol use case menggambarkan abstraksi dan interaksi antar sistem dan actor.
Sedangkan simbol association menggambarkan abstraksi dari penghubung antara
actor dengan use case. Mahasiswa memiliki akses untuk login, mencetak mata
kuliah dan jumlah sks, mencetak nilai indeks prestasi (IP) per semester, dan
pengisian nilai mata kuliah.

2). Activity Diagram

Activity diagram dari program memonitor IP per semester merupakan bentuk

visual dari alir kerja yang berisi aktivitas dan tindakan user dalam sebuah sistem
aplikasi. Diagram ini dibuat untuk menjelaskan aktivitas komputer maupun alur
aktivitas organisasi pengguna sistem. Pada activity diagram user yaitu titik awal yang
menunjukkan tempat dimulainya urutan tindakan aktivitas, simbol aktivitas yang
digunakan untuk menyatakan suatu tindakan, simbol join yang digunakan untuk
menunjukkan kegiatan yang dilakukan secara parallel, simbol titik akhir yang
menunjukkan tempat titik akhir dari urutan aktivitas yang ada, serta simbol swimlane
yang digunakan untuk menunjukkan ruang lingkup peran. Program tersebut berjalan
Ketika user (mahasiswa, dosen, atau staff akademik) melakukan log in, input nama
mata kuliah, input jumlah sks, input indeks prestasi (IP) per semester, mengedit nama
mata kuliah dan jumlah sks, lalu dosen melakukan pengisian nilai. Maka system akan
mencetak nama matakuliah, mengupdate nilai IP semester, menghitung IP, dan update
nilai IP.

3). Hasil Class-Diagram

Class Diagram Menggambarkan struktur statis class di dalam sistem. Class

merepresentasikan sesuatu yang ditangani oleh sistem. Pada class diagram ini terdapat
dua komponen MVC yaitu layout dan controller. Pada class diagram yang kita buat
terdapat 2 simbol yang digunakan yaitu class dan association. Class menunjukkan
himpunan dari objek-objek yang berbagi atribut serta operasi yang sama. Kelompok
atribut digunakan untuk mencatat variabel sedangkan elompok operasi untuk prosedur
dan fungsi. Association digunakkan untuk menghubungkan antara class satu dengan
class lainnya. Program ini menggunakan 4 buah class yang terdiri dari layout,
controller, SQLite_Interface, dan Database. Pada bagian layout digunakan untuk user
melihat tampilan, sedangkan pada controller didominasi oleh operasi dengan
menggunakan Bahasa java. SQLite_Interface berfungsi untuk menunjukkan hal yang
disimpan oleh database. Database merupakan tempat menyimpan data program
tersebut.
D. Kesimpulan

Pada praktikum kali ini membahas tentang konsep MVC dengan UML. Dari
praktikum yang sudah dilakukan maka dapat disimpulkan bahwa, Diagram UML
adalah sebuah bahasa standard untuk pengembangan sebuah software yang dapat
menyampaikan bagai mana membuat dan membentuk model-model, tetapi tidak
menyampaikan apa dan kapan model yang seharusnya dibuat yang merupakan salah
satu proses implementasi pengembangan software. Diagram-diagram UML yang
digunakan adalah Use Case Diagram, Activity Diagram, dan Class Diagram. MVC
adalah sebuah metode untuk membuat sebuah aplikasi dengan memisahkan data
(Model) dari tampilan (View) dan cara bagaimana memprosesnya (Controller). Dalam
implementasinya kebanyakan kerangka kerja (framework) dalam aplikasi web adalah
berbasis arsitektur MVC. MVC memisahkan pengembangan aplikasi berdasarkan
komponen utama yang membangun sebuah aplikasi seperti manipulasi data. Praktikum
ini membuat tiga diagram UML, yaitu use case diagram, activity diagram, dan class
diagram untuk pemonitoran IP per semester oleh mahasiswa.

E. Daftar Pustaka
Romi S. W. Dharwiyanti, Sri. 2003. Pengantar Unified Modeling Language (UML).
IlmuKomputer.Com.

Sutanto, Erwin, dan Endah Purwanti. 2017. Modul Praktikum Pemrograman

Komputer. Surabaya: Universtas Airlangga.
F. Lampiran
1. Link file UML
https://drive.google.com/drive/folders/1gOCjZ5knpCvkUtTaCUrOmN7Z_iTPBblj?us
p=sharing
2. Screenshot full