Ilovepdf - Teknologi Web Service

BAHAN MATERI
E-LEARNING
Mata Kuliah
TEKNOLOGI WEB
SERVICE
Fakultas Teknik & Informatika

UNIVERSITAS BINA SARANA INFORMATIKA
www.bsi.ac.id
E-Learning Universitas Bina Sarana Informatika Page |1
Copyright © September 2021
MINGGU KE I
KONSEP INTEROPERABILITAS, SISTEM TERDISTRIBUSI
Deskripsi:
Pembahasan konsep interoperabilitas dalam suatu jaringan untuk mendukung kapabilitas sebuah sistem TIK
untuk dapat berinteraksi dengan sistem lainnya. Manfaat yang dapat diberikan dari interoperabilitas dapat
menjadi pertimbangan untuk memaksimalkan sistem TIK disuatu organisasi/perusahaan/pemerintah.
Pembahasan juga dilengkapi contoh-contoh interoperabilitas eGovernment.
Tujuan Pembelajaran
Melalui pembelajaran, mahasiswa mampu
1. Mengingat kembali konsep jaringan komputer

2. Memahami dasar-dasar konsep interoperabiltas dan sistem terdistribusi
3. Memahami arsitektur web service sebagai layanan terdistribusi
4. Dapat memberikan contoh implementasi TIK dengan konsep interoperability dan terdistribusi dan
manfaatnya
Jaringan Komputer
Untuk membangun jaringan komputer yang baik pada sebuah perusahaan atau institusi, harus memiliki
kemampuan untuk mendukung berbagai jenis komponen jaringan baik Hardware maupun software dari
berbagai vendor. Dimana jaringan computer ini:
1. Dapat menangani kendala heterogenitas dan interoperabilitas.

2. Perlu acuan (referensi) bagi jaringan dan arsitektur jaringan (network architectures) yang memenuhi suatu
persyaratan spesifikasi tertentu.
Jaringan Komputer dapat mendukung konsep-konsep:
1. Open System
2. Scalability
3. Connectivity/interconnectivity
4. Interoperability
5. Ease of Implementation
6. Ease of Modification
7. Realiability
Interoperability
Suatu metode yang digunakan agar data dapat saling dikenali (undstable) antar computer (berlawanan
dengan proprietary) atau dikutip dari Kominfo Interoperabilitas adalah kapabilitas dari suatu produk atau
sistem –yang antarmukanya diungkapkan sepenuhnya –untuk berinteraksi dan berfungsi dengan produk atau
sistem lain, baik saat ini ataupun di masa mendatang, tanpa batasan akses atau implementasi.
(Interoperability Working Group) Misal: perrbedaan system operasi maupun bahasa-bahasanya.
Berdasarkan definisi tersebut, fokus interoperabilitas adalah kapabilitas sebuah sistem TIK untuk dapat
berinteraksi dengan sistem lainnya. Terkait dengan kasus pada paragraf sebelumnya, adanya konsep
interoperabilitasakan memungkinkan sistem yang sedang dikembangkan untuk menggunakan data yang
dimiliki oleh sistem yang sudahada, baik data dari sistem yang dimiliki oleh instansi yang sama, maupun
instansi yang berbeda.
Secara teknologi Interoperabilitas sendiri sebenarnya telah dikenal secara luas di Indonesia, namun karena
bersifat Back Engine Maka End User tidak begitu aware akan adanya Interoperabilitas ini. Di dunia perbankan,
pertukaran antar sistem Informasi ditunjukkan dalan bentuk pertukaran dana antar bank melalui Sistem
Informasi perbankan dan atau melalui ATM, hal yang sangat umum dilakukan masyarakatsehari-hari.
Sedangkan di Web, Interoperabilitas telah muncul dalam bentuk yang lebih kompleks, yaitu cloudcomputing.
Sebagai contoh, dengan Google API, kita dengan mudah memasukkan posisi pada Google map dan
menampikannya pada web kita, dimana ini adalah salah satucontoh interoperabilitas. Namun sedemikian
hebatnyapenetrasi teknologi pertukaran data antar sistem informasi ini,amat disayangkan bahwa ternyata
Sistem Informasi yang dikembangkan oleh pemerintahan di Indonesia sebagian besarsangat tidak
memperhatikan aspek Interoperabilitas ini.Selama ini kebanyakan Sistem Informasi yangdikembangkan oleh
instansi pemerintahan hanya dapatmemberikan manfaat secara lokal, terutama bagi satkerpemilik anggaran
pengembangan Sistem Informasi tersebut.Sebagai akibatnya, Informasi dasar yang ada pada suatu Sistem
Informasi (contoh : Informasi Kependudukan) seringkali menjadi redundan terhadap Sistem Informasi lain dan
tidak sinkron.
Akibat lainnya adalah sulitnya melakukan pertukarandata yang harus melalui proses pengkopian dan
penyesuaiandata yang panjang dan memakan waktu. Hal ini membuat Tata Sistem Informasi Kepemerintahan
di Indonesia carut marut dengan pulau-pulau sistem informasi yang tersebar dimana-mana.Meskipun
demikian, bukan tidak ada Sistem Informasi Kepemerintahan yang ternyata mendukung Interoperabilitas
dengan baik. Ambil contoh program National Single Window(NSW) yang dicanangkan pemerintah, datanya
mengambil dari Departemen
Perindustrian, Bea cukai, Dirjen Postel danbeberapa Instansi lainnya
Salah satu bentuk dari interoperability adalah interoperability government. Interoperabilitas

eGovernment(pemerintahan secaraelektronik) saat ini sudah menjadi salah satu kebutuhan utama dalam
sistem pemerintahan elektronik di Indonesia. Interoperabilitas mutlak diperlukan agar berbagai layanan
pemerintah yang terhubung ke jaringan (atau yang lebih dikenal sebagai eService)dapat berkomunikasi
secara efektif satu sama lain. Adanya komunikasi efektif tentu akan memberikan banyak manfaat bagi
seluruh pihak, baik bagi pemerintah maupun masyarakat umum.
Ada banyak manfaat yang dapat diberikan dari interoperabilitas khususnya pemerintahan, diantaranya
adalah:
1. Meningkatkan efisiensi kinerja aparat dan layanan pemerintahan.
2.Meningkatkan transparansi pemerintahan.
3.Membantu pemerintah dalam menentukan kebijakan.
4.Memudahkan pencarian informasi, baik untuk pemerintah maupun masyarakat.
Hal ini tidak terlepas dari perkembangan berbagai macam aplikasi Teknologi Informasi dan
Komunikasi (TIK) saat ini sudah merambah dalam berbagai sisi kehidupan. Hal ini terlihat dari semakin
banyaknya pengguna dan jenis alat-alat elektronik, seperti laptop, komputer, tablet, dan pad(atau yang
sering dikenal dengan nama lain tab). Perkembangan dan pemanfaatan TIK, khususnya di Indonesia,
tidak hanya terlihat pada kalangan industri dan swasta, namun juga dalam lingkungan pemerintahan.
Saat ini, sudah terdapat beberapa jenis aplikasi TIK yang digunakan untuk memenuhi dan membantu
berbagai kegiatan pemerintahan. Bahkan, hampir seluruh tingkat pemerintahan memiliki dan membangun
aplikasi mereka masing-masing, baik pemerintah di tingkat propinsi maupun kotamadya. Tentu
kecenderungan yang sama juga terlihat pada lembaga pemerintahan di tingkat pusat, seperti kementrian
dan badan keamanan nasional. Seluruh penerapan TIK ini, tidak lain dan tidak bukan, ditujukan untuk
membantu terwujudnya layanan dan pemerintahan yang baik, bersih, cepat,serta bersahabat.
Saat ini sudahada beberapa layanan pemerintah berbasis TIK yang sangat terasa manfaatnya bagi masyarakat
luas. Beberapa diantaranya adalah pendaftaran pasporyang tersambung ke jaringan (atau yang lebih dikenal
dengan istilah online), publikasi hibah dari Dikti pada situs web (atau yang lebih sering dikenal dengan nama
website) resmi Dikti, dan pengumuman penerimaan siswa baru untuk tingkat Sekolah Menengah Pertama
(SMP) dan Sekolah Menengah Atas (SMA) yang tersambung ke jaringan. Tersedianya layanan-layananseperti
inidapat membangun hubungan baik antara pemerintah dengan masyarakat. Sayangnya, sebagian,atau
hampir seluruh aplikasiaplikasi,pemerintahan tersebut tidak dapat berbicara dan berbagi data dengan
aplikasi lainnya. Padahal, sering kali ada dua atau lebih lembaga (baik milik pemerintah ataupun yang
bukan) membutuhkan data yang sama. Selain itu, tidak jarang suatu lembaga membutuhkan data yang
dimiliki lembaga lainnya, contohnya data kependudukan dan identitas penduduk yang dimiliki oleh
Dinas Kependudukan danCatatan Sipil. Data ini tentu dibutuhkan oleh seluruh lembaga pemerintah
lainnya, khususnya untuk memeriksa kebenaran status kewarganegaraan serta data pribadi lainnya.
Apabila sistem-sistem yang membutuhkan data tersebut dapat berkomunikasi secara otomatis dengan sistem
yang dimiliki Dinas Kependudukan dan Catatan Sipil, maka akan ada banyak proses administratif yang
dapat disederhanakan. Tentu saja hal tersebut akan secara langsung dapat mempermudah dan
mempercepat pekerjaan pegawai pemerintah dan juga masyarakat yang menggunakan layanan tersebut.
Ketika bicara mengenai TIK, bukanlah hal yang tidak mungkin untuk membuat dua sistem TIK saling
berbicara. Tentu saja perlu ada kesepahaman dan kesepakatan antara dua sistem tersebut, baik dalam
hal bahasa, data, maupun keamanan. Buku yang sedang Anda baca saat ini dapat membantu mencapai cita-
cita tersebut. Buku ini akan membantu Anda dalam menyusun, mendesain, dan mengembangkan
aplikasikegiatan pemerintahan yang dapat berbicara dengan aplikasi pemerintahan lainnya,yang tentu
saja, tanpa melupakan asas keamanan dan kerahasiaan.
Ketika kata interoperabilitas digunakan dalam buku ini, maka secara tidak langsung istilah eGovernmentjuga
harus terbawa, interoperabilitas e-Government. Istilah e-Governmentsendiri merupakan kependekan dari
electronic-Government, yang dapat diterjemahkan secara harfiah menjadi Pemerintahan (secara) Elektronik.
Istilah ini selalu diasosiasikan sebagai pemanfaatan TIK secara maksimal untuk meningkatkan efektifitas,
kinerja, danpelayanan pemerintah bagi masyarakat umum.Saat ini di Indonesia, e-Governmentbukanlah suatu
hal yang baru.
Beberapa contoh aplikasi layanan pemerintahan:
1. Registration
Sistem untuk pendaftaran wajib pajak secara online.Melalui sistem ini masyarakat dapat mengetahui
persyaratan yang diperlukan untuk menjadi wajib pajak dan melakukan pendaftaran secara online.
Kemudahan akses informasi dan pendaftaran seperti ini membuat proses registrasi secara offline(langsung
atau tatap muka) menjadi lebih cepat dan memperkecil peluang kesalahan yang mungkin dilakukan
Pengguna.Website: http://ereg.pajak.go.id
2. E-KTP
KTP Electronic-KTP (e-KTP) hak dari seluruh warga negara Indonesia. Pada e-KTP terdapatNomor Induk
Kependudukan (NIK), yaitu identitas tunggal setiap penduduk dan berlaku seumur hidup. Data
kependudukan ini disatukan dalam database kependudukan nasional.e-KTP diharapkan dapat menjadi
identitas tunggal, tidak dapat dipalsukan/digandakan, dan dapat digunakan sebagai kartu suara pada
Pemilu atau Pilkada. Website: http://www.e-ktp.com/
3. E-Procurement
Aplikasi TIK pengadaan secara elektronik yang dikembangan oleh LKPP (Lembaga Kebijakan Pengadaan
Barang/Jasa Pemerintah) merupakan contoh dari aplikasi jenis ini. LKPP menggunakan aplikasi tersebut
untuk e-Tendering, e-Purchasing, dan e-Audit. Website:
http://www.lkpp.go.id/v2/content.php?mid=8474545499
4. KPK Whistle
Fasilitas dari KPK dalam rangka menarik partisipasi masyarakat untuk turutmemberantas korupsi di
lingkungannya. Pada sistem ini, seseorang dapat melaporkan tindak korupsi yang ia ketahui. Website:
http://kws.kpk.go.id/
5. SISNI
Sistem ini dikembangkan untuk membantu pembuatan Standar Nasional Indonesia (SNI) dan juga
memfasilitasi e-balloting. Sistem ini memungkinkan para penggunanya untuk mengirimkan dokumen
elektronik dan memberikan komentar terhadap dokumen tertentu secara elektonik.Website:
http://websisni.bsn.go.id/
Dari contoh diatas terlihat jelas bahwa selain dikembangkan untuk tujuan yang berbedabeda, aplikasi-aplikasi
tersebut juga dikembangkan oleh instansi pemerintah yang berbeda. Artinya, data yang tersimpan dan
digunakan oleh aplikasi tersebut sangat beraneka ragam. Umumnya, hanya instansi pengembang aplikasi yang
akan mendapatkan hak eksklusif terhadap data tersebut. Hal ini tentu sangat dapat dipahami, mengingat
besarnya biaya dan waktu yang dihabiskan untuk membangun dan mengumpulkan seluruh data yang
dibutuhkan aplikasi tersebut. Namun, tidak jarang juga diantara aplikasi-aplikasi tersebut ada yang
membutuhkan data yang sudah dimiliki oleh aplikasi lainnya. Sayangnya, sang pengembang aplikasi tidak tahu
bahwa data yang ia butuhkan sebenarnya sudah tersedia. Pada kondisi seperti inidapat dipastikan para
pengembang akan memilih untuk mengumpulkan data dari awal lagi. Keputusan ini secara langsung akan
mempengaruhi biaya pengembangan aplikasi. Tentu saja, dilihat dari sisi apapun, hal tersebut merupakan
penyia-nyiaan sumber daya.
1. Konsep Kompatibilitas
Membicarakan konsep kompabilitas maka yang dibicarakan adalah kecocokan antara satu sistem dengan
sistem lainnya. Kecocokan disini dapat saja berfokus pada struktur dan jenis data, bahasa pemrograman
yang digunakan, atau hal-hal lain yang disepakati para pengembang sistem. Pada Gambar dibawah terlihat
bahwa Sistem C dapat berkomunikasi dengan Sistem D dan Sistem A dapat berkomunikasi dengan Sistem
B. Namun, antara Sistem A dengan Sistem C atau Sistem A dengan Sistem D tidak dapat berkomunikasi.
Kompatibilitas tidak dapat menjamin bahwa setiap sistem dapat memanfaatkan sumber daya yang dimiliki
sistem lainnya.
Sumber: KOMINFO, Strategi Integrasi Data Melalui Konsep Interoperabilitas Sistem Elektronik, 2017
2. Konsep Interoperabilitas
Setiap sistem diharapkan dapat memanfaatkan data milik sistem lainsecara optimal. Jika Anda perhatikan,
pada Gambar dibawah ini terlihat bahwa yang memungkinkan terjadinya hal tersebut adalah standar
interoperabilitas. Perhatikan juga bahwa baik sistem A, B, C, maupun D memasukan standar operabilitas
sebagai bagian dari sistem. Hal ini sangat berbeda dengan konsep kompatibilitas. Tentu saja, penggunaan
teknik interoperabilitas akan lebih mudah diimplementasikan, terutama untuk pengembangan sistem-
sistem TIK baru lainnya.
Sumber: Direktorat E‐Government Ditjen. Aplikasi Informatika Kementerian Komunikasi Dan Informatika,
2017
Fokus Pengembangan Interoperabilitas di pemerintahan, yaitu:
1. G2B
2. G2Org
3. G2C
4. G2G
5. G2OG
Sumber: KOMINFO, Strategi Integrasi Data Melalui Konsep Interoperabilitas Sistem

