Teks tersebut membahas beberapa konsep terkait pemrograman web seperti MVC, XML, JSON, AJAX, CSRF, dan WebSocket. MVC digunakan untuk memisahkan komponen utama aplikasi seperti manipulasi data, antarmuka pengguna, dan kontrol. XML digunakan untuk menyimpan data secara terstruktur sedangkan JSON lebih ringkas untuk pertukaran data. AJAX memungkinkan pertukaran data tanpa segarkan halaman. CSRF adalah teknik men

2. 1. Apa yang anda ketahui tentang konsep MVC (Model, View,
Controller) pada pemrograman web?jelaskan!, berikan
contoh web framework yang menggunakan konsep MVC
serta jelaskan kelebihan dan kekurangannya !

3. Model View Controller (MVC)
Model View Controller (MVC) merupakan suatu konsep
yang cukup populer dalam pembangunan aplikasi web,
berawal pada bahasa pemrograman Small Talk (Wikipedia),
MVC memisahkan pengembangan aplikasi berdasarkan
komponen utama yang membangun sebuah aplikasi seperti
manipulasi data, user interface, dan bagian yang menjadi
kontrol aplikasi. Terdapat 3 jenis komponen yang
membangun suatu MVC pattern dalam suatu aplikasi yaitu :
 View, merupakan bagian yang menangani presentation logic.
Pada suatu aplikasi web bagian ini biasanya berupa file
template HTML, yang diatur oleh controller. View berfungsi
untuk menerima dan merepresentasikan data kepada user.
Bagian ini tidak memiliki akses langsung terhadap bagian
model.

4.  Model, biasanya berhubungan langsung dengan database untuk
memanipulasi data (insert, update, delete, search), menangani
validasi dari bagian controller, namun tidak dapat berhubungan
langsung dengan bagian view.
 Controller, merupakan bagian yang mengatur hubungan antara
bagian model dan bagian view, controller berfungsi untuk
menerima request dan data dari user kemudian menentukan apa
yang akan diproses oleh aplikasi.
Singkat kata Model untuk mengatur alur database, View
untuk menampilkan web, sedangkan Controller untuk mengatur
alur kerja antara Model dan View. Jadi misalnya Anda ingin
membuat akun facebook atau e-mail. Pertama Anda akan melihat
tampilan sign-up / register itulah View, kemudian Anda
menuliskan form pengisian seperti username, password, dll dan
Anda klik sign-up / register maka di sini View memanggil
Controller dan Controller memanggil Model, sedangkan Model
mengecek apakah Anda sudah sesuai dengan kriteria pendaftaran
seperti sudah mengisi username, password dan lain sebagainya.
Kemudian Model menggembalikan (callback) ke Controller dan
Controller mengembalikan ke View, dan kita akan melihat
berhasil atau tidak kita sign-up/register.

6. 2. Apa yang anda ketahui tentang XML, JSON?jelaskan dan
berikan contohnya !

7. Pengertian XML
Definisi XML adalah kependekkan dari "Extensible Markup
Language". Ya tepat sekali, secara teknis itu harusnya EML. Loh
kenapa?
XML di manfaatkan dalam mendefinisikan dokumen dengan
format standar dimana yang dapat dibaca dan di dukung oleh aplikasi-
XML yang kompatibel.
Bahasa format xml bisa digunakan dengan halaman HTML, akan
tetapi XML itu sendiri bukan bahasa markup. Sebaliknya, XML itu
merupakan“metabahasa” yang dapat di pakai dalam membuat bahasa
markup untuk aplikasi khusus. Sebagai contoh nya itu, dapat
menggambarkan item yang bisa diakses di saat membuka halaman
Web. Dimana pada dasarnya, XML ini dapat memungkinkan Anda
untuk membuat database informasi tanpa memiliki database yang
sebenarnya. Yaa meskipun secara default hanya digunakan dalam
aplikasi Web, banyak program lainnya juga yang dapat menggunakan
dokumen XML, misalnya kode sumber aplikasi Android.

