TUGAS 3 – 0317 (INDIVIDU)

NAMA : LINDA LESTARINIM : 1411511668KELOMPOK : KA,TBMATA KULIAH : REKAYASA WEB

KONSEP MVCMVC adalah arsitektur aplikasi yang memisahkan

kode-kode aplikasi dalam tiga lapisan, Model, View dan Control. MVCtermasuk dalam arsitektural design pattern yang menghendaki organisasi kode yang terstruktur dan tidak bercampur aduk. Ketika aplikasi sudah sangat besar dan menangani struktur data yang kompleks, harus ada pemisahan yang jelas antara domain model, komponen view dan kontroler yang mengatur penampilan model dalamview.

Secara sederhana dapat dijelaskan bahwa MVC merupakan sistem dasar pada Codeigniter yang mengelompokkan fungsi-fungsi dalam framework tersebut berdasarkan tiga kategori menjadi Model, View dan Controller (MVC). Model : berfungsi untuk menangani semua fungsi yang

berhubungan dengan database. View : berfungsi untuk menangai bagian tampilan pada

aplikasi yang dibagnun dengan Codeigniter. Controller : berfungsi sebagai perantara atau pengontrol

pergerakan aliran data dari model menuju view dan sebaliknya.

CONTOH WEB FRAMEWORK MENGGUNAKAN KONSEP MVC

CodeIgniter adalah sebuah kerangka kerja yang berisi berbagai fungsi yang dapat digunakan untuk membuat fungsi-fungsi yang kompleks

Penggunaan CodeIgniter juga akan menghasilkan suatu struktur pemrograman yang sangat rapi, baik dari segi kode maupun struktur file phpnya. Struktur aplikasi yang rapi tentu sangat diperlukan dari sebuah aplikasi. Misalnya, jika terjadi suatu error dalam aplikasi, dengan code yang rapi kita dapat dengan mudah menemukan kesalahan tersebut. Bukan hanya itu, bayangkan suatu saat aplikasi yang kita bangun membutuhkan fungsi-fungsi lain yang sangat penting, tentu akan diperlukan pengembangan lebih lanjut. Dan sekali lagi, hal itu juga sangat memerlukan struktur coding yang rapi. Dengan menggunakan CodeIgniter, untuk mewujudkan struktur kode yang rapi sangat-sangat mungkin terjadi. Hal itu dikarenakan CodeIgniter dibangun berbasis MVC (Model, View, Controller) yang memisahkan antara tampilan dan logic aplikasi. 

KELEBIHAN CODEIGNITER

1. Berukuran sangat kecil. File download nya hanya sekitar 2MB, itupun sudah include dokumentasinya yang sangat lengkap.

2. Dokumentasi yang bagus. Saat anda mendownloadnya, telah disertakan dengan dokumentasi yang berisi pengantar, tutorial, bagaimana panduan penggunaan, serta referensi dokumentasi untuk komponen-komponennya.

3. Kompitabilitas dengan Hosting. CodeIgniter mampu berjalan dengan baik  pada hampir semua  platfom hosting. CodeIgniter juga mendukung database-database paling umum, termasuk MySQL.

4. Tidak ada aturan coding yang ketat. Terserah anda jika anda hanya ingin menggunakan Controller, tanpa View, atau tidak menggunakan Model, atau tidak salah satu keduanya. Namun dengan menggunakan ketiga komponennya adalah pilihan lebih bijak.

5. Kinerja yang baik. Codeigniter sangat cepat bahkan mungkin bisa dibilang merupakan framework yang paling cepat yang ada saat ini.6. Sangat mudah diintegrasikan. CodeIgniter sangat mengerti tentang pengembangan berbagai library saat ini. Karenanya CodeIgniter memberikan kemudahan untuk diintegrasikan dengan

library-library yang tersedia saat ini.7. Sedikit Konfigurasi. Konfigurasi CodeIgniter terletak difolder

aplication/config. CodeIgniter tidak membutuhkan konfigurasi yang rumit, bahkan untuk mencoba menjalankannya, tanpa melakukan konfigurasi sedikitpun ia sudah bisa berjalan.8. Mudah dipelajari. Disamping dokementasi yang lengkap, ia juga memiliki berbagai forum diskusi. 

KEKURANGAN CODEIGNITER

CodeIgniter tidak ditujukan untuk pembuatan web dengan skala besar.

Library yang sangat terbatas. Hal ini dikarenakan sangat sulit mencari plugin tambahan yang terverifikasi secara resmi, karena pada situsnya CodeIgniter tidak menyediakan plugin-plugin tambahan untuk mendukung pengembangan aplikasi dengan CI.