Elektronik, 2017
Teknik interoperabilitasakan memberikan efek positifdalamjangka panjang.

Interoperabilitasmemungkinkan suatu sistem untuk memanfaatkan data yang dimiliki oleh sistemsistem
lainnya. Pada panduan yang dikeluarkan oleh United Nations Development Programme(UNDP) (United
Nations Development Programme, 2007)disebutkanpaling tidak ada lima fokus pengembangan
interoperabilitassistem pemerintahan, yaitu:
1. Government-to-Government(G2G)
Pengembangan interoperabilitas G2Gberfokus pada membangun jalur komunikasi digital antara sistem
pemerintahan dengan sistem pemerintahan lainnya. Hal ini termasuk sistem pemerintahan yang berasal
dari lembaga yang sama, berbeda lembaga, atau antara pemerintah pusat dengan pemerintah daerah.
2. Government-to-Business(G2B)
Pengembangan interoperabilitasini berfokus pada membangun jalur komunikasi digital antara sistem
pemerintahan dengan sistem yang dikembangkan oleh/berhubungan dengan dunia bisnis dan industri.
Pengembangan difokuskan untuk mempermudah dan meningkatkan kualitas layanan pemerintah untuk
kalangan bisnis dan industri.
3. Government-to-Citizens(G2C)
Pengembangan interoperabilitasini berfokus pada pembangunanjalur komunikasi digital antara sistem
pemerintahan dengan sistem yang dibangun oleh masyarakat, atau antara sistem pemerintahan dengan
sistem pemerintahan lainnya guna memberikan layanan terbaik kepada masyarakat.
4. Government-to-Organizations(G2Org)
pemerintahan dengan sistem yang dikembangkan oleh organisasi non-pemerintah.
5. Government-to-Other-Governments(G2OG)
pemerintahan di suatu negara dengan sistem pemerintahan di negara lain. Fokus interoperabilitasseperti
ini sudah diterapkan pada negara-negara di Eropamelalui European Interoperability Strategydan European
Interoperability Framework.
Sistem Terdistribusi
Defenisi system terdistribusi:
a. Sebuah sistem yg komponennya berada pada jaringan komputer. Komponen tersebut saling
berkomunikasi dan melakukan koordinasi hanya dgn pengiriman pesan (message passing).
b. Sebuah sistem terdistribusi (DS) terdiri dari sekumpulan komputer yang mandiri yang terhubung dalam
jaringan komputer dan dilengkapi dengan software sistem terdistribusi
(Colouris 1994)
c. Software Sistem Terdistribusi dapat mengkoordinir aktifitas masing-masing komputer dan melakukan
pertukaran sumber daya sistem HW, SW dan data.
Sistem Terdistribusi dibutuhkan dengan beberapa alasan yaitu:
1. Performance
Sekumpulan prosesor dapat menyediakan kinerja yang lebih tinggi daripada komputer yang terpusat
2. Distribution
Banyak aplikasi yang terlibat, sehingga lebih baik jika dipisah dalam mesin yang berbeda
(contoh: aplikasi perbankan, komersial)
3. Reliability
Jika terjadi kerusakan pada salah satu mesin, tidak akan mempengaruhi kinerja system secara keseluruhan
4. Incremental Growth
Mesin baru dapat ditambahkan jika kebutuhan proses meningkat
5. Sharing Data/Resource Resource adalah:

– Segala hal yang dapat digunakan bersama dalam jaringan komputer.
- Meliputi hardware (e.g. disk, printer, scanner), juga software (berkas, basis data, obyek data).
6. Communication
Menyediakan fasilitas komunikasi antar manusia
Contoh sistem terdistribusi:
Internet, merupakan suatu bentuk jaringan global yang menghubungkan komputer dengan satu sama lainnya,
yang dapat berkomunikasi dengan media IP sebagai protokol.
Sumber: Budi Susanto, Pengantar Sistem Terdistribusi
Intranet
● Jaringan yang teradministrasi secara lokal

● Biasanya proprietary
● Terhubung ke internet (melalui firewall)
● Menyediakan layanan internal dan eksternal
Sistem terdistribusi multimedia.

Biasanya digunakan pada infrastruktur internet
Karakteristik
Sumber data yang heterogen dan memerlukan sinkronisasi secara real time
Video, audio, text Multicast Contoh:
- Teleteaching tools, Video-conferencing, Video and audio on demand
Mobile dan sistem komputasi ubiquitous

Sistem telepon Cellular (e.g., GSM)
Resources dishare : frekuensi radio, waktu transmisi dalam satu frekuensi, bergerak. Komputer laptop,
ubiquitous computing. Handheld devices, PDA, etc
5. World wide web

Arsitektur client/server tebuka yang diterapkan di atas infrastruktur internet
Shared resources (melalui URL)

MINGGU KE II
PENGENALAN WEB SERVICE
Deskripsi
Materi membahas contoh-contoh implementasi web service yang sudah digunakan oleh
masyarakat. Untuk mengenal lebih jauh tentang layanan web service eksplorasi pembahasan
tentang jenis web service dan manfaatnya, teknologi web service, arsitektur web servis,
operasi web service, keuntungan web service.
Tujuan Pembelajaran
Dengan mengikuti pembelajaran ini, mahasiswa mampu:
1. Mengenal berbagai layanan web service ditengah-tengah masyarakat
2. Memahami layanan webservice, mampu melatih pembuatan layanan web service
3. Melatih atau mencoba membuat layanan web service XMl,SOAP, WSDL
A. Pengenalan Web Service

Selama ini mungkin Anda pernah atau bahkan sering mendengar mengenai
Web Service. Sebenarnya apakah Web Service itu ? Samakah Web Service dengan
Website ?
Web Service ternyata sangat berbeda dengan website. Perbedaan yang
paling terlihat adalah Website dibuat untuk memiliki tampilan atau user interface
yang bagus sedangkan Web Service tidak memiliki tampilan. Mengapa Web Service
tidak memiliki tampilan (user interface) ?
Web Service adalah Sebuah aplikasi lintas platform yang dapat diakses
melalui jaringan (intranet dan internet ) dimana dalam aplikasi tersebut menyediakan
berbagai fungsi dengan tujuan digunakan untuk interaksi aplikasi satu dengan
aplikasi yang lain. Web service dapat diartikan juga sebuah metode pertukaran data,
tanpa memperhatikan dimana sebuah database ditanamkan, dibuat dalam bahasa
apa, sebuah aplikasi yang mengkonsumsi data, dan di platform apa sebuah data itu
dikonsumsi. Web service mampu menunjang interoperabilitas. Sehingga web service
mampu menjadi sebuah jembatan penghubung antara berbagai sistem yang ada.
1
Web pada umumnya digunakan untuk melakukan respon dan request yang
dilakukan antara client dan server.
Sebagai Contoh :
Implementasi Web Service adalah sistem login seperti yang ada di Kaskus,
atau Detik.com.
Jika Anda mengunjungi Kaskus, maka Anda akan menjumpai sistem login
yang dapat menggunakan akun Facebook, Yahoo maupun Twitter.
Dengan kata lain, Anda dapat bergabung dalam komunitas forum Kaskus
atau istilah kerennya Kaskuser hanya dengan memiliki akun FB, Yahoo atau Twitter
tanpa harus registrasi di dalam Kaskus nya sendiri.
Contoh lain implementasi Web Service adalah di bagian komentar Detik.com.
Setiap kali kita akan mengisi komentar di Detik.com, kita bisa menggunakan akun
FB kita.
Nah... yang menjadi pertanyaan adalah, kok bisa ya kita masuk ke dalam
sistem Kaskus maupun Detik.com menggunakan akun lain seperti FB, Yahoo
maupun Twitter? Ya... ini karena FB, Yahoo dan Twitter menyediakan service yang
memungkinkan sistem lain menggunakan akun mereka untuk login. Dan... kebetulan
Kaskus dan Detik.com ini memanfaatkan service tersebut. Dalam kasus ini, FB,
Yahoo, dan Twitter dikatakan bertindak sebagai server sedangkan Kaskus dan
Detik.com bertindak sebagai client. Lihat gambar di bawah ini.
Contoh lain, buat Anda yang memang sudah memiliki perangkat ponsel
Android, mungkin sudah pernah menginstall aplikasi semacam detik.com,
kompas.com atau vivanews.com, dimana Anda bisa melihat berita dari situs
detik.com di ponsel Android Anda.
2
Pertanyaannya ? Apakah portal-portal tersebut dalam membuat aplikasi
portal versi Android juga membuat database/data beritanya? Apakah mereka
melakukan pengimputan data berita dua kali ? yaitu versi web dan versi android ?
Jawabannya sudah pasti tidak, karena mereka pasti telah menggunakan
layanan web service untuk pertukaran data pada dua versi aplikasi yang mereka
buat.
Jadi apakah Web Service itu ? secara singkat Web Service adalah aplikasi
yang dibuat agar dapat dipanggil atau diakses oleh aplikasi lain melalui
internet dengan menggunakan format pertukaran data sebagia format
pengiriman pesan. Adapun yang biasa dipakai adalah format pertukaran data
dengan XML dan JSON.
Lalu, bagaimana caranya memanggil atau memanfaatkan sebuah Web
Service ? sebuah web service dapat dipanggil oleh aplikasi lain dengan
menggunakan bantuan HTTP (Hypertext Transfer Protocol). Web service juga
memungkinkan untuk dipanggil dengan menggunakan protocol lain seperti SMTP
(Simple Mail Transfer Protocol), namun yang paling umum digunakan HTTP.
Karena web service menggunakan protokol HTTP, tentu PHP sebagai bahasa
pemograman web menjadi salah satu kekuatan dalam bahasa pemograman yang
mengelola web service. Meski banyak teknik dan metode untuk menghasilkan web
service dengan PHP.
B. Jenis-Jenis Web Service Berdasarkan Manfaat
• Reusable application-components
Jenis web service yang dimanfaatkan secara periodik atau berulang-ulang.
3
Contoh : layanan konversi mata uang, info cuaca, penterjemahan bahasa dll,
seperti contoh gambar dibawah ini
• Connect existing software

