Teknologi WEB
Materi Bulan 1 Bagian I
Penilaian
UTS : 25%
UAS : 35%
WEB ?
Suatu ruang informasi di mana
Cara Kerja Web
Sebuah halaman Web diakses dengan cara menuliskan URLnya atau mengikuti link yang menuju kepadanya, menggunakan browser Web
URL menunjukkan lokasi dokumen yang dikelola oleh sebuah server Web
URL diubah menjadi alamat IP server Web ybs
Browser kemudian
mengirimkan request http ke server Web
Server Web akan menjawab dengan memberikan dokumen yang diminta, dalam format HTML
WEB 1.0
Web 1.0 secara umum dikembangkan
untuk pengaksesan informasi dan
memiliki sifat yang sedikit interaktif
Sifat web 1.0 adalah read
WEB 2.0
Menurut Tim O’Reilly, Web 2.0 dapat didefinisikan
sebagai berikut:
“Web 2.0 adalah revolusi bisnis di industri komputer yang disebabkan oleh penggunaan internet sebagai platform, dan merupakan suatu percobaan untuk memahami berbagai aturan untuk mencapai keberhasilan pada platform baru tersebut. Salah satu aturan terutama adalah: Membangun aplikasi yang mengeksploitasi efek jaringan untuk mendapatkan lebih banyak lagi pengguna aplikasi tersebut”
Karakter WEB 2.0
Web sebagai platform
Data sebagai pengendali utama
Efek jaringan diciptakan oleh arsitektur partisipasi
Inovasi dalam perakitan sistem serta situs disusun dengan menyatukan fitur dari pengembang yang terdistribusi dan independen (semacam model pengembangan "open source")
Model bisnis yang ringan, yang dikembangkan dengan gabungan isi dan layanan
Mudah untuk digunakan dan diadopsi oleh user
Teknik yang digunakan
Cascade style to untuk bahan isi dan presentasi
Falksonomi (metoda penandaan content dimana dengan konsep ini dimunculkan kata-kata yang berkaitan dengan content tersebut).
XML
Teknik Aplikasi Internet
HTML dan XHTML (eXtensible HyperText Markup Language).
Weblog-publishing tools
AJAX..?
Asynchronous JavaScript and XMLHTTP, atau
disingkat AJaX, adalah suatu teknik pemrograman berbasis web untuk menciptakan aplikasi web yang interaktif
Tujuannya adalah untuk memindahkan sebagian
The Web as Platform
Platform di sini adalah tempat suatu aplikasi dijalankan.
Contoh platform yang terkenal adalah Windows, di mana ada aplikasi-aplikasi seperti Microsoft Office dan Adobe Photoshop. Menggunakan Internet sebagai platform berarti aplikasi-aplikasi tersebut dijalankan langsung di atas Internet dan bukan di atas satu sistem operasi tertentu. Contohnya adalah Google yang bisa diakses dari sistem operasi mana pun. Contoh lainnya adalah Flickr yang juga bisa diakses dari sistem operasi mana pun.
Kelebihannya jelas, aplikasi-aplikasi Web 2.0 ini tidak lagi
Perbedaan
Yang menjadi kunci perbedaan dalam Web 2.0 dan Web 1.0 adalah keterbatasan pada Web 1.0 yang mengharuskan pengguna internet untuk datang ke dalam website tersebut dan melihat satu persatu konten di dalamnya.
Sedangkan Web 2.0 memungkinkan pengguna internet dapat melihat konten suatu website tanpa harus berkunjung ke alamat situs yang bersangkutan.
WEB 3.0
Konsep ini dapat diandaikan sebuah website
sebagai sebuah intelektualitas buatan
(Artificial Intelegence)
Aplikasi
–
aplikasi online dalam website
dapat saling berinteraksi
WEB Service..?
Adalah aplikasi yang dapat diakses oleh
aplikasi yang lain.
Menyimpan data dalam bentuk XML.
Teknologi WEB 3.0
SOAP
(Simple Object Access Protocol) adalah standar untuk
bertukar pesan-pesan berbasis XML melalui jaringan komputer atau sebuah jalan untuk program yang berjalan pada suatu sistem operasi (OS) untuk berkomunikasi dengan program pada OS yang sama maupun berbeda dengan menggunakan HTTP dan XML sebagai mekanisme untuk pertukaran data.
REST
Representational State Transfer atau transfer keadaan
Teknologi WEB 3.0 (lanjutan)
WSDL (Web Service Description Language)
format XML yang diterbitkan untuk menerangkan
webservice.
WSDL mendefinisikan:
pesan-pesan (baik yang abstrak dan kongkrit) yang dikirim ke dan menuju web service
koleksi-koleksi digital dari pesan-pesan (port type, antarmuka)
Bagaimana port type yang ditentukan dijadikan wire protokol di mana servis ditempatkan.
WDDX
Web Distributed Data eXchange.
Mekanisme pertukaran data dari lingkungan yang
Content Management System
Apa itu CMS ?
Mengapa Perlu CMS ?
Content and Design
Bagan CMS Basic
Keuntungan CMS
Fasilitas Dasar CMS
Apa itu CMS ?
CMS adalah software yang digunakan untuk
membuat, mengubah dan mempublikasikan content ke dalam sebuah website.
Fasilitas yang umumnya terdapat dalam CMS sangat banyak, terutama yang berkaitan dengan publikasi isi website, pengaturan halaman, pengubahan isi, pencarian dan lain-lain.
Sebuah CMS, dapat berbentuk program yang
sederhana, atau dapat juga merupakan suatu program kompleks yang terdiri dari berbagai modul-modul sesuai dengan fasilitas yang terdapat didalamnya
Mengapa perlu CMS ?
Karena para pengelola atau pemilik website yang tidak mahir dalam menggunakan kode HTML dapat melakukan pembuatan, pengubahan dan publikasi content terhadap website-nya sendiri.
CMS menyediakan framework manajemen proses yang dibutuhkan dalam pengembangan website yang menghendaki pengelolaan yang sering / dalam frekuensi yang tinggi.
Content dan Design
Content Providers
Design Template
Keuntungan CMS
Konsistensi design website dapat dijaga
Tidak diperlukan keahlian khusus untuk pengelolaan website
Content yang dikehendaki dapat dipublikasikan tanpa pengeditan oleh orang lain
Menghemat biaya untuk mempekerjakan web specialist
Notifikasi otomatis kepada pemilik website jika ada content yang sudah kadaluarsa
Memungkinkan kerjasama yang baik antar pengelola suatu website.
CMS
CMS yang banyak dipakai saat ini adalah website CMS (WCMS).
WCMS adalah perangkat lunak yang berfungsi untuk membangun dan memelihara/updating web,yang dirancang sedemikan rupa sehingga pemeliharaan dan proses pambuatan web lebih mudah, efektif, dan efesien.
kebanyakan WCMS yang banyak beredar pada
internet saat ini menggunakan :
Jenis-Jenis WCMS
WCMS Portal:
Adalah sebuah CMS yang mempunyai banyak layanan, seperti layanan berita, mailing list, email dan lain sebagainya. Misalnya : Joomla, Mambo, phpnuke, postnuke dsb.
WCMS E-Commere
Adalah sebuah website CMS yang bertujuan agar dapat melakukan proses transaksi online. Misalnya : OsCommerce, phpShop dsb.
WCMS E-Learning
Jenis WCMS (cont’d)
WCMS Forum
Adalah website CMS yang menyediakan media untuk proses diskusi secara online, Misalnya : phpBB, MiniBB dan lainnya.
WCMS Gallery
Manfaat CMS
Managenent Data
Ini merupakan fungsi utama dari CMS. Semua data/informasi baik telah ditampilkan ataupun belum dapat diorganisasikan dan disimpan secara baik. Suatu waktu data/informasi tadi dapat dipergunakan kembali sesuai dengan kebutuhan.
Manfaat CMS (cont’d)
Mengatur Siklus Hidup Website
Banyak CMS memberikan fasilitas kepada para penggunanya untuk mengelola bagian atau isi mana saja yang akan ditampilkan, bagian atau isi yang dimaksud terlebih dahulu di-review olah editor sehingga kevaliditasannya terjamin.
Mendukung Web Templating dan Standarisasi
Manfaat CMS (cont’d)
Personalisasi Website
Sebuah isi/informasi ditempatkan kedalam CMS, isi tersebut dapat ditampilkan sesuai dengan keinginan dan kebutuhan dari penggunanya. Terlebih lagi
dengan kelebihan CMS yang dapat memisahkan antara desain dan isi yanmenyebabkan proses personlisasi berjalan dengan mudah.
indikasi
Seidikasi memberikan kemungkinan kepada sebuah website untuk membagi isinya kepada website-website yang lain. Format data yang didukung juga
variatif, mulai dari rss, rdf, xml, hingga "backed scripting", sema halnya dengan personalisai, sindkikasi juga dapat dilakukan dengan mudah karena isi dan desain telah dibuat terpisah.
Akuntabilitas
Kolaborasi di CMS
1. Department/Division Project Manager
o Bertanggung jawab terhadap website, pemimpin projek, kontak
personal terhadap projek, membuat jadwal pengerjaan dll
o
2. Content Specialist
o Membuat/mengedit content, reporter, interviewer, dll.
3. Technical Lead/Web Developer
o CMS Administrator
Kolaborasi di CMS
Server/CMS Administrator
Bertanggung jawab dalam install dan konfigurasi CMS (termasuk module),
patch/update, membuat account pengguna CMS dan hak-hak-nya, memantau performance server dan CMS.
Database Administrator
Mengelola dan membuat account pengguna database, backup data,
memantau performace server.
Web Developer / Designer
Mengelola scripting program CMS, menambah module, membuat design
Tools CMS
Web browser (IE, Mozila Firefox)
Web Server (Apache)
Database Server (MySQL)
Script Engine (PHP)
Script Editor (Dreamweaver)
Software Upload (WS FTP Pro)
Pengenalan Wordpress
WordPress merupakan salah satu bentuk program web
site dinamis yg merupakan CMS (content managemen system) keuntungannya al:
Mudah mengubah isi Menambahkan halaman
memungkinkan interaksi timbal balik antara pemilik web dg
pembaca
WP mempunyai halaman tetap (page, relatif tidak sering/banyak
diubah/ditambahi isi halaman tsb) dan halaman dinamis/sering ditambahi isi, mirip isi koran/buku harian yang setiap hari/saat ditambah dg berita baru (page)
WP : Market Share
terbesar
Pengguna WordPress >27 juta
(2010)
Dari 27 juta ini, 13,9 juta merupakan para
blogger yang menggunakan WordPress dan
sebanyak 13,8 juta CMS WordPress yang
terinstal. Selain itu setiap harinya terdapat
350.000 artikel diterbitkan dan 400.000
komentar ditampilkan. Per November 2010
yang lalu WordPress 3.0 yang sudah
WP : Tersedia dalam 120 bahasa
Meskipun pada dasarnya berbahasa Inggris,
WordPress
telah
berkembang
sampai
Menu admin WP
Dashboard: menampilkan informasi singkat pengelolaan WP
Write:
Write post: untuk menuliskan posting/berita baru
Write Page: untuk menuliskan/menambahkan halaman baru
Manage:
Post: untuk meng-edit post Page: untuk meng-edit page
Upload: berisi daftar file yg telah di upload
Categories: utk menambahkan dan mengubah kategori/kelompok
berita pada post
Files : mengubah file-file sistem wp (hati-hati jika tidak
memahami benar tentang bahasa pemrograman php!)
Import: memindahkan isi dari program web yang lain
Menu admin WP (cont’d)
Comments (mrpkn bentuk interaksi dari
pembaca ke tulisan kita di web, dg ijin atau
pembatasan tertentu pembaca web dapat
memberikan komentar thp tulisan kita, dan
kitapun dpt melakukan tanggapan, disinilah
interaksi timbal balik terjadi, tidak hanya searah)
Comments: menemukan, mengubah komentar yg
mungkin tidak sesuai dg batasan yg kita berikan
Awating Moderation: jika komentar di batasi dg
persetujuan, maka diperlukan fasilitas ini utk
Menu admin WP (cont’d 2)
Bloroll: managemen link, diperlukan untuk
mengubah, menambah link dari web kita ke
web-web yg lain:
Manage Blogroll Add Link
Import Links
PrsentationMengubah tampilan web
Themes: memilih tampilan yg sudah tersedia
Widgets: mengubah letak/posisi menu pada web Theme Editor: mengubah file theme (hati-hati,
Menu admin WP (cont’d 3)
Plugins: fasilitas tambahan yg dpt
ditambahkan/diinstall sbg modul pelengkap
web
Users: untuk mengelola pengguna WP. Web
dg WP memungkinakan digunakan bersama
oleh beberapa users yang masing-maisng
dapat diatur kebolehannya
Menu admin WP (cont’d 4)
Option: Berisi berbagai hal pengaturan web
General: berisi info umum ttg web, informasi dan
ketentuan dpt diubah sesuai kebutuhan dan aturan yg ada
Writing: aturan dan tata cara penulisan.
Reading: pengaturan keterbacaan web
XML
Outline
Pendahuluan
Perbedaan antara XML dan HTML
Syntax XML
XML Parser
Apa XML itu?
XML kependekan dari eXtensible Markup Language, dikembangkan mulai tahun 1996 dan mendapatkan pengakuan dari W3C pada 10 Februari 1998.
It ought to be called the eXtensible Meta Language since it is a language used to
create other languages ?
Teknologi XML adalah teknologi keturunan dari SGML (Standard
Generalized Markup Language, ISO 8879) yang dikembangkan pada tahun 1980-an.
XML adalah suatu bahasa Markup, yaitu bahasa yang berisikan kode-kode berupa tanda-tanda tertentu dengan aturan tertentu untuk
memformat dokumen teks dengan tag sendiri agar dapat dimengerti. Contoh yang mirip : bahasa HTML, RTF, Wordstar
Perbedaan XML dan HTML
XML
HTML
Extensible set of tags Content orientated
Standard Data infrastructure
Allows multiple output forms
Fixed set of tags
Presentation oriented
No data validation capabilities
Penulisan elemen XML
Penulisan elemen XML di mulai dengan start tag, dan akhiri dengan end tag dan data diantaranya.
Contoh:
<director> Stepen Chow </director>
Contoh elemen lain dengan nilai yang sama:
<actor> Stepen Chow </actor>
Tag-tag XML case-sensitive: <CITY> <City> <city>
Penulisan elemen XML lanjt.
Suatu atribut pasangan antara nama dan nilai
dipisah dengan tanda =.
Example:
Penulisan elemen XML lanjt.
A basic XML document is an XML element that can, but might not, include nested XML elements.
Contoh: <books>
<book isbn=“123”>
<title> Second Chance </title>
<author> Matthew Dunn </author>
Penulisan elemen XML lanjt.
Aturan penulisan:
All elements must have an end tag.
All elements must be cleanly nested (overlapping
elements are not allowed).
All attribute values must be enclosed in quotation
marks.
Each document must have a unique first element,
XML Data Model
<BOOKS>
<book id=“123”
loc=“library”>
<author>Hull</author> <title>California</title> <year> 1995 </year> </book>
<article id=“555”
ref=“123”>
<author>Su</author> <title> Purdue</title> </article>
</BOOKS>
Hull Purdue
BOOKS
123 555
XML Parser
Untuk memproses dokumen XML dibutuhkan XML parser yakni sebuah program yang mampu melakukan decompose dokumen XML menjadi individual elemen. Ada dua kategori utama dari XML parser yakni Document Object Model (DOM) dan Simple API for XML (SAX).
DOM adalah language neutral API untuk mengakses dan memodifikasi dokumen yang bercabang-cabang (tree base) seperti dokumen HTML dan XML, DOM parser bekerja pada memory. Sedangkan SAX parser adalah parser event base yang hanya digunakan untuk membaca dokumen XML. SAX bekerja dari registrasi event. SAX sebenarnya bekerja lebih sederhana dibandingkan dengan DOM hanya saja memiliki beberapa kekurangan yakni :
Ketika dokumen XML dibaca maka tidak ada representasi dokumen di
memory.