8. Mungkin jelasnya pengertian dari XML (Extensible Markup
Language) adalah bahasa markup untuk keperluan umum yang
telah disarankan oleh W3C dalam hal membuat dokumen markup
untuk kepentingan pertukaran data antar sistem yang beraneka
ragam. Tepatnya XML yaitu kelanjutan dari HTML (HyperText
Markup Language) dimana yang merupakan bahasa standar
untuk melacak Internet. Jadi, untuk membaca bahasa markup ada
kesinambungannya. Baca dan cari tahulah selengkap-lengkap nya.
XML justru didesain untuk mempu menyimpan data secara
lengkap, ringkas serta mudah dalam mengatur. Kata kunci utama
dari XML ini adalah data (jamak dari datum) apabila jika diolah
bisa memberikan informasi.
XML juga menyediakan suatu cara terstandarisasi namun
dapat dimodifikasi untuk menggambarkan isi dari dokumen.
Dengan sendirinya, XML dapat di gunakan dalam
menggambarkan sembarang view database, akan tetapi hanya
dengan suatu cara yang standar.

9. Kegunaan dan cara menggunakan
XML
Kegunaan dan Cara dalam Menggunakan XML – XML
ini memiliki kepanjangan (eXtensible Markup Language)
dimana dapat digunakan dalam berbagai aspek
pengembangan web, lumrah dipakai dalam
menyederhanakan penyimpanan dan juga pertukaran data.
Berikut di bawah ini ada beberapa penggunaan umum XML
untuk web saat ini:
 Banyak digunakan dalam pengembangan web
 Sebagai dokumentasi
 Sebagai pengembangan database

10. XML dalam Pengembangan Web
Di sisi lain, Anda bisa berpendapat bahwa ini
merupakan penggunaan paling luas dari XML, sebagai
XHTML.
Hal ini di karenakan XHTML hanya sebatas pengerjaan
ulang HTML 4.0, banyak situs HTML 4.0 yang memang
benar-benar menggunakan bentuk valid di XHTML.
Akan tetapi dalam hal manfaat XML itu sudah tidak ada
sebagai XHTML, tetapi disini Anda boleh membuat
dokumen web dari XML dengan menggunakan XSLT dimana
untuk mengubah dokumen Anda ke dalam bentuk HTML.
Lalu kemudian Anda dapat mengirim XML untuk prosesor
XSLT kepada server web dan pada akhirnya melayani hasil
nya yang ke browser web. Hal ini lah yang membuat
dokumentasi Anda tersedia dalam bentuk format apapun
yang Anda butuhkan untuk menjadi di dalamnya.

11. XML dan dalam Pengelolaan Konten
Banyak dari sekian situs-situs yang menggunakan XML.
Ironisnya, begitu banyak para desainer web dan juga
pengembang konten tidak tahu bahwa mereka sedang
menggunaka XML padahal XML ada disana. Hal ini bisa jadi
karena umumnya ada CMS atau dikenal dengan sistem
manajemen konten yang berada di depan XML yang dalam
membuatnya lebih mudah bagi si penulis konten.Kemudian
untuk menulis konten web mereka pun tidak perlu khawatir
atau panik dengan menulis HTML atau pun saat mendesain
halaman web nya bagi para si pengguna.

12. XML dan DokumentasiBegitu banyak perusahaan yang berpindah ke XML dimana dalam hal menulis
dokumentasi internal mereka. Keunggulan dari XML pada bagian dokumentasi adalah
bisa digunakan untuk menentukan bagaimana ciri-ciri umum dalam sebuah buku-
buku, koran, majalah, cerita, iklan, dan lainnya.
Kisah menarik tentang XML untuk dokumentasi ini adalah bahwa XML begitu
mudah dipahami bagi si pengguna pemula, baik dari dokumentasi yang sebenarnya, dan
juga kode XML sekitarnya. XML mampu digunakan untuk semua macam dari
dokumentasi, untuk penerbitan dalam bahan pemasaran:
 XML ini merupakan standar format dari struktur berkas (file).
 XSL ini merupakan standar dimana bertugas memodifikasi data yang diimpor dan
diekspor.
 XSD ini merupakan standar yang memiliki arti sebagai struktur database dalam XML.
 Pintar (Intelligence). XML juga dapat menangani berbagai level yang kompleksitas.
 Bisa dengan mudah dalam menyesuaikan. Dapat mengadaptasi untuk membuat bahasa
sendiri. Seperti Microsoft membuaat bahasa MSXML atau pun Macromedia
mengembangkan MXML.
 Mudah dalam pemeliharaannya.
 Sederhana yaa benar sekali XML lebih sederhana.
 Mudah pada dipindah-pindahkan (Portability).

13. Pengertian JSON
 JSON : JavaScript Object Notations
 JSON merupakan suatu syntax atau format untuk
menyimpan data atau digunakan dalam sebuah proses
pertukaran data.
 JSON merupakan sebuah format penukaran data yang