Belum adanya editor khusus CodeIgniter, sehingga dalam melakukan create project dan modul-modulnya harus berpindah-pindah folder.

XMLXML singkatan dari eXtended Markup Language adalah

bahasa markup yang digunakan untuk menyimpan data (tidak ada program) dan tidak tergantung dengan tools tertentu (seperti editor, dbms, compiler, dsb).

XML merupakan suatu bahasa Markup. Markup yaitu bahasa yang berisikan kode-kode berupa tanda-tanda tertentu dengan aturan tertentu untuk memformat dokumen teks dengan tag sendiri agar dapat dimengerti.

Pada android XML digunakan untuk merancang interface pada sebuah program yang akan dibuat.

CONTOH XML

<?xml version="1.0" encoding="UTF-8"?> <Resep nama="roti" waktu_persiapan="5 menit" waktu_masak="3 jam"><judul>Roti tawar</judul><bahan jumlah=“3“satuan=“cangkir">Tepung </bahan><bahan jumlah="0,25“ satuan="ons">Ragi</bahan><bahanjumlah="1,5“satuan="cangkir">Airhangat</bahan><bahan jumlah="1" satuan="sendok teh">Garam </bahan><Cara_membuat><langkah>Campur semua bahan dan uleni adonan sampai merata </langkah><langkah>Tutup dengan kain lembap dan biarkan selama satu jam di ruangan yang hangat.</langkah><langkah>Ulangi lagi, letakkan di loyang dan panggang di oven.</langkah><langkah>Keluarkan, hidangkan</langkah> </Cara_membuat></Resep>

JSONJSON (dibaca: “Jason”), singkatan dari JavaScript Object Notation adalah suatu

format ringkas pertukaran data komputer. Formatnya berbasis teks dan terbaca-manusia serta digunakan untuk merepresentasikan struktur data sederhana dan larik asosiatif (disebut objek).

Format JSON sering digunakan untuk mentransmisikan data terstruktur melalui suatu koneksi jaringan pada suatu proses yang disebut serialisasi. Aplikasi utamanya adalah pada pemrograman aplikasi web AJAX dengan berperan sebagai alternatif terhadap penggunaan tradisional format XML.

Walaupun JSON didasarkan pada subset bahasa pemrograman JavaScript (secara spesifik, edisi ketiga standar ECMA-262, Desember 1999 [1]) dan umumnya digunakan dengan bahasa tersebut, JSON dianggap sebagai format data yang tak tergantung pada suatu bahasa. Kode untuk pengolahan dan pembuatan data JSON telah tersedia untuk banyak jenis bahasa pemrograman. Situs json.org menyediakan daftar komprehensif pengikatan JSON yang tersedia, disusun menurut bahasa. (id.wikipedia.com)

CONTOH JSON

{"menu": {"id": "file","value": "File","popup": {"menuitem": [{"value": "New", "onclick": "CreateNewDoc()"},{"value": "Open", "onclick": "OpenDoc()"},{"value": "Close", "onclick": "CloseDoc()"}]}}}

data diatas setara dengan

<menu id="file" value="File"><popup><menuitemvalue="New“onclick="CreateNewDoc()“/><menuitem value="Open" onclick="OpenDoc()" /> <menuitem value="Close" onclick="CloseDoc()" /> </popup></menu>

AJAX Asynchronous JavaScript and XMLHTTP, atau disingkat AJaX, adalah suatu teknik pemrograman

berbasis web untuk menciptakan aplikasi web interaktif. Tujuannya adalah untuk memindahkan sebagian besar interaksi pada komputer web surfer, melakukan pertukaran data dengan server di belakang layar, sehingga halaman web tidak harus dibaca ulang secara keseluruhan setiap kali seorang pengguna melakukan perubahan. Hal ini akan meningkatkan interaktivitas, kecepatan, dan usability. Ajax merupakan kombinasi dari:

DOMyang diakses dengan client side scripting language, seperti VBScript dan implementasi ECMAScript seperti JavaScript dan JScript, untuk menampilkan secara dinamis dan berinteraksi dengan informasi yang ditampilkan

Objek XMLHTTP dari Microsoft atau XMLHttpRequest yang lebih umum di implementasikan pada beberapa browser. Objek ini berguna sebagai kendaraan pertukaran data asinkronus dengan web server. Pada beberapa framework AJAX, element HTML IFrame lebih dipilih daripada XMLHTTP atau XMLHttpRequest untuk melakukan pertukaran data dengan web server.