web service dapat dimanfaatkan untuk mengintegrasikan antar berbagai
aplikasi yang berbeda.
Contoh: aplikasi traveling diintegrasikan dengan aplikasi pemesanan hotel,
wisata, rental kendaraan dll meskipun dengan platform, lokasi dan
pemrograman yang berbeda.seperti contoh gambar dibawah ini
4
C. Teknologi Pendukung Web Service
Dalam pengoperasiannya, Web Service menerapkan empat komponen /
teknologi yang mendukung kinerjanya. 5 (Lima) komponen tersebut adalah :
a) XML (Extensible Markup Language) merupakan standar untuk markup
dokumen yang disahkan oleh W3C (World Wide Web Consortium). XML
mendefinisikan sintaks yang umum digunakan untuk markup data secara
sederhana. XML menyediakan format standar untuk dokumen komputer.
Format ini cukup fleksibel untuk disesuaikan dengan domain yang beragam
seperti website, pertukaran data elektronik, grafik vektor, hierarki, serialisasi
objek, Remote Procedure Call (RPC), dan sistem voice mail (Harold dan
Means, 2002). XML merupakan bagian penting bagi pengembang yang ingin
membangun web service. XML berbasis teks, sehingga bersifat platform
independent. Sifat ini membuat pertukaran data antar platform menjadi
mungkin.
Contoh Dokumen XML :
<?xml version="1.0" encoding="utf-8" ?>
<karyawan instansi="UBSI">
<nama>Rachmat Hidayat, M.Kom</nama>
<nik> </nik>
<jabatan>Staf Akademi</jabatan>
<status>Tetap</status>
<alamat>Tangerang</alamat>
</karyawan>
b) SOAP (Simple Object Access Protocol) adalah sebuah protokol berbasis XML
dengan komunikasi bergaya RPC (Remote Procedure Call) yang
menyediakan cara standar untuk memaketkan pesan (Chappell dan Jewell,
2002). SOAP mendefinisikan cara dalam pembungkusan (encapsulation) dan
pertukaran (exchange) pesan.
Dokumen XML yang terdiri dari komponen:
1. SOAP Envelope, mengidentifikasi dokumen XML sebagai SOAP
message
2. Elemen Header (opsional)
3. Elemen Body, berisi informasi pemanggilan dan responsnya
5
4. Elemen Fault (opsional), berisi error yang terjadi saat pemanggilan
diproses
Contoh Dokumen SOAP Message Dokumen XML yang terdiri dari

komponen:
<?xml version="1.0"?>
<soap:Envelope xmlns:soap=" envelope" soap:encodingStyle="
encoding">
<soap:Header>....</soap:Header>
<soap:Body>
<soap:Fault>.......</soap:Fault>
</soap:Body>
</soap:Envelope>
c) Web Service Description Language (WSDL) adalah sebuah dokumen dalam
format XML yang isinya menjelaskan informasi detail sebuah Web Service. Di
dalam WSDL dijelaskan method-method yang tersedia dalam web service,
parameter apa saja yang diperlukan untuk memanggil sebuah method, dan
hasil atau tipe data yang dikembalikan oleh method yang dipanggil.
FORMAT WSDL
Elemen <portType>
Mendefinisikan nama web service, <definitions>
operasi- operasi yang dilakukan, dan <types> … </types>
message yang terlibat <message> … </message>
<portType> … </portType>
Elemen <message>
<binding> … </binding>
Mendefinisikan message yang
</definitions>
digunakan oleh web service
Elemen <binding>
Mendefinisikan protokol komunikasi
yang digunakan
Elemen <type>
Mendefinisikan tipe-tipe data yang
6
digunakan
d) Service Publication and Discovery (UDDI), Universal Description, Discovery

and Integration (UDDI) adalah suatu directory service yang digunakan untuk
meregistrasikan dan mencari Web Service.
e) Common Internet Protocols (HTTP, TCP/IP). Dalam hal ini, HTTP maupun
TCP/IP berperan sebagai common internet protocol yang berfungsi sebagai
transport layer.
D. Arsitektur Web Service
Arsitektur mendeskripsikan struktur: Menurut (Bassetal.1998), Arsitektur

dari sistem perangkat lunak (software) terdiri dari strukturnya, dekomposisinya ke
dalam komponen-komponen, dan interface dan hubungannya.
Arsitektur menjelaskan aspek statis dan dinamis dari sistem software
sehingga dapat diperkirakan rancangan bangunan (building design) dan diagram alir
(flow chart) bagi suatu produk software.
Web service memiliki 3(tiga) entitas dalam arsitekturnya, yaitu:
1. Service Requester (peminta layanan)
merupakan aplikasi yang bertindak sebagai klien dari Web Service yang
mencari dan memulai interaksi terhadap layanan yang disediakan
2. Service Provider/Broker (penyedia layanan)
merupakan pemilik Web Service yang berfungsi menyediakan kumpulan
operasi dari Web Service.
3. Service Registry (daftar layanan)
7
merupakan tempat dimana Service provider mempublikasikan layanannya.
Pada arsitektur Web Service, Service registry bersifat optional. Teknologi web
service memungkinkan kita dapat menghubungkan berbagai jenis software
yang memiliki platform dan sistem operasi yang berbeda.
Bagaimana Web Service Beroperasi?

Sisi Server: Sisi Client:
 Membuat fungsi utama/core function  Mencari service melalui UDDI
 Membuat service wrapper berupa XML-  Mengambil service description file berupa
RPC atau SOAP WSDL atau instruksi XML-RPC
 Membuat deskripsi service berupa  Membuat klien XML-RPC atau SOAP
WSDL atau instruksi integrasi XML-RPC (dapat berupa fungsi lokal atau pesan
(memuat semua method public, XML untuk dikirim → berdasarkan
argumen dan return valuenya); plus WSDLnya)
dokumentasi yang human readable  Memanggil remote service tersebut
 Deploy (rilis) service

 Daftarkan service tersebut melalui UDDI
agar discoverable
E. Operasi-Operasi Web Service
Secara umum, web service memiliki 3(tiga) operasi yang terlibat di dalamnya, yaitu:
1. Publish/Unpublish: Menerbitkan/menghapus layanan ke dalam atau dari
registry.
2. Find: Service requestor mencari dan menemukan layanan yang dibutuhkan.
8
3. Bind: Service requestor setelah menemukan layanan yang dicarinya, kemudian
melakukan binding ke service provider untuk melakukan interaksi dan
mengakses layanan/service yang disediakan oleh service provider.
F. Keuntungan Menggunakan Web Service

a. Web Service menyediakan interoperabilitas antar berbagai aplikasi perangkat
lunak yang berjalan pada platform yang berbeda.
b. Web Service menggunakan standard dan protocol yang bersifat terbuka.
c. Web service mengijinkan penggunaan kembali service dan komponen didalam
suatu infrastruktur.
d. Web service dapat secara bebas digunakan (loosely coupled) dengan demikian
memudahkan suatu pendekatan terdistribusi ke peintegrasian aplikasi
G. Keuntungan Menggunakan Web Service
a. Karakteristik standard Web Service saat ini masih dalam tahap perkembangan
awal dibandingkan open standard komputer terdistribusi yang lebih matang
seperti CORBA. Ini nampaknya akan merupakan suatu kerugian yang temporer
ketika kebanyakan vendor sudah merasa terikat dengan standard OASIS untuk
menerapkan Mutu dari aspek service dari produk mereka.
b. Web Service dapat saja memiliki performance/kinerja yang lemah dibandingkan
dengan pendekatan komputasi terdistribusi lain seperti RMI, CORBA, atau
DCOM. Ini merupakan suatu trade-off yang umum ketika memilih format yang
text-based. XML dengan tegas tidak menghitung antar tujuan disain-nya baik
singkatan dari penyandian maupun efisiensi dari uraian. Ini bisa berubah dengan
standard XML Infoset, yang menguraikan bahasa yang XML-based dalam kaitan
dengan hal-hal yang abstrak (unsur-unsur, atribut, logika bersarang). Penyajian
angle-bracket (< >) secara tradisional kini dilihat sebagai suatu serialisasi ASCII
(atau Unicode) dari XML, bukan XML itu sendiri. Pada model ini, serialisasi biner
adalah suatu alternatif yang sama yang sah. Penyajian biner seperti SOAP
MTOM menjanjikan untuk meningkatkan efisiensi wire dari XML messaging.
9
MINGGU KE III
PEMROGAMAN BERORIENTASI OBJEK
Deskripsi
Materi pemrograman berorientasi objek memadukan teori dan praktik melalui case study dalam
kehidupan nyata, mulai dari konsep dasar pemrograman OOP meliputi class, abstraction, inheritance,
encapsulasi, polimorphism.
Tujuan Pembelajaran
Setelah mahasiswa mempelajari dan mempraktikan materi OOP dengan metode pembelajaran case
study, mahasiswa mampu memahami, menerapkan dan implementasi OOP dalam bahasa pemrograman
dart sehingga mahasiswa memiliki kemudahan pemahaman saat menggunakan bahasa pemrograman
pada skala besar (framework flutter) yang berorientasi pada OOP. Lebih spesifik, mahasiswa memiki
kemampaun
C. Konsep Dasar Pemrograman Berorientasi Objek
Metodologi berorientasi objek adalah suatu strategi pembangunan perangkat lunak yang
mengorganisasikan perangkat lunak sebagai kumpulan objek yang berisi data dan operasi yang
diberlakukan terhadapnya. Metodologi berorientasi objek merupakan cara bagaimana sistem perangkat
lunak yang dibangun melalui pendekatan objek secara sistematis. Metode berorientasi objek didasarkan
pada penerapan prinsip-prinsip pengelolaan kompleksitas. Metode berorientasi obek meliputi rangkaian
aktifitas:
1. Analisis berorientasi objek
2. Perancangan berorientasi objek
3. Pemrograman berorientasi objek
4. Pengujian berorientasi objek
Pendekatan berorientasi objek akan memandang sistem yang dikembangkan sebagai suatu
kumpulan objek yang berkoresponden dengan objek-objek dunia nyata. Ada banyak cara untuk
mengabtrasikan dan memodelkan objek-objek tersebut, mulai dari abstraksi objek, kelas, hubungan antar
kelas sampai dengan abstraksi sistem. Saat mengabstrasikan dan memodelkan objek, data dan proses-
proses yang dipunyai oleh obyek akan dienkapsulasi (dibungkus) menjadi satu kesatuan.
Pemrograman berorientasi objek sebuah tata cara pembuatan program (programming paradigm)
dengan menggunakan konsep “objek”, dimana objek ini bisa memiliki data (dikenal dengan istilah atribut)
1
dan kode program dalam bentuk prosedur (dikenal dengan istilah method). Dalam teori pemrograman,
terdapat 3 prinsip dasar yang melandasi pemrograman berorientasi objek, yakni encapsulation,
inheritance dan polymorphism. Pada modul ini akan fokus pada pemrograman berorientasi objek
B. Best Practice OOP Bahasa Pemrograman Dart
Review konsep OOP dari mata kuliah Metode Perancangan Program
1. Objek (Object)
a. Objek adalag representasi sebuah entitas yang memiliki makna tertentu yang menjadi perhatian
sipemandang.
b. Segala sesuatu yang ada di dunia adalah objek. Cth : Manusia, Bunga, Hewan, Mobil, Meja, Kursi,
Sepeda, Kereta, Pesawat terbang, dll.
c. Setiap sistem terdiri dari objek-objek (sistem juga termasuk objek).
d. Evaluasi & pengembangan sistem disebabkan oleh interaksi antara objek-objek di dalam atau di
luar sistem.
2. Kelas (Class)
a. Merupakan template untuk membuat obyek. merupakan prototipe/blue prints yang
mendefinisikan variable-variabel dan method –method secara umum
b. Objek (instances) merupakan hasil instansiasi dari suatu kelas, proses pembentukan obyek dari
suatu class disebut dengan instantiation.
c. Analogi hubungan antara class dan objek seperti gambar dibawah
3. Atribut dan metod