mudah dibaca da ditulis oleh manusia, serta mudah
diterjemahkan serta dibuat (generate) oleh komputer.
Format ini dibuat berdasarkan bagian dari Bahasa
Pemprograman JavaScript, Standar ECMA-262 Edisi ke-3 -
Desember 1999. JSON merupakan format teks yang tidak
bergantung pada bahasa pemprograman apapun karena
menggunakan gaya bahasa yang umum digunakan oleh
programmer keluarga C termasuk C, C++, C#, Java,
JavaScript, Perl, Python dll. Oleh karena sifat-sifat tersebut,
menjadikan JSON ideal sebagai bahasa pertukaran-data.

14. JSON terbuat dari dua struktur utama, yaitu:
 Kumpulan pasangan nama/nilai. Pada beberapa bahasa, hal
ini dinyatakan sebagai objek (object), rekaman (record),
struktur (struct), kamus (dictionary), tabel hash (hash table),
daftar berkunci (keyed list), atau associative array.
 Daftar nilai terurutkan (an ordered list of values). Pada
kebanyakan bahasa, hal ini dinyatakan sebagai larik (array),
vektor (vector), daftar (list), atau urutan (sequence).
Struktur-struktur data ini disebut sebagai struktur data
universal. Pada dasarnya, semua bahasa pemprograman
moderen mendukung struktur data ini dalam bentuk yang
sama maupun berlainan. Hal ini pantas disebut demikian
karena format data mudah dipertukarkan dengan bahasa-
bahasa pemprograman yang juga berdasarkan pada struktur
data ini.

15. Contoh Sintaks Script JSON
{"siswa":[
{"Nama":"Tama", "Umur":"17"}, {"Nama":"Adhi",
"Umur":"17"}, {"Nama":"Septian", "Umur":"18"}
]}

16. Penggunaan JSON Sebagai Objek pada
JavaScript
 Format yang digunakan JSON secara sintaks indentik aatau
memiliki kesamaan dengan code yang digunakan JavaScript
untuk membuat sebuah objek.
 Karena kesamaan inilah dibandingkan dengan
menggunakan parser (seperti yang dilakukan XML) sebuah
program JavaScript dapat menggunakan function JavaScipt
Standard untuk mengubah data pada JSON menjadi sebuah
objek asli JavaScript. Hal ini merupakan salah satu faktor
yang menjadikan JSON sebagai alternatif yang lebih baik
dibandingkan XML sebagai bahasa format pernyimpanan
dan pertukaran data.

17. Keunggulan JSON
JSON memiliki beberapa keunggulan dibandingkan
dengan XML terutama dapat penggunaan apikasi AJAX.
Beberapa kelebihan JSON antara lain :
 JSON lebih ringkas, cepat, dan mudah.
 JSON tidak menggunakan tag penutup
 JSON lebih cepat untuk dibaca dan ditulis
 JSON dapat menggunakan array
 JSON tidak perlu menggunakan parser khusus untuk diubah
menjadi sebuah objek, melainkan hanya perlu menggunakan
function default dari JavaScript.

18. 3. Apa yang anda ketahui tentang AJAX(asynchronous
JavaScript and XML)?Jelaskan dan berikan contohnya!

19. Pengertian AJAX
AJAX, singkatan dari “Asynchronous JavaScript and
XML“, merupakan metode suatu laman web menggunakan
JavaScript untuk mengirim dan menerima data dari server
tanpa harus menyegarkan (refresh) laman itu. XML adalah
sejenis markup language – seperti HTML, yang kerap dipakai
untuk mengirimkan data melalui internet. Belakangan ini,
JSON (“JavaScript Object Notation”) lebih populer dan bisa
dibaca – secara bawaan (native) – oleh JavaScript.
Berikut uraian yang lebih ringkas:
AJAX: Asynchronous JavaScript and XML. Sebuah sistem
untuk mengirim dan menerima data dari server tanpa
penyegaran laman (page refresh). (contoh di bawah)

20.  XML: eXtensible Markup Language. Sebuah bahasa untuk
mengorganisir data arbitrer. Menggunakan banyak sekali kurung
sudut (angle brackets): “<>”. (contoh)
HTML: HyperText Markup Language. Sebuah subset XML yang
khususnya berfungsi untuk menjelaskan dan mengorganisir
laman web. (contoh)
JSON: JavaScript Object Notation. Metode yang lebih modern
untuk memindahkan paket data yang sering dipakai bersama
dengan AJAX. Bisa dibaca secara bawaan oleh JavaScript. (contoh)
 Sebuah contoh perintah AJAX bisa berjalan seperti berikut:
 Client memanggil laman dari server
 Server merespon panggilan dan mengirimkan laman
 Client membuat perintah AJAX ke server dan memanggil lebih
