Konsep Pemrograman Web

1. KonsepPemrograman Web

2. KONSEP WEB World Wide Web ("WWW", atausingkatnya "Web") adalahsuaturuanginformasidimanasumber-sumberdaya yang bergunadiidentifikasiolehpengenal global yang disebut Uniform Resource Identifier (URI). WWW seringdianggapsamadengan Internet secarakeseluruhan, walaupunsebenarnyaiahanyalahbagiandaripadanya. Hiperteksdilihatdengansebuah program bernama browser web yang mengambilinformasi (disebut "dokumen" atau “halaman web") dari server web danmenampilkannya, biasanyadisebuah monitor. Kita laludapatmengikutipranaladisetiaphalamanuntukpindahkedokumen lain ataubahkanmengiriminformasikembalikepada server untukberinteraksidengannya. Inidisebut"surfing" atau "berselancar" dalambahasa Indonesia. Halaman web biasanyadiaturdalamkoleksi material yang berkaitan yang disebut “situs web".

3. KONSEP PEMROGRAMAN WEB (1) • Pemrograman web: membuataplikasiberbasis web • Aplikasiberbasis web: Aplikasi yang dibuatdenganmemanfaatkanmekanismedanaplikasi yang sudahadapadasistem web (WWW) • Sistem web sebenarnya merupakan aplikasi yang: • Berarsitektur client-server • software web browser di sisi client • software web server di sisi server • Menggunakanprotokol HTTP dalamkomunikasiantara client & server • Mempunyaifungsiuntukmengambil/menjalankanisi file dokumen web di server danmenampilkannyadisisi client

4. KONSEP PEMROGRAMAN WEB (2) • Membuataplikasiberbasis web berarti: • Memperkayafungsi web server dengancaramenambahkan program padadokumen web yang akandieksekusioleh server ketika file dokumen web tersebutdiaksesoleh web server • Misalnya, program yang mengambil data ke basis data untukditampilkanke web browser • Memperkayainteraktivitasdokumendengancaramenambahkan program padadokumen web yang akandieksekusioleh web browser ketika file dokumentersebutditampilkanoleh web browser • Misalnya, program yang memvalidasi data masukanpada form sebelumdisubmitke web server

5. KELEBIHAN & KEKURANGAN APLIKASI BERBASIS WEB • Kelebihan : • Dapat diakses kapan pun dan dari mana pun selama ada internet • Dapatdiakseshanyadenganmenggunakan web browser (umumnyasudahtersediadi PC, PDA, danhandphoneterbaru), tidakperlumenginstallaplikasi client khusus • Kekurangan: • Antarmuka yang dapatdibuatterbatassesuaispesifikasistandaruntukmembuatdokumen web danketerbatasankemampuan web browser untukmenampilkannya • Terbatasnyakecepatan internet mungkinmembuatresponaplikasimenjadilambat

6. ARSITEKTUR WEB • Bagaimana Web Bekerja ? • user mengetik URL di browser • browser menghubungi server yang tersebutpada URL • setelahterhubung, browser mengirimkan HTTP request • server menjawabdenganmengirim HTTP response (berisi header danisidokumen) • untukdokumenygterdiriatasbeberapa file (misalnyadokumenbergambar), browser harusmengirimkan HTTP request lagiuntuksetiap file • browser menampilkan semua isi dokumen kepada user

7. YANG PERLU DIPELAJARI UNTUK MEMBUAT • APLIKASI BERBASIS WEB • Di sisi client: • Sintakspembuatandokumen web (HTML & CSS) • Client side scripting (JavaScript) • Di sisi server • Mekanismepemanggilan program danpengambilan output program oleh web server (CGI) • Server side scripting (PHP, JSP, ASP, dll. Untukcontoh: PHP) • Penghubung • Sintakspengalamatandokumen web (URL) • Protokolkomunikasi (HTTP)

8. CLIENT SIDE PROGRAMMING Dalamjaringankomputer, kata “client side” mengacukepadaoperasi yang dilakukanoleh client padasuatuhubungan “client-server” . Secaraumum, suatu client adalahsatuaplikasikomputer, seperti web browser yang berjalanpadasatukomputerlokalpenggunaatau workstation danterhubungkesatu server. Operasidapatdilakukan client-side karenaoperasitersebutmembutuhkanakseskeinformasiataufungsi yang tersediapada client tetapitidakpada server, karenapenggunamembutuhkanobservasiterhadapoperasitersebutataumenyediakan input, atau server kekurangankekuatanpemrosesanuntukmelakukanoperasi yang tepatwaktuuntukseluruh client yang harusdilayaninya. Sebagaitambahan, jikaoperasidapatdilakukanoleh client tanpamengirim data melaluijaringan, makahalitumemakanwaktulebihsedikit, menggunakanlebihkecil bandwidth danmengurangiresikokeamanaan.

9. CLIENTSIDE PROGRAMMING Client-side scripting umumnyamengac pd kelas WEB ygdieksekusi client-slide, oleh web browses nyapengguna. Tipepemtogramankomputeradhbagianpentingdarikonsep Dynamic HTML (DGTML), ygmemungkinkan WEB pages di-script: yakni, agakmemilikiperbedaa & perubahanisiygbergantungpadamasukanpeaka, kondisilngkuga (sepetiwaktudalamhari) atavariabel lain. Pembuatan WEB (WEB Author) membuatsriptpada script pada client-side dlmbahasasepertiJava Script (Client-site Java Script) atauVBScript, ygdidasarkanpadabeberapastandarberikut : HTML scripting HTTP Document Object Model

10. CLIENT SIDE PROGRAMMING • Client-side scripts seringkalidisisipkandlmsebuahdokumenHTML, tetapiiamungkinjugadimasukkandalam file terpisah, yang ditunjukolehdokumen (ataudokumen- dokumen) yang menggunakan-nya. Selama request/permintaan, file-file yang diperlukandikirimkekomputerpemakaiolehweb server (atau server) dimanamerekaberada. web browser pemakaimenjalankan script, kemudianmenampilkandokumen, termasuksemua output yang mungkindari script tsb. Client-side scripts mungkinjugaberisiinstruksi-instruksibagi browser untukdiikutijikapemakainberinteraksidengandokumendalamsuatucaratertentu, contoh, click button tertentu. Instruksiinidapatdiikutitanpakomunikasilebihlanjutdengan server. • Denganmenampilkan file yang berisi script, pemakai-pemakaimungkindapatmelihatsource code - nya. Banyakpembuat web belajarbagaimanamembuatsebagian client-side scripts denganmenguji source code untukpembuat script lain.

11. Sebaliknya, server-side scripts, ditulisdalambahasasepertiPerldanPHP, yang dijalankanoleh web server ketikapemakaimeminta/request suatudokumen. Merekamenghasilkan output dalambentuk yang dapatdimengertioleh web browser (biasanya HTML), yang kemudianmengirimkekomputerpemakai. Pemakaitidakdapatmelihat source code-nya script (kecualipembuatmempublikasikan code secaraterpisah), & bahkanmungkinsecaratidaksadarbahwa script telahdieksekusi. Dokumendihasilkanoleh server-side script, tentusaja, berisi client-side scripts. • Client-side scripts have greater access to the information and functions available on the user's computer, whereas server-side scripts have greater access to the information and functions available on the server. Server-side scripts require that their language's interpreter is installed on the server, and produce the same output regardless of the client's browser, operating system, or other system details. Client-side scripts do not require additional software on the server (making them popular with authors who lack administrative access to their servers); however, they do require that the user's web browser understands the scripting language in which they are written. It is therefore impractical for an author to write scripts in a language that is not supported by the web browsers used by a majority of his or her audience.

12. SERVERSIDE PROGRAMMING • Padajaringankomputer, istilah server-side mengacupadaoperasi-operasi yang dilakukanoleh server dalamhubungan client-server. • Khususnya, suatu server adalahsuatu software program, seperti web server, yang berjalanpadasuatu remote server, yang dapatdijangkaudarikomputerlokalpemakaiatau workstation. Operasi-operasimungkindilakukan server-side karenamerekamembutuhkanakseskeinformasiataufungsi yang tidaktersediapada client, ataumemerlukanperilakukhusus yang tidakdapatdipercayaketikaitudilakukan client- side. • Operasi-operasi Server-side jugamencakuppemrosesandanpenyimpanan data darisuatu client kesuatu server, yang dapatdilihatolehsuatukelompok/group client.

13. Server-side scripting adalahsuatuteknologiweb server yang manasebuahpermintaanpemakaidipenuhidenganmenjalankansuatu script secaralangsungpada web server untukmenghasilkan dynamic HTML pages. Hal inibiasanyadigunakanuntukmenyediakan web site yang interaktif yang merupakanantarmukake database atausimpanan data lain. Hal iniberbedadenganclient-sidescriptingdimana scripts dijalankanoleh viewing web browser, biasanyadalamJavaScript. Keuntunganutama server-side scripting adalahkemampuanuntukrespon highly customize the response based on the user's requirements, access rights, or queries into data stores.

14. Di masalalu web halinihampireksklusifdilakukanpenggunaansuatukombinasidari C program, Perl script dan Shell script yang menggunakan Common Gateway Interface (CGI). Script-script tsbdijalankanoleh operating system, danhasilhanyadilayanikembalioleh web server. Saatini, Bahasa online scripting lain seperti ASP dan PHP dapatdijalankansecaralangsungoleh web server sendiriatauoleh extension modules (contohmod_perlataumod_php) ke web server. Baik format scripting (yaitu. CGI ataupelaksanaan yang langsung) dapatdigunakanuntukmembangun multi-page site yang kompleks, tetapiumumnyamengarahkanpelaksanaan yang mengakibatkanpenurunanongkosexploitasidalamkaitandenganketiadaanpanggilanke interpreter yang eksternal. Website yang dinamiskadang-kadangjugadiperkuatoleh server aplikasi web tertentu, sebagaicontoh Python "Base HTTP Server" library, walaupunbeberapatidakmempertimbangkanhaliniuntukmenjadi server-side scripting.

15. Daftarteknologi server-side scripting • Programming language manapundapatmenghasilkan web pages melalui CGI atausuatumodul extension atau application server framework. This section lists technologies designed mainly or exclusively for server-side scripting, typically by embedding instructions directly in template web pages. • ASP • Microsoft designed solution allowing various languages (though generally VBscript is used) inside a HTML-like outer page, mainly used on Windows but with limited support on other platforms. • ColdFusion • Cross platform tag based commercial server side scripting system. • JSP • Sistemberbasis Java untukmenyisipkanystem for embedding code in HTML pages. • Lasso • A Datasource neutral interpreted programming language and cross platform server. • SSI • A fairly basic system which is part of the common apache web server. Not a full programming environment by far but still handy for simple things like including a common menu. • PHP • Common opensource solution based on including code in its own language into an HTML page. • Server-side JavaScript • A language generally used on the client side but also occasionally on the server side. • SMX • Lisplikeopensource language designed to be embedded into an HTML page. • [edit]

16. WEB SERVER SOFTWARE • Server web adalahsebuahperangkatlunak server yang berfungsimenerimapermintaan HTTP atau HTTPS dariklien yang dikenaldengan browser web danmengirimkankembalihasilnyadalambentukhalaman-halaman web yang umumnyaberbentukdokumen HTML. Server web yang terkenaldiantaranyaadalah Apache dan Microsoft Internet Information Service (IIS). Apache merupakan server web antar- platform, sedangkan IIS hanyadapatberoperasidisistemoperasi Windows. • Server web jugadapatberartikomputer yang berfungsisepertidefinisidiatas.

17. WEB SERVER SOFTWARE (LANJUTAN) • XAMPP adalahsuatupaket software free berisiApache HTTP Server, MySQLdatabasedan tool yang perluutukmenggunakanPHPdanPerl programming languages. Program di-release dibawahnaungan GNU General Public License danlayananbersifatbebas, mudahdigunakanweb server, mampumemberihalaman-halaman yang dinamis. Saatini, XAMPP sudahtersediauntukWindows, Linux, Sun Solaris & Mac OS X (X dalamnamanyadapatbermaknadapatdigunakanuntuksalahsatudarioperating systemsini). • Secararesmi, XAMPP adalahhanyadiharapkanuntukpenggunaansebagaialatpengembangan, mengijinkanparaperancangdanpara programmer website untukmengujipekerjaanmerekapadakomputermerekasendiritanpaakseske Internet. DalamPraktek, bagaimanapun, XAMPP adalahkadang- kadangdigunakanuntukbenar-benarmelayanihalaman web pada World Wide Web, dandenganbeberapamodifikasiumumnyadisepakaticukupmenjaminkeamanan.

18. HTTP • HTTP (HyperText Transfer Protocol) adalahprotokol yang dipergunakanuntukmentransferdokumendalam World Wide Web (WWW). Protokoliniadalahprotokolringan, tidakberstatusdangenerik yang dapatdipergunakanberbagaimacamtipedokumen. • Pengembangan HTTP dikoordinasiolehKonsorsium World Wide Web (W3C) dankelompokkerja Internet Engineering Task Force (IETF), bekerjadalampublikasisatuseri RFC, yang paling terkenal RFC 2616, yang menjelaskan HTTP/1,1, versi HTTP yang digunakanumumsekarangini. • HTTP adalahsebuahprotokolmeminta/menjawabantara client dan server. Sebuh client HTTP seperti web browser, biasanyamemulaipermintaandenganmembuathubungan TCP/IP ke port tertentudituanrumah yang jauh (biasanya port 80). Sebuah server HTTP yang mendengarkandi port tersebutmenunggu client mengirimkodepermintaan (request), seperti "GET / HTTP/1.1" (yang akanmemintahalaman yang sudahditentukan), diikutidenganpesan MIME yang memilikibeberapainformasikodekepala yang menjelaskanaspekdaripermintaantersebut, diikutdenganbadandari data tertentu. Beberapakepala (header) jugabebasditulisatautidak, sementaralainnya (sepertituanrumah) diperlukanolehprotokol HTTP/1,1. Begitumenerimakodepermintaan (danpesan, bilaada), server mengirimkembalikodejawaban, seperti "200 OK", dansebuahpesan yang diminta, atausebuahpesan error ataupesanlainnya.

19. HTTP • Sejarah • Protokol HTTP pertama kali dipergunakandalam WWW padatahun 1990. Padasaattersebut yang dipakaiadalahprotokol HTTP versi 0.9. Versi 0.9 iniadalahprotokol transfer dokumensecaramentah, maksudnyaadalah data dokumendikirimsesuaidenganisidaridokumentersebuttanpamemandangtipedaridokumen. • Kemudianpadatahun 1996 protokol HTTP diperbaikimenjadi HTTP versi 1.0. Perubahaniniuntukmengakomodasitipe-tipedokumen yang hendakdikirimbesertaenkoding yang dipergunakandalampengiriman data dokumen. • Sesuaidenganperkembanganinfrastruktur internet makapadatahun 1999 dikeluarkan HTTP versi 1.1 untukmengakomodasi proxy, cache dankoneksi yang persisten.

20. HTTP ContohTransaksi S = Server C = Client C : (Inisialisasikoneksi) C : GET /index.htm HTTP/1.1 C : Host: www.wikipedia.org S : 200 OK S : Mime-type: text/html S : S : -- data dokumen -- S : (close connectioin)

21. Mekanisme CGI (Common Gateway Interface) • Jikadokumen web yang dimintaoleh web browser merupakan file program atau file HTML yang disisipi program, maka web server akanmenjalankan (run) file tersebutdenganbantuan interpreter atausistemoperasi • Informasi yang diberikanoleh web server kepada program: • Server variables: berbagaiinformasi yang adapada HTTP request yang sedangditerima, namadan path file program, kapabilitas web server, dll • Environment variables: informasi yang telahdiset (mungkinolehaplikasi lain) padalingkungansistemoperasi • Cookie: isi cookie yang disimpandi web browser • Request parameter: input dari user yang dikirimkanbersamaandengan HTTP request oleh web browser • Hasil output program ke standard output (screen) akandiambiloleh web server untukdikirimkankepada web browser sebagai HTTP response

22. CGI pada PHP • Pada PHP: • Server variables diletakkanpada predefined variable $_SERVER • $_SERVER[“PHP_SELF”] = path dannama file yang sedangdieksekusi • $_SERVER[“SERVER_NAME”] = nama host/server • $_SERVER[“REQUEST_METHOD”] = jenismetode request • $_SERVER[“HTTP_USER_AGENT”] = identitas web browser yang melakukan request • $_SERVER[“REMOTE_ADDR”] = nomor IP user dll • Environment variables diletakkanpada predefined variable $_ENV • Cookie diletakkanpada predefined variable $_COOKIE • Request parameter diletakkanpada predefined variable $_GET, • $_POST, $_FILES • Output menggunakanperintahecho

23. PENANGANAN STATE

24. KONSEP “Task” DALAM APLIKASI BERBASIS WEB • Aplikasimempunyaisejumlahfitur/fungsi yang memungkinkan user untukmelakukansejumlah task • Untukmemenuhisuatu task, dapatdigunakansatuataulebihhalaman web sebagaiantarmuka • Contoh task yang menggunakansatuhalaman web: • Membacaartikelnomortertentu • Menambahkan entry barupada guest book • Contoh task yang menggunakanlebihdarisatuhalaman web: • Membelibarangsecara online • halaman 1: menampilkandaftarbarangygadauntukdipilih • halaman 2: mengisialamatpengiriman • halaman 3: menampilkaninformasitransaksi yang barusajadilakukan P ilih bar an g : - b u k u - m a in a n - a lat t u lis - pak a ian - m a k a n a n An d a m e m b e li : main a n aka n d ik ir im ke : Jl. G a n e s h a Ma s u k k a n a la m at pen g ir im a n : ..... ........... .... ..... ........... .... • Antarahalaman web yang satudengan yang lain harusadakomunikasimengenai state dari task (misalnya, halaman 3 butuhinformasimengenaibarang yang telahdipilihpadahalaman 1)

25. STATELESS HTTP • Permasalahan: HTTP bersifat stateless: satu request salingindependenterhadap request lainnya, tidakada state (variabel) yang dipertahankan Link link <a href='page2.php‘> <a href='page3.php‘> page1.php page2.php page3.php $a = 1; echo $a; //nothing echo $a; //nothing • Cara untukmengatasi HTTP yang stateless: • Message passing via URL/Form • Cookie • Session

26. PENANGANAN STATE

27. MESSAGE PASSING VIA URL • Nilaivariabeldilewatkanmelalui parameter URL • KIRIM: mengkonstruksi parameter pada URL • TERIMA: aksesvariabel$_GET link <a href='page2.php?a=1'> link <a href='page3.php?a=1'> page1.php page2.php page3.php $a = $_GET["a"]; echo $a; //1 echo "<a href='page3.php?a=$a'>"; $a = $_GET["a"]; echo $a; //1 $a = 1; echo "<a href='page2.php?a=$a'>";

28. MESSAGE PASSING VIA FORM • Nilaivariabeldilewatkanmelalui input tipe hidden pada form HTML • KIRIM: mengkonstruksi input tipe hidden dalam form • TERIMA: aksesvariabel $_GET atau $_POST (tergantung method pada form) submit (POST) <input type='hidden' name='a' value='1'> submit (POST) <input type='hidden' name='a' value='1'> page1.php page2.php page3.php $a = $_POST["a"]; echo $a; //1 echo "<input type='hidden' name='a' value='$a'>"; $a = 1; echo "<input type='hidden' name='a' value='$a'>"; $a = $_POST["a"]; echo $a; //1