a. Atribut adalah data yang membedakan antara objek satu dengan yang lain. Contoh atribut mobil
: manufaktur, model, warna, jumlah pintu, ukuran engine, kecepatan dll
b. Dalam class, atribut disebut sebagai variabel.
c. Instance variable
- adalah atribut untuk tiap obyek dari class yang sama.
- Tiap obyek mempunyai dan menyimpan nilai atributnya sendiri.
- Jadi tiap obyek dari class yang sama boleh mempunyai nilai yang sama atau beda
d. Class variable
- adalah atribut untuk semua obyek yang dibuat dari class yang sama.
- Semua obyek mempunyai nilai atribut yang sama.
- Jadi semua obyek dari class yang sama mempunyai hanya satu nilai yang value nya sama.
e. Tingkah laku/behavior adalah hal-hal yang bisa dilakukan oleh objek dari suatu class.
2
f. Behavior dapat digunakan untuk mengubah nilai atribut suatu objek, menerima informasi dari
objek lain, dan mengirim informasi ke obyek lain untuk melakukan suatu task.
g. Dalam class, behavior disebut juga sebagai method
h. Method adalah serangkaian statements dalamsuatu class yang menghandle suatu task tertentu.
i. Cara objek berkomunikasi dengan objek lain adalah dengan menggunakan method.
C. Best Practice OOP Bahasa Pemrograman Dart
1. Persiapan:
a. Pastikan perangkat komputer mahasiswa terinstall editor Visual Studio Code
b. Siapkan folder misal -> D:\Projek_TWS\OOP_Dart
2. Aktifkan editor Visual Studio Code
3. Langkah awal persiapan pemrograman OOP
3
View akhir screen dari langkah 1-7
Hapus script tersebut
4
Oop_dart.dart pada folder bin adalag program
utama
Setup berikutnya membuat file class.dart pada folder lib, perhatikan pada gambar
Pastikan file class.dart berada pada folder library
Cara pembuatan class.dart:
Klik kanan pada lib, new, ketikan : class.dart
5
View editor sudah terlihat dua file dart, artinya best practice OOP akan
berkerja menggunakan dua file tersebut
oop_dart.dart (difolder bin) -> sbg program utama
class.dart (difolder lib) -> sebagai library class
4. Tahapan Praktikum Pemograman berorientasi objek
Case study u praktikum OOP adalah
Polymorphism Encapsulation
Dart OOP
Classes
(Manusia)
Mahasiswa
Inheritance Abstraction
Sumber :
https://subscription.packtpub.com/book/mobile/9781788996082/2/ch02lvl1sec06/introduction-to-
oop-in-dart
6
Source output
1. Menciptakan class Manusia di file class.dart
Penjelasan
var programmer = new Manusia()
Membuat object dari class Manusia yang disimpan

dalam variabel programmer, dengan kata lain, variabel
programmer adalah sebuah object dari class Manusia
2. Mengakses class Manusia dilakukan pada program utama (oop_dart.dart),

aktifkan tab oop_dart.dart dan tambahkan script sesuai gambar.
Sejauh ini tidak ada error, run menggunakan fitur Run|Debug
7
Case study: programmer itu manusia dan bisa melakukan makan nasi
sehingga output yang diharapkan sebagai berikut
Tambahkan script pada program utama (oop_dart) seperti pada gambar

Output diatas belum sempurna, karena tidak diketahui
programer nya siapa. Saatnya kita kembangkan
misalnya programmernya Fauko Misalam. Output yang
diharapkan
Fauko Misalam makan nasi
programmer.makan(); objek programmer memanggil method makan()
Case study: Fauko Misalam sebagai programmer dan dapat melakukan maka nasi,
maka pengembangan scriptnya pada class.dart seperti gambar
1. Tambahkan konstruktor
Manusia (nm)
2. Tambahkan $nama pada string

makan nasi
8
Akan ditemukan problem seperti gambar diatas dan untuk mengatasi tambahkan
script pada oop_dart.class. yang ditambahkan Fauko Misalam pada baris var
programmer seperti pada gambar dibawah
Output
Setelah ditambahkan sudah tidak error, save dan silahkan Run
9
Case study yang akan dikembangkan melalui konsep bahwa manusia ada yang
menjadi programmer, pedang, dokter, guru, dosen dan lain-lain. mereka memiliki
pola yang sama dapat melakukan makan nasi, dan masing juga memiliki nama.
Output yang diharapkan seperti pada kolom sebelah kanan.
Keywordnya:
1. Dengan memahami script yang sudah dipraktika, tentu mahasiswa bisa
mengembangkan untuk mendapatkan output yang diinginkan
2. Mahasiswa cukup mengembangkan coding sebelumnya pada oop_dart.dart

3. Yang perlu diingat adalah Ketiganya adalah Manusia (Fauko sebagai
programmer, Intan sebagai dosen, dan Dio sebagai hacker) semua melakukan
makan nasi
5. Inheritance
Mereview mata kuliah Metode Perancangan Program, Inheritance adalah class dapat menurunkan metode-metode dan properti-properti
yang dimilikinya pada kelas lain. Kelas yang mewarisi metode dan properti dari objek lain dinamakan kelas turunan. Kelas turunan ini mampu
mengembangkan metode sendiri. Berikut case study implementasi inheritance OOP pada bahasa Dart.
10
Source Output
1. Tambahkan inheritance pada

class.dart
11
2. Lakukan modifikasi seperti pada
gambar pada oop_dart.dart
Lakukan save dan Run
Output
Kesimpulan:
Inheritance pembuataanya seperti membuat class pada umumnya, namun yang perlu
diperhatikan penggunakan reserved word extends. class ManusiaMilenial extends
Manusisa, bahwa class ManusiaMilenial akan mewarisasi karakteristik dari class Manusia
12
6. Encapsulation
Review materi mata kuliah Metode Perancangan Program, Enkapsulasi atau pembungkusan berfungsi untuk melindungi suatu objek dari
dunia luar, sehingga seseorang tidak akan mampu merusak objek yang terbungkus. Objek yang terbungkus dalam suatu kelas baik data maupun
fungsinya tidak bisa terlihat apalagi dirubah pada saat objek digunakan. Struktur class yang dimaksud adalah property dan method. Dengan
enkapsulasi, kita bisa membuat pembatasan akses kepada property dan method, sehingga hanya property dan method tertentu saja yang bisa
diakses dari luar class. Proses enkapsulasi diterapkan dengan menggunakan 3 jenis hak akses: Public, Protected dan Private. Case study dari
inheritance akan dikembangkan implementasi enkapsulasi dengan bahasa pemrograman Dart.
Source Output
Setiap class memiliki berbagai atribut atau properti sesuai dengan kebutuhan dalam membangun suatu sistem. Ada kalanya atribut tersebut
tidak diperbolehkan untuk diakses oleh siapapun karena bersifat private. Dari contoh yang sudah dipraktikan atribut nama pada class Manusia
bersifat public, begitu juga atribut email dari class ManusiaMilenial bersifat public, artinya baik nama dan email dapat diakses oleh objek
lainnya. Case study: akan kita tambahkan atribut password di kelas class ManusiaMilenial. Dalam kehidupan sehari-hari, tentunya password
bersifat rahasia atau private. Berikut implementasi enkapsulasi.
u/ menambahkan atribut bersifat private dengan menuliskan

_password. Diawali dengan underscore
13
Untuk melakukan pengujian, akan dilakukan dua percobaan dengan memodifikasi sebagai berikut:
1. pada oop_dart.dart lakukan penambahan scriptnya mengakses atribut nama dan emai di class.dart seperti pada gambar
Script tersebut object programmer

mengakses atribut nama, email tidak
terjadi error karena kedua atribut
tersebut bersifat public
14
2. akan ditambahkan scipt pada oop_dart mengakses atribut _password, seperti pada gambar
Dengan penambahan scriptnya akses atribut _password terjadi error