banyak data
 Server mengirimkan data tersebut
 Client memutakhirkan laman dengan data tersebut tanpa me-
refresh laman.

21. Facebook, Gmail, dan Pinterest adalah contoh situs-situs
yang banyak menggunakan AJAX.
Bagian “Asynchronous” merujuk pada fakta bahwa
ketika JavaScript menyampaikan panggilan AJAX ke
webserver, ia terus berjalan sampai memperoleh respon – ia
tidak memblokir dan berhenti saat data sedang diproses oleh
server.

22. 4. Jelaskan mengenai Cross-site request forgery(csrf)!

23. Pengertian CSRF (Cross-site
Request Forgery)
 CSRF (Cross-site Request Forgery) merupakan suatu teknik
hacking untuk mendapatkan atau bahkan menguasai
suatu account dengan cara menyerang web yang dieksekusi
atas wewenang korban, tanpa dikehendakinya.
 CSRF merupakan teknik pemalsuan permintaan yang
berasal dari halaman web atau situs yang berbeda, saat
halaman situs dieksekusi oleh korban maka akan muncul
account baru yang tanpa dikehendaki si admin.
 Celah keamanan banyak di temukan di berbagai CMS,
contohnya CMS VCalendar.

25. Penulis buat sebuah cerita agar mudah di mengerti, ada seorang admin memiliki situs yang
dibangun dengan VCalendar, suatu saat dia login ke halaman administrator.

26. Setelah si admin login dan masuk ke menu pilihan user maka akan tampil para user di situs
tersebut.

27. Terlihat ada 3 buah account, pada saat itu juga diminta oleh seseorang temannya untuk membuka
suatu halaman situs.

28. Saat admin melakukan klik tiba-tiba muncul halaman daftar user untuk login.

29. 5. Apa yang anda ketahui tentang WebSocket serta berikan
contohnya!

30. Pengertian WebSocket
WebSocket adalah standar baru untuk komunikasi
realtime pada Web dan aplikasi mobile. WebSocket
dirancang untuk diterapkan di browser web dan server web,
tetapi dapat digunakan oleh aplikasi client atau server.
WebSocket adalah protokol yang menyediakan saluran
komunikasi full-duplex melalui koneksi TCP tunggal.
WebSocket merupakan bagian dari HTML5. WebSocket
menghadirkan pengurangan besar dalam lalu-lintas jaringan
yang tidak penting dan latency dibandingkan dengan solusi
polling dan long-polling yang telah digunakan untuk
mensimulasikan koneksi dua arah dengan cara menjaga dua
koneksi tetap terhubung.

31. Kapan WebSocket Pertama Kali Di
temukan ?
WebSocket pertama kali dirujuk sebagai TCP
Connection dalam spesifikasi HTML5, sebagai tempat untuk
berbasis TCP socket API. Pada bulan Juni 2008, Nama
WebSocket diciptakan oleh Ian Hickson dan Michael Carter,
serangkaian diskusi yang dipimpin oleh Michael Carter yang
mengakibatkan versi pertama dari protokol dikenal sebagai
WebSocket.

32. Manfaat WebSocket
 Websocket memungkinkan server untuk mendorong data
kepada klien yang terhubung
 Mengurangi traffic atau lalu lintas jaringan yang tidak perlu
dan latency menggunakan full duplex melalui koneksi
tunggal.
 Streaming melalui proxy dan firewall, mendukung
komunikasi simultan hulu dan hilir.
 Kompatibel dengan pre-WebSocket dunia dengan cara
beralih dari koneksi HTTP ke WebSockets.

33. Membuat WebSocket
Sebelum memulai tutorial, anda sebelumnya harus
memahami:
 Java programming language
 Basic knowledge Java EE 7
 Basic knowledge HTML 5, JavaScript, dan cascading style
sheets (CSS)
Cara paling mudah untuk memahami WebSocket
dengan menggunakan contoh aplikasi chat sederhana.
Berikut ini langkah membuat aplikasi WebSocket chat
sederhana dalam bahasa Java menggunakan annotation :
Kebutuhan :
 Install JAVA EE7
 Netbeans IDE reccomended version 7.3.1
 Glassfish Server 4.0