XML umumnya digunakan sebagai dokumen transfer, walaupun format lain juga memungkinkan, seperti HTML, plain text. XML dianjurkan dalam pemakaian teknik AJaX karena kemudahan akses penanganannya dengan memakai DOM

JSON dapat menjadi pilihan alternatif sebagai dokumen transfer, mengingat JSON adalah JavaScript itu sendiri sehingga penanganannya lebih mudah

Seperti halnya DHTML, LAMP, atau SPA, Ajax bukanlah teknologi spesifik, melainkan merupakan gabungan dari teknologi yang dipakai bersamaan. Bahkan, teknologi turunan/komposit yang berdasarkan Ajax, seperti AFLAX sudah mulai bermunculan.

Pada dasarnya ajax menggunakan XMLHttpRequest object Javascript untuk membuat request ke server secara asynchronous atau tanpa melakukan refresh halaman website. Yang dibutuhkan agar ajax dapat berjalan adalah javascript harus di enable pada browser yang digunakan. Walaupun javascript merupakan dasar dari Ajax, dimana javascript sangat susah pada implementasi dan maintenance, tetapi Ajax memiliki struktur pemrograman yang lebih mudah untuk dipahami. Anda tinggal membuat object XMLHttpRequest dan memastikan object tersebut terbentuk dengan benar. Kemudian menentukan kemana hasilnya akan ditampilkan atau dikirim.

Ajax dapat digunakan untuk melakukan banyak hal, seperti loading halaman HTML tanpa refresh halaman web, validasi form dan banyak lagi yang bisa dilakukan dengan ajax. Di tutorial ini Ajax akan dipadukan dengan bahasa pemrograman PHP yang sangat powerfull. Ajax bertugas melakukan request ke web server dan PHP yang berada di server akan melakukan apa yang diminta oleh Ajax, mengirim hasilnya ke web browser dan Ajax menampilkannya kepada user.

CONTOH AJAX

<html>

<head>

<title>Request file dengan Ajax</title>

<script language = “javascript”>

var XMLHttpRequestObject=false;if (window.XMLHttpRequest) {

XMLHttpRequestObject=newXMLHttpRequest();

} else if (window.ActiveXObject) {

XMLHttpRequestObject=newActiveXObject(“Microsoft.XMLHttp”);

}

function getdata(url,divhasil) {

if (XMLHttpRequestObject) {

var obj = document.getElementById(divhasil);

XMLHttpRequestObject.open(“GET”, url);

XMLHttpRequestObject.onreadystatechange = function() {

if (XMLHttpRequestObject.readyState == 4 &&

XMLHttpRequestObject.status == 200) {

obj.innerHTML = XMLHttpRequestObject.responseText;

}}XMLHttpRequestObject.send(null);}}</script></head><body><h1>Mengambil data dari file HTML</h1><form><input type=”button” value=”Tampilkan Data” onclick=”getdata(‘tampil.html’,’divhasil’)”></form><div id=”divhasil”>Isi dari tampil.html akan ditampilkan disini</div></body></html>

Cross-site request forgery(csrf)

CSRF (baca: sea surf) adalah serangan/exploitasi terhadap situs web dengan memanfaatkan pengguna yang sudah terautentikasi. CSRF mengexploitasi tingkat kepercayaan situs web terhadap pengguna dan menganggap setiap perintah adalah sah untuk dijalankan. Karena sifat inilah sangat sulit untuk menentukan sebuah aksi adalah murni dari pengguna atau karena kelemahan CSRF di situs.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.

WEBSOCKETWebSocket 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.

WebSocket merupakan sebuah protokol komunikasi dua arah yang dapat digunakan oleh browser. Jika pada AJAX kita hanya dapat melakukan komunikasi satu arah dengan mengirimkan request kepada server dan menunggu balasannya, maka menggunakan WebSocket kita tidak hanya dapat mengirimkan request kepada server, tetapi juga menerima data dari server tanpa harus mengirimkan request terlebih dahulu. Hal ini berarti ketika menggunakan WebSocket pengguna harus terus menerus terkoneksi dengan server, dan kita memerlukan sebuah server khusus untuk dapat menjalankan aplikasi WebSocket dengan benar. 

CONTOH WEBSOCKET

Client membaca inputan dari keyboard, kemudian mengirimkan hasilnya ke server melalui socket-nya.

Server membaca data yang dikirim oleh client di connection socket

Server mengubah data menjadi huruf besar Server mengirimkan data yang telah diubah menuju client

melalui socket-nya. Client membaca data yang dikirim oleh server dari client

socket-nya. Kemudian menampilkan data tersebut di monitor.