(perhatikan gambar disamping)
Kesimpulannya karena _password bersifat private (hanya bisa

diakses di dalam class Manusia
Dan tidak bisa diakses diluar kelas
15
7. abstraction/ abstraksi
Review mata kuliah Metode Perancangan Program bahwa Abstraksi adalah proses penyembunyian kerumitan dari suatu proses untuk
permasalahan yang dihadapi, atau dengan kata lain kelas abstrak adalah kelas yang tidak dapat dibuat objeknya (di instans), tujuan dari kelas
abstrak adalah sebagai superclass (kelas awal) untuk kelas lainnya.
Source code Output

Untuk menerapkan abstraction pada bahasa pemrograman dart, case study menggunakan program sebelumnya dengan melakukan
penyesuaian melalui file class/dart dengan tahapan sebagai berikut:
1. Deklarasi abtract class
Di dalam abstract class Society, tambahkan script dari
method/function (void makan()) void makan
16
Lakukan perubahan class Manusia
Menjadi
Class Manusia extends Society
17
2. Hasil penyesuain keseluruhan dari abtract class Society
3. Tahap akhir Run
18
8. Polymorphism/Polimorfisme
Merujuk pada materi Metode Perancangan Program, Polimorfisme dapat diartikan sebagai kemampuan suatu bahasa pemrograman untuk
memiliki fungsi-fungsi atau metode yang bernama sama tetapi berbeda dalam parameter dan implementasi kodenya (overloading). Jadi fokus dari
Polymorphism/Polimorfisme adalah membuat kelas turunan dapat menggunakan fungsi yang ada pada kelas pewarisnya dan dapat
mengimplementasikan kode yang berbeda dari fungsi pewarisnya ini dinamakan overriding.
1. Dari source latihan sebelumnya, terdapat source code seperti pada gambar
print('namaku: $nama, Email:$email');
script tersebut terdapat pada class ManusiaMilenial. Script tersebut

yang akan dijadilak case study ke dalam Polymorphism/Polimorfisme
script yang ada di class class ManusiaMilenial

2. Konsep yang akan diimplementasikan membuat 2 class baru yang berbeda:
void info() {
a. Membuat sebuah class Programer yang mewarisi class ManusiaMilenial
}
sudah dilakukan perubahan pada Script class Programmer

memanfaatkan fungsi Polymorphism/Polimorfisme
19
b. Membuat sebuah class Dokter yang mewarisi class ManusiaMilenial
Kesimpulannya
class Dosen yang telah mewarisi (extends) dari class ManusiaMilenial dapat
melakukan modifikasi pada method info()
Output
20
Script keseluruhan pada
a. class.dart
class Manusia {
//deklarasi atribut/properti
String nama = ''; //atribut nama bertipe string dan nilai awal null
//pembuatan konstruktor, nama konstruktor adalah nama class

Manusia(nm) {
//nm a/ sebuah parameter yg dipergunakan untuk menampung data
this.nama = nm; //atribut nama memiliki data dari parameter nm
}
//deklarasi method/fungsi/behavior bernama makan

void makan() {
print('$nama makan nasii'); //tambahkan var nama pada string makan
}
}
//awal inheritance
class ManusialMilenial extends Manusia {
String email = '';
String _password = '';
ManusialMilenial(String email) : super(email);
void info() {
}
} //akhir inheritance
21
class Programmer extends ManusialMilenial {
Programmer(String email) : super(email);
@override
void info() {
print('Email: $email pemiliknya adalah $nama');
}
}
class Dosen extends ManusialMilenial {

Dosen(String nama) : super(nama);
@override
void info() {
print('$nama, telah memiliki Email= $email');
}
}
22
b. oop_dart.dart
oop_dart import 'package:oop_dart/oop_dart.dart' as oop_dart;
import 'package:oop_dart/class.dart'; //import library class.dart
//awal program utama

void main() {
//Instansiasi/instance object adalah proses pembuatan object dari sebuah class
var programmer = new Programmer('Fauko Misalam');
programmer.email = '[email protected]';
programmer.info();
programmer.makan();
print('\n'); //pindah baris
var dosen = new Dosen('Intan');

dosen.email = '[email protected]';
dosen.info();
dosen.makan();
23
PERTEMUAN KE 4
RESTFUL WEB SERVICE
Deskripsi
Pembahasan meliputi pengenalan restful web service, kebutuhan tools, implementasinya
dengan mempersiapkan disain database, setup restserver, setting koneksi database,
implementasi Restful Web Service dengan metode GET, POST, PUT, dan DELETE, dan
pengujian melalui browser maupun Postman
Tujuan Pembelajaran
Mahasiswa mampu memahami restfull web service, kebutuhan tools, menerapkan layanan
web service restfull akses database menggunakan metode GET, POST, PUT, dan DELETE
dan menguji melalui browser
A. Pengenalan Restful Web Service

Salah satu web service yang biasa digunakan yaitu REST atau biasa disebut RESTful
Web Service. REST sendiri merupakan singkatan dari Representational State Transfer, yaitu
suatu gaya arsitektur perangkat lunak dalam menyediakan sumber daya /data (resources)
pada REST server, serta dapat diakses dan ditampilkan resources tersebut untuk dapat
digunakan pada REST Client.
Layanan Restful Web Service menggunakan metode HTTP dalam menerapkan konsep
arsitektur REST, dimana setiap resource diidentifikasi oleh URIs (Universal Resource
Identifiers) atau global ID. Resource tersebut direpresentasikan dalam bentuk format teks,
yang pada umumnya menggunakan JSON atau XML. Berikut beberapa metode HTTP yang
umum digunakan dalam arsitektur Restful Web Service.
- GET, hanya menyediakan akses pembacaan pada resource
- PUT, dapat digunakan untuk mengperbaharui resource baru
- DELETE, dapat digunakan untuk menghapus resource
- POST, dapat digunakan untuk memperbarui resource yang ada atau membuat resource
baru
Berikut gambaran ini cara kerja Restful Web Service
1
Sumber: https://www.javatpoint.com/soap-and-rest-web-services
Sebuah Client mengirimkan atau meminta sebuah data melalui HTTP Request ke
Server, Server merespon melalui HTTP Response. Komponen dari HTTP Request
bisa terdiri dari HTTP Method (GET, POST, DELETE, PUT, dan yang lainnya),
Uniform Resource Identifier (URI) untuk mengidentifikasikan lokasi resource pada
server. Sementara komponen HTTP Response bisa terdiri dari Status/Response Code
yang mengindikasikan status server terhadap resource yang direquest (misal : 404,
artinya resource tidak ditemukan dan 200 response OK)
B. Kebutuhan Tools
Dalam implementasi RESTful Web Service pada modul pembelajaran ini dibutuhkan
beberapa hal yang harus dipersiapkan pada PC/laptop, diantaranya yaitu:
1. Xampp sebagai web server, visual studio code/Sublime/atom sebagai editor (pastikan
dilaptop mahasiswa sudah terinstall tools tersebut, kelanjutan dari semester IV)
2. Codeigniter dan library REST server yang diperlukan dapat diunduh di
https://github.com/chriskacerguis/codeigniter-restserver untuk versi terbaru, versi yang
digunakan disini adalah https://github.com/ardisaurus/ci-restserver.
C. Implementasi Restful Web Service

Dibawah ini akan dijabarkan contoh implementasi Restful Web Service menggunakan
Framework Codeigniter. Dalam konsep MVC Codeigniter, controller adalah titik pusat
logika dimana dipanggil ketika pengguna membuat permintaan dan kemudian berdasarkan
2
logika di controller itu mengambil data dan output dapat dilihat atau ditampilkan. Namun,
dalam penerapan RESTful diperlukan library REST_Controller sebagai pengaturan
logikanya.
1. Konfigurasi Database
- Buat database baru dengan nama db_member:
- Dalam database db_member, buat
CREATE DATABASE db_member; sebuah tabel dengan nama member.
N T S K
a y i e
m p z t
a e e
F
i
e
l
d
I I 1 A
d n 1 u
t t
o
_
I
n
c
r
e
m
e
n
t
N
o
t
N
u
l
l
,
P
r
i
m
a
r
3
y
K
e
y
n V 4 N
a a 0 o
m r t
a c N
_ h u
m a l
e r l
m
b
e
r
E V 3 N
m a 5 o
a r t
i c N
l h u
a l
r l
n V 1 N
o a 6 o
_ r t
t c N
e h u
l a l
p r l
CREATE TABLE IF NOT EXISTS `member` (
ìd` int(11) NOT NULL AUTO_INCREMENT,
`nama_member` varchar(40) NOT NULL,
èmail` varchar(35) NOT NULL,
`no_telp` varchar(16) NOT NULL,
PRIMARY KEY (ìd`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
- Entry data dibawah ke dalam tabel member
INSERT INTO `member` (`nama_member`, èmail`, `no_telp`) VALUES
("Tiwi Pertiwi","[email protected]","111122223333"),
("Hanna Putri","[email protected]","555566667777"),
("Mus Dalifa","[email protected]","888899990000");
4
2. Persiapan Project RESTful Web Service

- Pastikan Folder master Codeigniter yang disertai library REST Server telah ada pada
folder C:/xampp/htdocs dilaptop masing-masing. Dengan nama folder diubah dan
diberi nama Restserver.
- Pastikan service Apache dan Mysql pada Xampp Control panel telah aktif.
- Jalankan Browser, lalu ketikan alamat : localhost/Restserver/index.php/rest_server
- Hingga muncul tampilan dibawah ini untuk memastikan project Restserver dan library
REST Server berhasil running.
3. Setting File Koneksi Database

- Jalankan Editor Sublime Text, lalu buka Folder Project Restful.
- Buka File database.php pada folder application/config/database.php
- Setting database menjadi db_member
5
4. Implementasi Metode GET

Untuk melakukan implementasi Restful Web Service dengan metode GET, POST, PUT,
dan DELETE, terlebih dahulu buat controller baru dengan nama “Rest_member.php”
pada folder controller. Kemudian, untuk metode GET, ketikan script dibawah ini:
<?php
// Dokumentasi Pengerjaan Individu
// NIM : .................
// Nama : .................
// Kelas : ……………….
// Kampus : ……………….
defined('BASEPATH') OR exit('No direct script access allowed');

require APPPATH . '/libraries/REST_Controller.php';
use Restserver\libraries\REST_Controller;
class Rest_member extends REST_Controller {
function __construct($config = 'rest'){

parent::__construct($config);
$this->load->database();
}
function index_get() {
// Deskripsi Fungsi :
// ----------------------------------------------------------------------------------
// Script dibawah ini merupakan implementasi dari metode GET
// ----------------------------------------------------------------------------------
$id = $this->get('id');
if ($id == '') {
$member = $this->db->get('member')->result();
} else {
$this->db->where('id', $id);
}
$this->response($member, 404);
}
}
?>
6
Penjelasan Code :
Script diatas menunjukan pemanggilan Controller REST_Controller.php yang ada pada

libraries untuk web service. (setiap pembuatan controller baru, wajib disertakan
deklarasi controller library REST web service)
}
Script diatas menunjukan function dengan parameter $config yang diberi nilai „rest‟.
Pemberian nilai rest merujuk pada function construct file REST_Controller(ada di folder
libraries), jika pengaturasn REST web service ada, maka file database.php akan
dijalankan.
// Deskripsi Fungsi :
// ---------------------------------------------------------------------------------
// Script dibawah ini merupakan implementasi dari metode GET
// ----------------------------------------------------------------------------------
if ($id == '') {
} else {
}
Script diatas menunjukan pembuatan fungsi get, yang akan memeriksa apakah ada
property “id” pada address bar, jika tidak ada maka data akan ditampilkan semua
tanpa ada seleksi.
Tampilan uji coba pada browser :

- Ketika tidak ada property id pada addrees bar :
localhost/Restserver/index.php/rest_member
7
- Ketika ada property id pada addrees bar :

localhost/Restserver/index.php/rest_member?id=2
5. Implementasi Metode POST

Buka controller “Rest_member.php” pada folder controller yang telah berisi function
index_get. Kemudian, untuk metode POST, tambahkan script dibawah ini
8
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Rest_member extends REST_Controller {

}
function index_get()
{
if ($id == '') {
} else {
}
}
function index_post() {
$data = array(
'id' => $this->post('id'),
'nama_member' => $this->post('nama_member'),
'email' => $this->post('email'),
'no_telp' => $this->post('no_telp'));
$insert = $this->db->insert('member', $data);
if ($insert) {
$this->response($data, 200);
} else {
$this->response(array('status' => 'fail', 502));
}
}
}
?>
Penjelasan Code :
function index_post() {
$data = array(
$insert = $this->db->insert('member', $data);
if ($insert) {
} else {
9

}
}
Script diatas menunjukan pembuatan fungsi POST, yang digunakan untuk mengirimkan data
baru dari client ke REST server. Pada kasus diatas function index_post pada controller
rest_member.php untuk menambahkan (insert) data pada tabel member dengan atribut id,
nama_member, email dan no_telp.
6. Implementasi Metode PUT

Buka controller “Rest_member.php” pada folder controller yang telah berisi beberapa
function. Kemudian, untuk metode PUT, tambahkan script dibawah ini
function index_put() {
$id = $this->put('id');
$data = array(
$update = $this->db->update('member', $data);
if ($update) {
} else {
}
}
}
?>
Penjelasan Code :
function index_put() {
$id = $this->put('id');
$data = array(
$update = $this->db->update('member', $data);
10
if ($update) {
} else {
}
}
Script diatas menunjukan pembuatan fungsi PUT, yang digunakan untuk memperbaharui data
(update) dari client ke REST server. Pada kasus diatas function index_put pada controller
rest_member.php untuk memperbaharui (update) data pada atribut nama_member, email atau
no_telp dengan id yang ditunjuk pada tabel member. Untuk pengujian metode PUT akan
dibahas pada bahasan berikutnya mengenai tools postman.
7. Implementasi Metode DELETE

Buka controller “Rest_member.php” pada folder controller yang telah berisi beberapa
function. Kemudian, untuk metode DELETE, tambahkan script dibawah ini
function index_delete() {
$id = $this->delete('id');
$delete = $this->db->delete('member');
if ($delete) {
$this->response(array('status'=>'sukses'), 200);
} else {
$this->response(array('status' => 'gagal', 502));
}
}
}
?>
Penjelasan Code :
function index_delete() {
$id = $this->delete('id');
$delete = $this->db->delete('member');
if ($delete) {
$this->response(array('status'=>'sukses'), 200);
} else {
$this->response(array('status' => 'gagal', 502));
}
11
}
Script diatas menunjukan pembuatan fungsi DELETE, yang digunakan untuk menghapus
data (delete) dari client ke REST server. Pada kasus diatas function index_delete pada
controller rest_member.php untuk menghapus (delete) data pada atribut nama_member, email
atau no_telp dengan id yang ditunjuk pada tabel member.
D. Pengujian Restful Web Service Menggunakan Aplikasi Postman

1. Sejarah Singkat Postman
Postman pertama kali dibuat sebagai projek sampingan yang dikerjakan oleh Abhinav
Asthana untuk mengatasi tantangan dalam pengujian API, kemudian postman mulai populer
pada tahun 2012, yaitu ketika Abhinav selaku CEO dan co-founder Postman dengan ditemani
Ankit Sobti dan Abhijit Kane. mengunggah perojek yang dia kerjakan ke Chrome Web Store
artinya aplikasi postman masih dalam bentuk plug-in dari web browser Chrome. Namun
akhirnya postman berhasil release dalam bentuk aplikasi yang berdiri sendiri dengan user
interface yang mirip dengan tampilan web browser. Saat ini postman sudah digunakan oleh 7
juta pengembang dan 300 perusahaan.
2. Pengertian Postman
Postman adalah sebuah aplikasi fungsinya adalah sebagai REST Client atau istilahnya
adalah aplikasi yang digunakan untuk melakukan uji coba REST API yang telah kita buat.
Postman ini merupakan tools wajib bagi para developer yang bergerak pada pembuatan API,
fungsi utama postman ini adalah sebagai GUI API Caller Pemanggil. namun sekarang
postman juga menyadiakan fitur lain yaitu Sharing Collection API for Documentation (free),
Testing API (free), Realtime Collaboration Team (paid), Monitoring API (paid), Integration
(paid) detailnya silahkan dicek disini. Dulu awal pertama kali postman muncul sebagai add
on dari Chrome namun sekarang sudah menjadi aplikasi sendiri. Jika kalian sedang membuat
API sangat direkomendasikan untuk menggunakan Postman untuk testing API yang kalian
buat.
3. Instalasi Postman
Postman tersedia sebagai aplikasi asli untuk sistem operasi macOS, Windows (32-bit
dan 64-bit), dan Linux (32-bit dan 64-bit). Untuk mendapatkan aplikasi Postman, dapat
diunduh pada website resminya yanitu getpostman.com
12
atau bisa di download melalui link berikut:
 Linux
https://drive.google.com/file/d/1I-U-
7sqAowZhL5dosM3_5B0XS9QMLMMa/view?usp=sharing
 Mac
https://drive.google.com/file/d/1nTXd-
9cPPXuq4JLx_OBUr9jBWld61bML/view?usp=sharing
 Windows
Versi 32 Bit
Versi 64 Bit
Setelah postman selesai didownload, selanjutnya jalankan paket instalasi postman dengan
cara double klik.
13
Pilih Run jika muncul popup seperti berikut:
Kemudian tunggu sampai Postman nya terbuka Seperti ini:
Selesai, postman sudah terinstal pada perangkat anda.
4. Implementasi Pengujian menggunakan Postman
14
Pengujian Restful Web Service menggunakan postman ini perlu ada beberapa persiapan
terlebih dahulu. Persiapan yang diperlukan adalah sebagai berikut:
1. Webserver seperti Xampp, Wampp, atau lainnya. Jalankan
2. Konfigurasi Database
Database yang akan digunakan adalah database yang sudah dibuat pada pertemuan
sebelumnya yaitu menggunakan database db_member
3. Projek program yang ingin diuji
Projek yang akan diuji dalam hal ini adalah projek yang sudah dibuat pada pertemuan
minggu sebelumnya juga yaitu tentang restful pendaftaran member.
Setelah persiapan selesai barulah kita akan menguji dengan postman. Langkahnya sebagai
berikut:
1. Buka aplikasi postman yang sudah terinstal
2. Paste url pada inputan pada postman. Seperti gambar berikut:
http://localhost/restserver/index.php/rest_member
a. Pengujian GET
1. pilih GET terlebih dahulu, lalu klik tombol Send
15
2. Hasilnya seperti berikut:
b. Pengujian POST
1. Untuk pengujian POST, maka pilih jenis pengujian POST
2. Setelah pengujian dipilih, selanjutnya klik body yang ada dibagian bawah inputan url di
atas, kemudian pilih x-www.form-urlendcode.
3. Selanjutnya isi key sesuai dengan field-field yang ada pada tabel yang digunakan,
sedangkan value diisi bebas. Lalu klik tombol send
4. Hasilnya pengujian POST seperti berikut:
c. Pengujian PUT
Pengujian PUT langkahnya sama seperti metode POST. Hasilnya seperti berikut:
16
d. Pengujian DELETE
Untuk pengujian delete, langkahnya kurang lebih sama dengan POST dan PUT.
E. Persiapan Aplikasi ViGeNesia

ViGeNesia adalah hasil pemikiran dari diskusi dengan mahasiswa Universitas Bina
Sarana Informatika untuk membangun startup, satu ide produknya adalah ViGeNesia (Visi
Generasi Indonesia). Mimpi besar ViGeNesia adalah aplikasi ini bisa menyatukan generasi
muda Indonesia dari sabang sampai merauke dalam merajut nasionalisme, persahabatan,
saling memotivasi, mengedukasi, berbagi cerita dan cita-cita. ViGeNesia akan dikembangkan
secara bertahap mulai menjadi case study di mata kuliah Teknologi Web Service,
dikembangkan oleh mahasiswa sebagai projek (projct base), dan dalam jangka panjang akan
menjadi icon nasional melalui google playstore dan mendapatkan support dari Kemendikbud
maupun masyarakat luas.
17
Sebagai tahap awal, ViGeNesia disusun berdasarkan proses bisnis yang sangat
sederhana, generasi muda Indonesia dapat mempublikasikan atau memberikan sebuah
semangat/motivasi melalui aplikasi ViGeNesia. Pesan motivasi tersebut akan menjadi
motivasi bagi generasi yang lain. Berdasarkan ide kecil tersebut diperoleh struktur data yang
dibutuhkan untuk mensupport manajemen data ViGeNesia. Berikut struktur data yang
diwakilkan menggunakan normalisasi
1. Kebutuhan database dan resful API ViGeNesia mahasiswa unduh melalui link
https://tinyurl.com/DB-API-vigenesia
2. Extrak file zip tersebut dan letakan pada httdoc
3. Aktifkan phpmyadmin, create database baru : vigenesia

4. Lakukan import vigenesia.sql (Temukan file vigenesia.sql pada folder DB pada folder
vigensia)
5. Setelah sukses import, pastikan stuktur database vigenesia seperti pada gambar dibawah
18
6. Mahasiswa dapat melakukan explore struktur dari masing-masing tabel role, user, dan
motivasi.
Role :
User :
Motivasi :
19
7. Tugas mandiri mahasiswa. Melakukan dokumentasi pengujian API ViGeNesia

menggunakan Postman. Bentuk/media unjuk kerja pengujian diperbolehkan memilih salah
satu diantaranya:
1. Video. Upload video tersebut pada chanel youtube. Catatan video wajib ada identitas
kampus (logo), identitas prodi, identitas mahasiswa dan dibuat dengan kreatifitas
mahasiswa.
2. Dalam bentuk laporan dengan format pdf. (format pada halaman berikutnya)
20
21
DOKUMENTASI PENGUJIAN VIGENESIA

TOOLS; POSTMAN
A. GET
Uraikan tahapan dan tampikan gambar jika diperlukan

1. ?
2. ?
3. ?
B. POST
Uraikan tahapan dan tampikan tabel atau gambar jika diperlukan
1. ?
2. ?
3. ?
C. PUT
Uraikan tahapan dan tampikan tabel/gambar jika diperlukan
1. ?
2. ?
3. ?
D. DELETE
Uraikan tahapan dan tampikan tabel/gambar jika diperlukan
1. ?
2. ?
22
3. ?
23
MINGGU KE 5-9
ViGeNesia – VISI GENERASI INDONESIA
BERABASIS WEB SERVICE
Deskripsi
Untuk memberikan pengalaman belajar mahasiswa implementasi web service, materi minggu ke 5-7
merupakan pembelajaran yang berkelanjutan dan didukung dengan case study pengembangan aplikasi
ViGeNesia, serta dikerjakan secara mandiri oleh mahasiswa. ViGeNesia didukung struktur data yang
dikembangkan menggunakan software database management system (mariadb). Untuk layanan web
servis menggunakan restfull API (json). Front end dikembangkan menggunakan bahasa pemrogramman
dart, framework flutter dan proses coding menggunakan editor visual studi code. Luaran dari
pembelajaran adalah aplikasi ViGeNesia dapat dikembangkan secara berkelompok dan dipresentasikan
pada pertemuan 10-15
Tujuan Pembelajaran
Mahasiswa memiliki pemahaman dan kemampuan dalam membangun sistem informasi berbasis web
service. Kemampuan dalam mendisain struktur data, web service, serta pembuatan front end berbasis
mobile. Mahasiswa secara berkelompok dapat mengembangkan aplikasi ViGeNesia yang siap
dimanfaatkan masyarakat.
Seputar Aplikasi ViGeNesia
Generasi muda Indonesia menjadi tumpuan masa depan bangsa Indonesia dalam mempertahankan
persatuan dan kesatuan melalui 3S (saling kenal, saling sapa, saling berbagi), memberikan motivasi dan
menginspirasi, mengedukasi serta berbagi cerita dan cita-cita membangun negeri Indonesia. Kemajuan
teknologi informasi dan komunikasi sangat memungkinkan ViGeNesia menjadi media secara virtual untuk
menyatukan generasi muda melalui satu gengaman (smartphone). ViGeNesia akan dikembangkan
secara bertahap mulai menjadi case study di mata kuliah Teknologi Web Service, dikembangkan
oleh mahasiswa sebagai projek (projct base), dan dalam jangka panjang akan menjadi icon
nasional melalui google playstore dan mendapatkan support dari masyarakat umum.
1
Kebutuhan awal User ViGeNesia
USER KETERANGAN
1. All User  Registrasi
 Login
 Logout
2. All User Create/Post -> tabel motivasi
Untuk menambahkan/create/insert data baru ke tabel motivasi.
Catatan:
Dibutuhkan iduser dari tabel user berdasarkan emai user, data iduser tersebut akan
tersimpan di tabel motivasi.
Read/Get -> tabel motivasi

Untuk membaca/melihat/view data dari tabel motivasi. Pada aplikasi ViGeNesia Read
dibagi menjadi dua pilihan
1. View data tabel motivasi keseluruhan
2. View data tabel motivasi berdasarkan iduser
Catatan:
Setelah user login, masuk ke fitur entry motivasi, maka record motivasi yang ditampilkan
berdasarkan iduser, dilengkapi dengan fitur Update/Put dan Delete
Struktur database ViGeNesia

1. Disain logic (Normalisasi)
2. Disain fisik
- Software DBMS : mariadb
3. Kebutuhan Software
- Bahasa pemrograman: Dart
- Framework : Flutter Versi 2.0.2
- Editor : Visual Studio Code
2
1. Create Project
Catatan Dalam Penamaan Projek. Dalam penamaan projek Flutter ada beberapa hal yang perlu
diketahui, jika tidak maka akan terjadi error.
- Penamaa projek hanya satu kata.
- Jika lebih dari satu kata gunakan pemisah underscore ( _ ), contoh : projek_flutter.
- Jangan gunakan spasi atau dash ( - ) untuk pemisah kata di nama projek Flutter.
Dalam studi kasus SIBERI persiapan projek seperti pada tabel
Path/Tempat penyimpanan projek C:\Projek_TWS

Nama Projek vigenesia
2. Langgkah pembuatan projek Vigensia

1. Melaui GitBash
All done membuat

project flutter
2. Open Folder Vigenesia yang

sudah di buat
Hasil awal pembuatan projek Vigenesia
3
Hapus script/code di bawah
3. Setelah itu buka file pubspec.yaml lalu ketikan di bagian ini :
4
dependencies:
flutter:
sdk: flutter
# The following adds the Cupertino Icons font to your application.

# Use with the CupertinoIcons class for iOS style icons.
cupertino_icons: ^1.0.2
dio: ^3.0.10
font_awesome_flutter: ^8.10.2
flutter_svg: 0.18.1
flutter_form_builder: ^5.0.0
http: ^0.12.1
another_flushbar: ^1.10.13
Code tersebut akan berpengaruh dengan package flutter , bisa di buka pada laman pub.dev
4. Setelah kita memasukan package flutter di file pubspec.yaml kita akan memodifikasi pada folder
Android di dalam folder main terdapat file Bernama AndroidManifest.xml di modifikasi menjadi .
Code AndroidManifest.xml :
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.example.vigenesia_mobile">
<application Berfungsi untuk running di
handphone agar tidak terjadi
android:usesCleartextTraffic="true" eror bugging
android:label="vigenesia_mobile"
android:icon="@mipmap/ic_launcher">
<activity
5
android:name=".MainActivity"
android:launchMode="singleTop"
android:theme="@style/LaunchTheme"
android:configChanges="orientation|keyboardHidden|keyboard|screenSize
|smallestScreenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
android:hardwareAccelerated="true"
android:windowSoftInputMode="adjustResize">
<meta-data
android:name="io.flutter.embedding.android.NormalTheme"
android:resource="@style/NormalTheme"
/>
<meta-data
android:name="io.flutter.embedding.android.SplashScreenDrawable"
android:resource="@drawable/launch_background"
/>
<intent-filter>
<action android:name="android.intent.action.MAIN"/>
<category android:name="android.intent.category.LAUNCHER"/>
</intent-filter>
</activity>
<meta-data
android:name="flutterEmbedding"
android:value="2" />
</application>
</manifest>
5. Coding awal Main.dart :
import 'package:flutter/material.dart';
import 'Screens/Login.dart'; Eror di karenakan kita harus

buat folder screens
void main() => runApp(MaterialApp(
debugShowCheckedModeBanner: false,
home:
Login(), // <-
- Buat Class Baru yg bernama MyScreen di dalam lib bikin folder baru screens isin
ya MyScreen.dart
));
6
6. Buatlah Folder baru di dalam Lib dengan nama Screens dan buat file Bernama login.dart:
Login.dart :
import 'package:another_flushbar/flushbar.dart';
import 'package:flutter_form_builder/flutter_form_builder.dart';
import 'Register.dart';
import 'package:flutter/gestures.dart';
import 'dart:convert';
class Login extends StatefulWidget {

const Login({Key key}) : super(key: key);
@override
_LoginState createState() => _LoginState();
}
class _LoginState extends State<Login> {

String nama;
final GlobalKey<FormBuilderState> _fbKey = GlobalKey<FormBuilderState>();
TextEditingController emailController = TextEditingController();

TextEditingController passwordController = TextEditingController();
@override
Widget build(BuildContext context) {
return Scaffold(
body: SingleChildScrollView(
// <-- Berfungsi Untuk Bisa Scroll
child: SafeArea(
// < -- Biar Gak Keluar Area Screen HP
child: Container(
height: MediaQuery.of(context).size.height,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
7
Text(
"Login Area",
style: TextStyle(fontSize: 22, fontWeight: FontWeight.w500),
),
SizedBox(height: 50), // <-- Kasih Jarak Tinggi : 50px
Center(
child: Form(
key: _fbKey,
child: Container(
width: MediaQuery.of(context).size.width / 1.3,
child: Column(
children: [
FormBuilderTextField(
name: "email",
controller: emailController,
decoration: InputDecoration(
contentPadding: EdgeInsets.only(left: 10),
border: OutlineInputBorder(),
labelText: "Email"),
),
SizedBox(
height: 20,
),
obscureText:
true, // <-
- Buat bikin setiap inputan jadi bintang " * "
name: "password",
controller: passwordController,
labelText: "Password"),
),
SizedBox(
height: 30,
),
Text.rich(
TextSpan(
children: [
TextSpan(
text: 'Dont Have Account ? ',
style: TextStyle(color: Colors.black54),
),
8
TextSpan(
text: 'Sign Up',
recognizer: TapGestureRecognizer()
..onTap = () {
Navigator.push(
context,
new MaterialPageRoute(
builder:
(BuildContext context) =>
new Register()));
},
style: TextStyle(
fontWeight: FontWeight.w600,
color: Colors.blueAccent,
)),
],
),
),
SizedBox(
height: 40,
),
Container(
width: MediaQuery.of(context).size.width,
child: ElevatedButton(
onPressed: () async {
},
child: Text("Sign In")),
),
],
),
),
),
)
],
),
),
),
),
);
}
}
9
Hasil dari running file
login.dart
7. Setelah selesai membuat Login . Buatlah Folder Constant di dalam folder Lib dan file nya Const.dart :
Folder Constant dan file const dimana berfungsi menampung string URL IP addres perangkat
Const.dart :
String url = "http://isi dengan ip config laptop masing-masing ";
Langkah mengetahui ip laptop:
8. Setelah itu buatlah folder Models di dalam Lib dan buat file dengan nama Login_Model.dart :
10
Folder Models dan file Login_Model.dart ini berfungsi menampung database dan table user dari API ke
flutter
Login_Model.dart :
LoginModels loginModelsFromJson(String str) => LoginModels.fromJson(json.decode(s

tr));
String loginModelsToJson(LoginModels data) => json.encode(data.toJson());
class LoginModels {
LoginModels({
this.isActive,
this.message,
this.data,
});
bool isActive;
String message;
Data data;
factory LoginModels.fromJson(Map<String, dynamic> json) => LoginModels(

isActive: json["is_active"],
message: json["message"],
data: Data.fromJson(json["data"]),
);
Map<String, dynamic> toJson() => {

"is_active": isActive,
"message": message,
"data": data.toJson(),
};
}
class Data {
Data({
this.iduser,
this.nama,
this.profesi,
this.email,
this.password,
11
this.roleId,
this.isActive,
this.tanggalInput,
this.modified,
});
String iduser;
String nama;
String profesi;
String email;
String password;
String roleId;
String isActive;
DateTime tanggalInput;
String modified;
factory Data.fromJson(Map<String, dynamic> json) => Data(

iduser: json["iduser"],
nama: json["nama"],
profesi: json["profesi"],
email: json["email"],
password: json["password"],
roleId: json["role_id"],
isActive: json["is_active"],
tanggalInput: DateTime.parse(json["tanggal_input"]),
modified: json["modified"],
);

"iduser": iduser,
"nama": nama,
"profesi": profesi,
"email": email,
"password": password,
"role_id": roleId,
"is_active": isActive,
"tanggal_input": "${tanggalInput.year.toString().padLeft(4, '0')}-
${tanggalInput.month.toString().padLeft(2, '0')}-
${tanggalInput.day.toString().padLeft(2, '0')}",
"modified": modified,
};
}
12
9. Setelah file Cons.dart dan Login_Model.dart di buat mari kita Kembali ke folder screens dan ke file
Login agar bisa memasukan parsing data API ke Flutter .
Perbarui file Login.dart :
import 'package:vigenesia/Constant/const.dart'; Penambahan Pemanggilan folder

import 'package:another_flushbar/flushbar.dart'; dan file yang baru di buat
import 'package:dio/dio.dart';
import 'MainScreens.dart';
import 'Register.dart';
import 'package:flutter/gestures.dart'; Prnambahan
import 'dart:convert'; Pemanggilan folder
import 'package:vigenesia/Models/Login_Model.dart'; dan file yang baru di
buat
class Login extends StatefulWidget {
const Login({Key key}) : super(key: key);
@override
_LoginState createState() => _LoginState();
}
class _LoginState extends State<Login> {

String nama;
final GlobalKey<FormBuilderState> _fbKey = GlobalKey<FormBuilderState>();
Untuk pemanggilan data dari

Login_Model dan di eksekusi dan
bersifat POST
Future<LoginModels> postLogin(String email, String password) async {

var dio = Dio();
String baseurl = url; Pemanggilan
URL API yang
Map<String, dynamic> data = {"email": email, "password": password}; sudah ada
try {
final response = await dio.post("$baseurl/vigenesia/api/login/",
data: data,
options: Options(headers: {'Content-type': 'application/json'}));
print("Respon -> ${response.data} + ${response.statusCode}");
13
if (response.statusCode == 200) {
final loginModel = LoginModels.fromJson(response.data);
return loginModel;
}
} catch (e) {
print("Failed To Load $e");
}
}

@override
return Scaffold(
child: SafeArea(
child: Container(
child: Column(
children: [
Text(
"Login Area",
),
Center(
child: Form(
key: _fbKey,
child: Container(
child: Column(
children: [
name: "email",
),
14
SizedBox(
height: 20,
),
obscureText:
true, // <-
- Buat bikin setiap inputan jadi bintang " * "
name: "password",
),
SizedBox(
height: 30,
),
Text.rich(
TextSpan(
children: [
TextSpan(
text: 'Dont Have Account ? ',
style: TextStyle(color: Colors.black54),
),
TextSpan(
text: 'Sign Up',
recognizer: TapGestureRecognizer()
..onTap = () {
Navigator.push(
context,
builder:
(BuildContext context) =>
Pemanggilan new Register()));
},
Registrasi
style: TextStyle(
fontWeight: FontWeight.w600,
color: Colors.blueAccent,
)),
],
),
),
SizedBox(
height: 40,
15
),
Container(
await postLogin(emailController.text,
passwordController.text)
.then((value) => {
if (value != null)
{
setState(() {
nama = value.data.nama;
Navigator.pushReplacement(
context,
builder: (BuildContext
context) =>
new MainScreens(
Pemanggilan nama: nama)));
main screen })
pada setelah }
login else if (value == null)
{
Flushbar(
message:
"Check Your Email / Password",
duration:
Duration(seconds: 5),
backgroundColor:
Colors.redAccent,
flushbarPosition:
FlushbarPosition.TOP,
).show(context)
}
});
},
child: Text("Sign In")),
),
],
),
),
),
)
],
),
16
),
),
),
);
}
}
Tampilan akan sama seperti di awal kita run hanya membedakan sudah memasukan data URL API yang
sudah tersedia
10. Setelah itu mari kita buat file Register.dart di dalam folder screens :
17
Disini kita akan membuat UI file Register.dart Sebelum memasukan URL API :
Register.dart :
class Register extends StatefulWidget {

const Register({Key key}) : super(key: key);
@override
_RegisterState createState() => _RegisterState();
}
class _RegisterState extends State<Register> {
TextEditingController nameController = TextEditingController();

TextEditingController profesiController = TextEditingController();
@override
return Scaffold(
child: SafeArea(
child: Center(
child: Container(
child: Column(
children: [
Text(
"Register Your Account",

),
SizedBox(height: 50), Untuk membuat
FormBuilderTextField( form input
name: "name",
controller: nameController,
18
labelText: "Nama"),
),
SizedBox(height: 20),
name: "profesi",
controller: profesiController,
labelText: "Profesi"),
),
name: "email",
),
SizedBox(
height: 20,
),
obscureText:
true, // <-- Buat bikin setiap inputan jadi bintang " * "
name: "password",
),
SizedBox(
height: 30,
),
Container(
},
child: Text("Daftar")),
),
19
],
),
),
),
),
),
);
}
}
Hasil dari running file

Register.dart
11. Hasil tersebut masi dalam UI belum memasukan data URL dari API yang tersedia dan masi kita
Kembali ke file Register.dart supaya bisa memasukan data URL API yang telah di sediakan :
Perbarui Register.dart :
import 'package:vigenesia/Constant/const.dart';
20
class Register extends StatefulWidget {
const Register({Key key}) : super(key: key);
@override
_RegisterState createState() => _RegisterState();
}
class _RegisterState extends State<Register> {

// Ganti Base URL
Untuk pemanggilan data dari

String baseurl = url; Login_Modeldan di eksekusi
dan bersifat POST
Future postRegister(
String nama, String profesi, String email, String password) async {
var dio = Dio();
dynamic data = {
"nama": nama,
"profesi": profesi,
"email": email,
"password": password
};
try {
final response = await dio.post("$baseurl/vigenesia/api/registrasi/",
data: data,
options: Options(headers: {'Content-type': 'application/json'}));
return response.data;
}
} catch (e) {
print("Failed To Load $e");
}
}
TextEditingController nameController = TextEditingController();
21
TextEditingController profesiController = TextEditingController();
@override
return Scaffold(
child: SafeArea(
child: Center(
child: Container(
child: Column(
children: [
Text(
"Register Your Account",
),
name: "name",
controller: nameController,
labelText: "Nama"),
),
name: "profesi",
controller: profesiController,
labelText: "Profesi"),
),
name: "email",
22
),
SizedBox(
height: 20,
),
obscureText:
true, // <-- Buat bikin setiap inputan jadi bintang " * "
name: "password",
),
SizedBox(
height: 30,
),
Container(
await postRegister(
nameController.text,
profesiController.text,
emailController.text,
passwordController.text)
.then((value) => {
if (value != null)
{
setState(() {
Navigator.pop(context);
Flushbar(
message: "Berhasil Registrasi",
duration: Duration(seconds: 2),
backgroundColor: Colors.greenAccent,
flushbarPosition:
).show(context);
})
}
else if (value == null)
{
Flushbar(
message:
23
"Check Your Field Before Register",
backgroundColor: Colors.redAccent,
flushbarPosition:
).show(context)
}
});
},
child: Text("Daftar")),
),
],
),
),
),
),
),
);
}
}
Hasil akan sama dan hanya membedakan terdapat Data URL dari API
24
12. Setelah itu kita akan membuat file MainScreens.dart di dalam folder Screens :
File MainScreens.dart berfungsi untuk menampilkan tampilan setelah melakukan authentifikasi
UI MainScreens.dart :
// import 'package:vigenesia/Models/Motivasi_Model.dart';
// import 'package:vigenesia/Screens/EditPage.dart';
import 'Login.dart';
class MainScreens extends StatefulWidget {

final String nama;
const MainScreens({Key key, this.nama}) : super(key: key);
@override
_MainScreensState createState() => _MainScreensState();
}
class _MainScreensState extends State<MainScreens> {
TextEditingController isiController = TextEditingController();
@override
void initState() {
super.initState();
}
@override
return Scaffold(
25
child: SafeArea(
child: Container(
child: Padding(
padding: const EdgeInsets.only(left: 30.0, right: 30.0),
child: Column(
mainAxisAlignment: MainAxisAlignment
.center, // <-- Berfungsi untuk atur nilai X jadi tengah
children: [
SizedBox(
height: 40,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
"Hallo ${widget.nama}",
style: TextStyle(
fontSize: 22, fontWeight: FontWeight.w500),
),
TextButton(
child: Icon(Icons.logout),
onPressed: () {
Navigator.push(
context,
builder: (BuildContext context) =>
new Login()));
})
],
),

controller: isiController,
name: "isi_motivasi",
),
),
26
Container(
print("Sukses");
},
child: Text("Submit")),
),
SizedBox(
height: 40,
),
TextButton(
child: Icon(Icons.refresh),
onPressed: () {
// _getData();
},
),
]),
),
),
),
),
);
}
}
Hasil dari code tersebut menghasilkan tampilan seperti di bawah ini :
27
13. Disini tampilan belum ada data dari URL API jadi kita akan membuat data agar bisa masuk dengan
memperbarui MainScreens.dart supaya bisa memasukan data URL API. Buat terlebih dahulu
EditPage.dart di dalam Folder Screens dan membuat File Motivasi_Model.dart di dalam Folder
Models.
1.
2.
Motivasi_Model.dart:
List<MotivasiModel> motivasiModelFromJson(String str) =>

List<MotivasiModel>.from(
json.decode(str).map((x) => MotivasiModel.fromJson(x)));
String motivasiModelToJson(List<MotivasiModel> data) =>

json.encode(List<dynamic>.from(data.map((x) => x.toJson())));
class MotivasiModel {
MotivasiModel({
this.id,
this.isiMotivasi,
this.idKategori,
this.tanggalInput,
this.tanggalUpdate,
});
String id;
String isiMotivasi;
String idKategori;
DateTime tanggalInput;
String tanggalUpdate;
factory MotivasiModel.fromJson(Map<String, dynamic> json) => MotivasiModel(

id: json["id"],
28
isiMotivasi: json["isi_motivasi"],
idKategori: json["id_kategori"],
tanggalInput: DateTime.parse(json["tanggal_input"]),
tanggalUpdate: json["tanggal_update"],
);

"id": id,
"isi_motivasi": isiMotivasi,
"id_kategori": idKategori,
"tanggal_input":
"${tanggalInput.year.toString().padLeft(4, '0')}-
${tanggalInput.month.toString().padLeft(2, '0')}-
${tanggalInput.day.toString().padLeft(2, '0')}",
"tanggal_update": tanggalUpdate,
};
}
Perbarui MainScreens.dart :
import 'package:vigenesia/Models/Motivasi_Model.dart';
import 'package:vigenesia/Screens/EditPage.dart';
import 'Login.dart';
class MainScreens extends StatefulWidget {

final String idUser;
final String nama;
const MainScreens({Key key, this.nama, this.idUser}) : super(key: key);
@override
_MainScreensState createState() => _MainScreensState();
}
class _MainScreensState extends State<MainScreens> {

String baseurl = url;
String id;
var dio = Dio();
29
List<MotivasiModel> ass = [];
TextEditingController titleController = TextEditingController();
Future<dynamic> sendMotivasi(String isi) async {

Map<String, dynamic> body = {"isi_motivasi": isi, "iduser": widget.idUser}; /
/ [Tambah IDUSER -> Widget.iduser]
try {
Response response = await dio.post(
"$baseurl/vigenesia/api/dev/POSTmotivasi/",
data: body,
options: Options(contentType: Headers.formUrlEncodedContentType)); // F
ormatnya Harus Form Data
return response;
} catch (e) {
print("Error di -> $e");
}
}
List<MotivasiModel> listproduk = [];
Future<List<MotivasiModel>> getData() async {

var response = await dio
.get('$baseurl/vigenesia/api/Get_motivasi?iduser=${widget.idUser}'); // N
Gambil by data
print(" ${response.data}");
var getUsersData = response.data as List;
var listUsers =
getUsersData.map((i) => MotivasiModel.fromJson(i)).toList();
return listUsers;
} else {
throw Exception('Failed to load');
}
}
Future<dynamic> deletePost(String id) async {

dynamic data = {
"id": id,
};
var response = await dio.delete('$baseurl/vigenesia/api/dev/DELETEmotivasi',
30
data: data,
options: Options(
contentType: Headers.formUrlEncodedContentType,
headers: {"Content-type": "application/json"}));
var resbody = jsonDecode(response.data);

return resbody;
}
Future<List<MotivasiModel>> getData2() async {

var response = await dio.get('$baseurl/vigenesia/api/Get_motivasi'); // Ngamb
il by ALL USER
var getUsersData = response.data as List;
var listUsers =
getUsersData.map((i) => MotivasiModel.fromJson(i)).toList();
return listUsers;
} else {
throw Exception('Failed to load');
}
}
Future<void> _getData() async {

setState(() {
getData();
listproduk.clear();
return CircularProgressIndicator();
});
}
TextEditingController isiController = TextEditingController();
@override
void initState() {
super.initState();
getData();
getData2();
_getData();
}
String trigger;
31
String triggeruser;
@override
return Scaffold(
child: SafeArea(
child: Container(
child: Padding(
padding: const EdgeInsets.only(left: 30.0, right: 30.0),
child: Column(
mainAxisAlignment: MainAxisAlignment
.center, // <-- Berfungsi untuk atur nilai X jadi tengah
children: [
SizedBox(
height: 40,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
"Hallo ${widget.nama}",
style: TextStyle(
fontSize: 22, fontWeight: FontWeight.w500),
),
TextButton(
child: Icon(Icons.logout),
onPressed: () {
Navigator.push(
context,
builder: (BuildContext context) =>
new Login()));
})
],
),

controller: isiController,
32
),
),
Container(
await sendMotivasi(
isiController.text.toString(),
).then((value) => {
if (value != null)
{
Flushbar(
message: "Berhasil Submit",
backgroundColor: Colors.greenAccent,
flushbarPosition: FlushbarPosition.TOP,
).show(context)
}
});
_getData();
print("Sukses");
},
child: Text("Submit")),
),
TextButton(
child: Icon(Icons.refresh),
onPressed: () {
_getData();
},
),
FormBuilderRadioGroup(
onChanged: (value) {
setState(() {
trigger = value;
print(" HASILNYA --
> ${trigger}"); // hasil ganti value
});
},
name: "_",
options: ["Motivasi By All", "Motivasi By User"]
.map((e) => FormBuilderFieldOption(
33
value: e, child: Text("${e}")))
.toList()),
trigger == "Motivasi By All"

? FutureBuilder(
future: getData2(),
builder: (BuildContext context,
AsyncSnapshot<List<MotivasiModel>> snapshot) {
if (snapshot.hasData) {
return Container(
child: Column(
children: [
for (var item in snapshot.data)
Container(
width:
MediaQuery.of(context).size.width,
child: ListView(
shrinkWrap: true,
children: [
Container(
child:
Text(item.isiMotivasi)),
],
),
),
],
),
);
} else if (snapshot.hasData &&
snapshot.data.isEmpty) {
return Text("No Data");
} else {
}
})
: Container(),
trigger == "Motivasi By User"
? FutureBuilder(
future: getData(),
builder: (BuildContext context,
AsyncSnapshot<List<MotivasiModel>> snapshot) {
if (snapshot.hasData) {
return Column(
children: [
for (var item in snapshot.data)
34
Container(
width:
MediaQuery.of(context).size.width,
child: ListView(
shrinkWrap: true,
children: [
Expanded(
child: Row(
mainAxisAlignment:
MainAxisAlignment
.spaceBetween,
children: [
Text(item.isiMotivasi),
Row(children: [
TextButton(
child:
Icon(Icons.settings),
onPressed: () {
String id;
String isi_motivasi;
Navigator.push(
context,
MaterialPageRoute(
builder: (BuildCont
ext
context) =>
EditPage(
id: item
.id,
isi_motivas
i:
item.is
iMotivasi),
));
},
),
TextButton(
child: Icon(Icons.delete),
onPressed: () {
deletePost(item.id)
.then((value) => {
if (value !=
null)
{
Flushbar(
35
message:
"Berhasil Del
ete",
duration:
Duration(seco
nds: 2),
backgroundColor:
Colors.redAcc
ent,
flushbarPosition:
FlushbarPosit
ion.TOP,
).show(
context)
}
});
_getData();
},
)
]),
])),
],
),
),
],
);
} else if (snapshot.hasData &&
snapshot.data.isEmpty) {
return Text("No Data");
} else {
}
})
: Container(),
]),
),
),
),
),
);
}
}
36
Berikut hasil pembaharuan dari MainScreens.dart dengan memasukan Data URL API
14. Langkah selanjut kita membuat fungsi edit motivasi di file EditPage.dart .
EditPage.dart:
37
import 'package:vigenesia/Models/Motivasi_Model.dart';
class EditPage extends StatefulWidget {

final String id;
final String isi_motivasi;
const EditPage({Key key, this.id, this.isi_motivasi}) : super(key: key);
@override
_EditPageState createState() => _EditPageState();
}
class _EditPageState extends State<EditPage> {

String baseurl = url;
var dio = Dio();

Future<dynamic> putPost(String isi_motivasi, String ids) async {
Map<String, dynamic> data = {"isi_motivasi": isi_motivasi, "id": ids};
var response = await dio.put('$baseurl/vigenesia/api/dev/PUTmotivasi',
data: data,
options: Options(
contentType: Headers.formUrlEncodedContentType,
));
print("---> ${response.data} + ${response.statusCode}");
return response.data;
}
TextEditingController isiMotivasiC = TextEditingController();
@override
return Scaffold(
appBar: AppBar(
title: Text("Edit"),
),
body: SafeArea(
child: Container(
38
child: Container(
child: Center(
child: Column(
children: [
Text("${widget.isi_motivasi}"),
SizedBox(
height: 20,
),
Container(
child: FormBuilderTextField(
controller: isiMotivasiC,
labelText: "New Data",
),
),
),
ElevatedButton(
onPressed: () {
putPost(isiMotivasiC.text, widget.id).then((value) => {
if (value != null)
{
Navigator.pop(context),
Flushbar(
message: "Berhasil Update & Refresh dlu",
backgroundColor: Colors.green,
flushbarPosition: FlushbarPosition.TOP,
).show(context)
}
});
},
child: Text("Submit"))
],
),
),
),
)),
);
}
39
}
Hasil dari EditPage.dart :
15.Langkah akhir membuat file generated_plugin_registrant.dart dengan sejajar main.dart membuat file
tersebut agar dimana user memstabilkan keyboard saat menginput ketikan data
import 'package:flutter_keyboard_visibility_web/flutter_keyboard_visibility_web.d
art';
import 'package:flutter_web_plugins/flutter_web_plugins.dart';
// ignore: public_member_api_docs
void registerPlugins(Registrar registrar) {
FlutterKeyboardVisibilityPlugin.registerWith(registrar);
registrar.registerMessageHandler();
}
40
MINGGU KE 10-15
PRESENTASI PROJEK PENGEMBANGAN ViGeNesia
Deskripsi
Mata kuliah Teknologi Web Service menggunakan model pembelajaran berbasis projek. Setelah
mahasiswa menyelesaikan pembelajaran pertemuan 1-9. Setelah mahasiswa menyelesaikan case study
aplikasi ViGeNesia, maka mahasiswa secara berkelompok dapat merencanakan pengembangan, melalui
pengamatan kekurangan ViGeNesia dan terdokumentasikan pada rencana pengembanganya. Hasil
pengembangan dipresentasikan pada minggu ke 10-15.
Tujuan Pembelajaran
Mampu menciptakan, mengembangkan, mendemontrasikan karya aplikasi terapan berbasis layanan web
service dan mempresentasikan secara berkelompok. Mahasiswa memiliki dokumentasi tahapan dalam
mengembangkan ViGeNesiaI/ide inovasi lainnya yang dikerjakan secara tim, mempersiapkan materi
presentasi dan mengkomunikasikan pengembangan aplikasi yang diusulkan melalui presentasi projek.
Rubrik Penilaian Projek
RUBRIK PENILAIAN TUGAS (PROJEK)
KRITERIA ANGKA INDIKATOR KINERJA

1. Analisa pengembangan melalui Ide kreatif kurang representatif
2. Kurang bekerja dalam tim, mandiri dan bertanggung jawab
terhadap pekerjaannya
3. Kurang bekerja sama, berkomunikasi, dan berinovatif dalam
Sangat ≤30
pekerjaannya
kurang
4. Teknik Presentasi
5. Menerapkan akses basis data
6. Dokumentasi debugging dan pengujian program
7. Tujuan pengembangan aplikasi tidak sesuai
1. Analisa pengembangan melalui Ide kreatif
Kurang 31–59 3. Kurang bekerja sama, berkomunikasi, dan berinovatif dalam
pekerjaannya
1
KRITERIA ANGKA INDIKATOR KINERJA
3. Kurang bekerja sama, berkomunikasi, dan berinovatif dalam
Cukup 60– 69
pekerjaannya
7. Kesesuaian tujuan pengembangan aplikasi
2. Bekerja dalam tim, mandiri dan bertanggung jawab terhadap
pekerjaannya
3. Bekerja sama, berkomunikasi, dan berinovatif dalam pekerjaannya
Baik 70- 79
2. Bekerja dalam tim, mandiri dan bertanggung jawab terhadap
pekerjaannya
Sangat Baik ≥ 80 3. Bekerja sama, berkomunikasi, dan berinovatif dalam pekerjaannya
7. Kesesuaian tujuan pengembangan aplikasi

Ilovepdf - Teknologi Web Service

Diunggah oleh

Hak Cipta:

Format Tersedia

Ilovepdf - Teknologi Web Service

Diunggah oleh

Informasi Dokumen

Judul Asli

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

Ilovepdf - Teknologi Web Service

Diunggah oleh

Hak Cipta:

Format Tersedia

BAHAN MATERI

Fakultas Teknik & Informatika

1. Mengingat kembali konsep jaringan komputer

1. Dapat menangani kendala heterogenitas dan interoperabilitas.

Jaringan Komputer dapat mendukung konsep-konsep:

Perindustrian, Bea cukai, Dirjen Postel danbeberapa Instansi lainnya

Salah satu bentuk dari interoperability adalah interoperability government. Interoperabilitas

1. Meningkatkan efisiensi kinerja aparat dan layanan pemerintahan.

2.Meningkatkan transparansi pemerintahan.

3.Membantu pemerintah dalam menentukan kebijakan.

4.Memudahkan pencarian informasi, baik untuk pemerintah maupun masyarakat.

Beberapa contoh aplikasi layanan pemerintahan:

Fokus Pengembangan Interoperabilitas di pemerintahan, yaitu:

Sumber: KOMINFO, Strategi Integrasi Data Melalui Konsep Interoperabilitas Sistem

Teknik interoperabilitasakan memberikan efek positifdalamjangka panjang.

Sistem Terdistribusi dibutuhkan dengan beberapa alasan yaitu:

(contoh: aplikasi perbankan, komersial)

5. Sharing Data/Resource Resource adalah:

Contoh sistem terdistribusi:

Sumber: Budi Susanto, Pengantar Sistem Terdistribusi

● Jaringan yang teradministrasi secara lokal

Sumber: Budi Susanto, Pengantar Sistem Terdistribusi

Sistem terdistribusi multimedia.

Video, audio, text Multicast Contoh:

- Teleteaching tools, Video-conferencing, Video and audio on demand

Mobile dan sistem komputasi ubiquitous

Sumber: Budi Susanto, Pengantar Sistem Terdistribusi

5. World wide web

Shared resources (melalui URL)

Sumber: Budi Susanto, Pengantar Sistem Terdistribusi

A. Pengenalan Web Service

B. Jenis-Jenis Web Service Berdasarkan Manfaat

• Connect existing software

Contoh Dokumen SOAP Message Dokumen XML yang terdiri dari

d) Service Publication and Discovery (UDDI), Universal Description, Discovery

D. Arsitektur Web Service

Arsitektur mendeskripsikan struktur: Menurut (Bassetal.1998), Arsitektur

Bagaimana Web Service Beroperasi?

(memuat semua method public, XML untuk dikirim → berdasarkan

argumen dan return valuenya); plus WSDLnya)

dokumentasi yang human readable  Memanggil remote service tersebut

 Deploy (rilis) service

E. Operasi-Operasi Web Service

F. Keuntungan Menggunakan Web Service

PEMROGAMAN BERORIENTASI OBJEK

C. Konsep Dasar Pemrograman Berorientasi Objek

B. Best Practice OOP Bahasa Pemrograman Dart

Review konsep OOP dari mata kuliah Metode Perancangan Program

3. Atribut dan metod

C. Best Practice OOP Bahasa Pemrograman Dart

Hapus script tersebut

Pastikan file class.dart berada pada folder library

Cara pembuatan class.dart:

Klik kanan pada lib, new, ketikan : class.dart

oop_dart.dart (difolder bin) -> sbg program utama

class.dart (difolder lib) -> sebagai library class

4. Tahapan Praktikum Pemograman berorientasi objek

Case study u praktikum OOP adalah

1. Menciptakan class Manusia di file class.dart