3.3 Istilah-istilah Dalam CSS Style rule  Cascading style sheet merupakan kumpulan aturan yang mendefinisikan o style dari document. Sebagai contoh kita bisa membuat aturan style yang o menentukan bahwa semua

di tampilkan dengan warna biru.  selector { property1: value; property2:value, . . .}  H1{ color:green; background-color:orange} Style sheets terdiri dari dua bagian: 1. Selector  Bagian pertama sebelum tanda “{}” disebut selector 2. Declaration  Terdiri dari property dan value Antara property yang satu dan yang lainnya dipisahkan dengan tanda ; (titik koma). 3.4 Komentar Pada CSS  Komentar biasa digunakan untuk memberi keterangan pada css yang dibuat.  Komentar tidak akan ditampilkan pada browser  Komentar dalam CSS dibuat dengan /* tulis komentar di sini */

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

81

3.5 Class Selector  Class selector o Diawali dengan tanda titik (.) dan diikuti nama class o .namakelas {….} o Digunakan agar sebuah objek bisa menggunakan deklarasi CSS tersebut o Misalnya

…

Artinya paragraf tersebut menggunakan aturan yang ditetapkan dalam class selector judul.  ID selector o Diawali dengan tanda titik (#) dan diikuti nama id o #namaid {….} o Digunakan agar sebuah objek bisa menggunakan deklarasi CSS tersebut dan biasanya bersifat unik dalam sebuah halaman o Misalnya

…

o Artinya paragraf tersebut menggunakan aturan yang ditetapkan dalam id selector header. 3.6 CSS Background Properties CSS background properties digunakan untuk mengatur tampilan background pada sebuah elemen. Misalnya menentukan warna background, membuat background berupa gambar, dan menentukan posisi background. Property

Description

Values

background

Property yang digunakan untuk menyeting semua backgroung property dalam sebuah deklarasi saja.

background-color background-image background-repeat backgroundattachment background-position

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

82

backgroundattachment

Menentukan apakah background gambar fixed atau scroll

scroll fixed

backgroundcolor

Menentukan warna background

color-rgb color-hex color-name transparent

backgroundimage

menentukan gambar sebagai background

url none

backgroundposition

Menentukan posisi awal background yang berupa gambar

top left top center top right center left center center center right bottom left bottom center bottom right x-% y-% x-pos y-pos

backgroundrepeat

Menentukan bagaimana background yang berupa gambar akan ditampilkan secara berulang

repeat repeat-x repeat-y no-repeat

3.7 CSS Text Properties CSS Text properties digunakan untuk mengatur tampilan text. Misalnya menentukan warna text, perataan text dan dekorasi text. Property

Description

Values

color

Menentukan warna text

color

letter-spacing

Menentukan jarak spasi antar huruf

normal length unit

text-align

Perataan text dalam sebuah element

left right center justify

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

83

textdecoration

Menambahkan dekorasi ke dalam text

none underline overline line-through blink

text-indent

Memberikan indent pada baris pertama

length %

text-transform

Menentukan bentuk huruf

none capitalize uppercase lowercase

white-space

Menentukan bagaimana white space akan ditangani

normal pre nowrap

word-spacing

Menentukan jarak spasi antar kata

normal length

3.8 CSS Border Properties CSS border properties digunakan untuk mengatur border di setiap elemen. Misalnya saja warna border, ketebalan border dan style border. Property

Description

Values

border

Digunakan untuk menentukan property border(atas, kiri, kanan, bawah) dalam satu deklarasi saja

border-width border-style border-color

border-bottom

Digunakan untuk menentukan property border bagian bawah dalam satu deklarasi saja

border-bottom-width border-style border-color

border-bottom-color

Menentukan warna border bawah

border-color

border-bottom-style

Menentukan style border bawah

border-style

border-bottom-width

Menentukan lebar border bawah

thin medium

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

84

thick length border-color

Menentukan warna keempat border

color

border-left

Digunakan untuk menentukan property border bagian kiri dalam satu deklarasi saja

border-left-width border-style border-color

border-left-color

Menentukan warna border kiri

border-color

border-left-style

Menentukan style border kiri

border-style

border-left-width

Menentukan lebar border kiri

thin medium thick length

border-right

Digunakan untuk menentukan property border bagian kanan dalam satu deklarasi saja

border-right-width border-style border-color

border-right-color

Menentukan warna border kanan

border-color

border-right-style

Menentukan style border kanan

border-style

border-right-width

Menentukan lebar border kanan

thin medium thick length

border-style

Menentukan style dari keempat border sekaligus

None / hidden / dotted / dashed / solid / double / groove / ridge /inset / outset

border-top

Digunakan untuk menentukan property border bagian atas dalam satu deklarasi saja

border-top-width border-style border-color

border-top-color

Menentukan warna border atas

border-color

border-top-style

Menentukan style border atas

border-style

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

85

border-top-width

Menentukan ukuran border atas

thin / medium / thick length

border-width

Menentukan ukuran dari keempat border sekaligus

thin / medium / thick length

3.9 CSS Margin Properties CSS margin properties digunakan untuk mengatur jarak (spasi) di sekitar elemen. Property

Description

margin

Mensatur margin properti untuk kempat sisi (atas, kanan, bawah, kiri) sekaligus

margin-bottom

Mengatur margin bawah

margin-left

Mengatur margin kiri

margin-right

Mengatur margin kanan

margin-top

Mengatur margin atas

3.10 CSS Padding Properties CSS padding properties digunakan untuk menentukan spasi antara border elemen dengan isi element. Property

Description

Values

padding

Menentukan empat padding sebuah elemen (atas, kanan, bawah, kiri) sekaligus

padding-top padding-right padding-bottom padding-left

padding-bottom

Menentukan padding bawah sebuah elemen

length %

padding-left

Menentukan padding kiri sebuah elemen

length %

padding-right

Menentukan padding kanan sebuah elemen

length %

padding-top

Menentukan padding atas sebuah elemen

length %

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

86

3.11 CSS List Properties CSS list properties digunakan merubah jenis list, memberi gambar sebagai pengganti bullet, dll. Property

Description

Values

list-style

Digunakan untuk menentukan semua list properties sekaligus.

list-style-type list-style-position list-style-image

list-style-image

Menetapkan penanda list

none url

list-style-position

Menentukan tempat penanda list item

inside outside

list-style-type

Menentukan tipe penanda list item

none disc circle square decimal decimal-leadingzero lower-roman upper-roman lower-alpha upper-alpha lower-greek lower-latin upper-latin

image

sebagai

# Pertemuan 11. Latihan Menggunakan CSS : <style type="text/css">
87

border-style : solid; border-color:#00FF00; border-width: 1PX; } -->

Form Cantik
Nama
Alamat
Email
Pesan

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

88

Chapter 4 Java Script ====================================== 4.1 Pendahuluan Java script adalah sebuah semi-bahasa pemrograman yang bersifat Client Side yang berfungsi sebagai alat untuk menciptakan sebuah suatu halaman Web yang interaktif dan dinamis. Berbeda dengan java, javascript tidak memiliki kompiler seperti halnya java. Sifat yang sama dengan bahasa java adalah javascript bersifat interpreter, yaitu script yang telah dibuat di text editor seperti notepad atau wordpad akan dibaca perbaris dari baris awal sampai akhir.

4.2 Kelebihan dan Kekurangan Javascript 4.2.1 Kelebihan Javascript 1. Ukuran file kecil Script dari javascript memiliki ukuran yang kecil sehingga ketika web yang memiliki javascript ditampilkan di browser maka akses tampilannya akan lebih cepat dibandingkan ketika browser membuka suatu web yang memiliki script java. Hal ini juga sangat berkepentingan dengan daya kerja server. Semakin kecil space suatu web yang disimpan dalam suatu server maka daya kerja server ketika di browsing oleh user di internet akan tidak terlalu berat, selain itu sifat javascript client side yang tidak perlu lagi di olah oleh server ketika browser memanggil web dari sebuah server.

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

89

2. Mudah untuk dipelajari Javascript merupakan bahasa semi pemograman yang merupakan gabungan antara bahasa pemograman java dengan bahasa kode HTML sehingga disebut bahasa hybrid. Walaupun javascript merupakan turunan dari java namun javascript tidak memiliki aturan yang serumit java. 3. Terbuka Javascript tidak terikat oleh hardware maupun software tertentu bahkan system operasi seperti windows maupun unix. Karena ia bersifat terbuka, maka ia dapat dibuat maupun di baca di semua jenis komputer. 4. Cepat Dapat diletakkan langsung dalam file HTML jadi bisa sekaligus dan cepat dalam memanipulasi suatu halaman Web. 4.2.2 Kekurangan Javascript

1. Script tidak terenkripsi Karena javascript bersifat client side, maka script yang kita buat di text editor dan telah dijadikan web di server, ketika user me-request web dari server tersebut maka sintax javascript akan langsung ditampilkan di browser. User bisa melihat dan menirunya dari sourcenya. 2. Kemampuan terbatas Walaupun javascript mampu membuat bentuk web menjadi interaktif dan dinamis, namun javascript tidak mampu membuat program aplikasi sendiri seperti java.

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

90

3. Keterbatasan Objek Javascript tidak mampu membuat kelas-kelas yang bisa menampung objekobjek tambahan seperti java karena javascript teleh memiliki objek yang built-in pada sturktur bahasanya. 4.3 Struktur dan Syntax Dasar Javascript Ditinjau dari segi pembuatan dan penulisannya, javascript tidak jauh beda dengan HTML, sehingga file yang menggunakan sintax javascript di dalam script HTML dapat menggunakan ekstension HTML juga.

Script dasar dalam javascript diawali dengan sintax <script> dan diakhiri dengan sintax .

Agar text editor dapat mengidentifikasikan bahwa sintax

tersebut merupakan sintax javascript yang digunakan untuk aplikasi di web, maka perlu penambahan sintax di dalam sintax script yaitu : <script language=”javascript”>

Sedangkan ruang yang ada di antara sintax javascript tersebut kita dapat mencantukkan ekspresi, fungsi, pernyataan dan lain sebagainya sesuai keinginan kita. Di dalam penulisan javascript untuk menampilkan suatu pernyataan atau kalimat kita dapat menggunakan syntax : Document.write(“kalimat yang akan di tampilkan”);

Dan pada setiap akhir pernyataan umumnya disertai dengan tanda titik koma (;) kecuali pada kondisi tertentu. Terkadang ada beberapa browser yang lama tidak dapat mengidentifikasikan script javascript secara baik sehingga tampilan di

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

91

browser tersebut akan menjadi kurang indah untuk dilihat. Oleh karena itu kita harus mengantisipasinya dengan menggunakan tanda “ dan tanda “//->” sebelum penulisan .

Di dalam script javascript juga dikenal tanda komentar yang apabila kita bubuhkan tanda tersebut maka kalimat yang ada di samping ataupun di antara tanda tersebut berfungsi sebagai komentar saja dan tidak tertampilkan di browser. Tanda ini sangat membantu bagi yang baru mempelajari javascript agar lebih memahami fungsi maupun peran sintax yang di terangkan oleh tanda keterangan tersebut. Tanda tersebut ada beberapa jenis antara lain:  “//”, Tanda tersebut apabila kita letakkan di text editor yang menjadi wahana pembuatan script javascript maka kalimat apapun yang ada di sampingnya akan menjadi keterangan dan tidak dapat tertampilkan di browser. Tanda tersebut bisaanya digunakan untuk keterangan yang hanya satu baris saja.  “/*

*/ “, tanda tersebut merupakan tanda komentar yang apabila ada

kalimat di antaranya maka kaliamat tersebut akan menjadi keterangan bisaa dan tidak tertampilkan oleh browser. Tanda ini bisaanya digunakan pada keterangan yang sbanyaknya beberapa baris.

Dari segi peletakan posisi sintax javascript, kita dapat membaginya menjadi 3 kondisi, sebagai berikut : 1

Sintax javascript ditulis dengan file yang berbeda terpisah dengan file HTML. Tata cara penulisan seperti ini yaitu memisahkan sintax javascript dengan sintax HTML dapat memudahkan bagi pembuat web apabila kita ingin PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

92

membuat web yang berisi berbagai aplikasi javascript di setiap halaman yang kita buat. Penulisan secara manual sintax javascript di setiap lembar web akan cukup merepotkan bagi kita terlebih lagi hal tersebut dapat memperberat kerja server karena besarnya file yang harus di kerjakan di server akibat banyaknya script javascript yang berulang-ulang di setiap file web tersebut. Hal ini dapat di atasi dengan membuat suatu file khusus bagi script javascript yang sama dari beberapa file yang menggunakan script tersebut sehingga file utama akan mencari file tersebut dengan sintax tertentu. Script javascript yang kita buat tersebut kemudin kita simpan dalam suatu file dengan ekstension “.js”. Dalam file tersebut kita tidak perlu mencatumkan sintax pembuka <script> dan sintax penutup .File utama terserbut akan mencari file yang berekstention “.js” tersebut dengan sintax : <script src=”nama_file.js”>

Dengan menggunakan sintax tersebut, kita dapat memanggil kapanpun dan diposisi manapun kita ingin menampilkan aplikasi javascript. Contoh : Buat file dengan nama script.js document.write(“hallo ini cara penggunaan java script lain file””
”);

buat file HTML dengan ketentuan penggunaan Java Script sebagai berikut: <script src=”script.js”> PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

93

Belajar Java Script

2

Sintax javascript terintegrasi dengan sintax HTML. Dalam hal ini syntax java script diletakkan pada posisi antara …. Posisi ini sering sekali kita jumpai hampir disetiap web. Posisi ini cukup membantu kecepatan tampilan web yang menggunakan aplikasi javascript. Karena sifatnya interpreter, maka ketika browser pertama sekali membaca sebuah web yang dipanggil olehnya, apabila script javascript tersebut diletakkan di antara sintax …. maka browser akan pertama sekali membaca dan mengidentifikasi sintax tersebut sebelum browser membaca isi dari . Hal ini sangat membantu dari segi kecepatan tampilan sebuah web di browser.

# Pertemuan 12. (Kerjakan No. 1-2) No. 1 : <SCRIPT LANGUAGE = "JAVASCRIPT"> var nama = prompt("siapa nama kamu?: ","isi dengan nama kamu"); var nim = prompt("nim: ","isi dengan nim kamu"); document.write("

"+"CREW Lab. Programing mengucapkan ..."+"

hai " +nama+ " selamat belajar Web programing"); document.write("

jadi nim kamu " +nim );

3

Sintax javascript terintegrasi dengan sintax HTML. Dalam hal ini syntax java script diletakkan pada posisi antara …. Penempatan script

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

94

javascript di antara sintax BODY merupakan salah satu metode posisi pengetikan script javascript selain seperti yang di atas. Jika kita meletakkan script javascript di dalam sintax BODY maka ketika browser menerima sebuah web dari salah satu web server maka sintax javascript dan sintax HTML lainnya akan bersamaan diproses sehingga kecepatannya akan sedikit berkurang bila dibandingkan sintax javascript diletakkan di antara HEAD. Hal ini disebabkan javascript bersifat interpreter. Penempatan posisi ini juga dapat mengatur posisi aplikasi javascript pada tubuh website yang kita buat dengan mengaturnya melalui table agar preposisi javascript dapat dengan mudah diletakkan. No. 2 : <SCRIPT LANGUAGE = "JAVASCRIPT"> var nama = prompt("siapa nama kamu?: ","isi dengan nama kamu"); var nim = prompt("nim: ","isi dengan nim kamu"); document.write("

"+"CREW Lab. Programming mengucapkan ..."+"

hai " +nama+ " selamat belajar Web programing"); document.write("

jadi nim kamu " +nim );

4.4 Nilai, Variable dan Konstanta/Literal 4.4.1 Nilai Dalam Javascript Nilai merupakan besaran yang digunakan untuk melakukan perhitungan, menulis dan sebagainya. Di dalam javascript terdapat beberapa macam nilai, yaitu:

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

95

1. String String adalah karakter yang bisa berupa huruf , kata symbol atau angka. String ditulis diantara tanda kutip ganda (“) atau tanda kutip tunggal ( „ ). Jika terdapat string lain gunakan tanda kutip tunggal. misal :

name = “firdaus

„alikomeini‟ adnan “

sedang untuk menulis tanda kutip ganda dalam string digunakan tanda (\ “). Misalnya :

name = “Institut \”Teknologi \” Bandung ”

2. Numerik

Berupa bilangan atau angka yang mempunyai sifat matematis (bisa dijumlah, tambah dsb), misalnya : 17, 8, 1945

3. Boolean

Nilai yang hanya memiliki dua nilai yaitu true (benar) dan false (salah) 4. Null

Adalah nilai yang tidak memiliki nilai sama sekali . Null tidak sama denagn karakter kosong atau nilai nol ( 0 ).

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

96

4.4.2 Variabel (Aturan Penamaan Variable) Java Script memiliki aturan untuk memberi nama variabel : 1. Harus diawali dengan karakter (huruf atau garis bawah ) tidak boleh diawali dengan angka atau symbol. Contoh :

Variable

Keterangan

UJI_2.1

Benar

_UJI.2

Benar

2004_angkatan

Salah

$sql

Salah

2. Tidak boleh menggunakan spasi , untuk memisahkan antar karakter digunakan garis bawah. Contoh :

Variable

Keterangan

Riska binayulia

Salah

Riska_binayulia

benar

3. Kapitalisasi (huruf besar dan huruf kecil) dibedakan pada nama variabel. Contoh : Firdausi tidak sama dengan firdausi 4. Tidak boleh mengunakan reserverd word, atau keyword yang ada pada Java Script. Reserved word dalam javascript adalah : Abstract, Boolean, break, byte, case, catch, char, class, const, continue, default, do, double, else, extends, false, final, finally, float, for, function, goto, if, implements, import, in, instace of, int, interface, long, native, new, null, package, private, protected, public, return, short, static, super, switch, synchronized, this, throw, throws, transient, true, try, var, void, while, with.

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

97

Memberikan nilai pada variabel Untuk memberikan nilai pada variabel digunakan sintaks : var namavariabel = nilai (value)

contoh : 

Memberikan nilai string untuk variable : var nama = “firdaus adnan”



Memberi nilai numerik untuk variable : var angka = 1000.12



Memberi nilai Boolean untuk variable : var x = true var y = false



Memberi nilai null untuk variable : var nama = null

4.4.3 Konstanta / Literal

Konstanta/literal adalah suatu nilai pasti yang tidak bisa diubah-ubah. Pengertian ini relevan dengan kata dasarnya yaitu konstan yang artinya tetap. Jika isi variable masih bisa diubah, maka konstanta tidak. Antara variable dan konstanta dapat disatukan. Perhatikan contoh di bawah ini : total = subtotal + 100

Nilai 100 di atas adalah konstanta/literal sedangkan total dan subtotal merupakan varibale. Beberapa jenis literal pada Java Script : 1. Literal Integer yaitu suatu bilangan bulat tanpa pecahan

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

98

Literal

Bilangan

2001 702

Desimal Octal

A33ff

Heksadesimal

2. Literal Floating Point yaitu suatu bilangan pecahan atau berpangkat.

Literal 3.14 2E3 -2E3 2E-3

Arti 3,14 2 x 10 3 -2 x 103 2 x 103

3. Literal String adalah suatu karakter yang berisi huruf , angka atau symbol-simbol lainnya.

Literal string harus diawali dan diakhiri dengan tanda kutip ganda ( “ ) atau tunggal ( „ ). Literal “riska binayulia ”

Keterangan Benar

“riska binayulia‟

Salah

4. Literal Boolean, adalah suatu litral yang memiliki dua buah nilai yaitu true (benar) dan false (salah) 4.5 Fungsi Fungsi adalah sekumpulan kode-kode javascript yang jika dijalankan akan menghasilkan atau mengerjakan suatu tugas tertentu. Fungsi dapat di sebut sebagai modul atau subprogram dari seluruh skrip atau program javascript. 1. Pembuatan Fungsi Dilihat dari segi pembuatan fungsi, maka sintak dasarnya adalah :

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

99

function nama_fungsi (parameter) { …….. ekspresi ekspresi ……… }

Untuk memposisikan sintak tersbut, maka sintak tersebut harus diletakkan di : <script language=”javascript”> function nama_fungsi() { ### isi fungsi ### }

2. Aturan Pembuatan Fungsi Ditinjau dari segi pembuatannya, maka fungsi memiliki beberapa aturan pembuatan yang akan di jabarkan di bawah ini :  Diawali dengan kata function  Nama fungsi bebas, asalkan dapat menjelaskan fungsi dari fungsi tersebut. Yang terenting di sini adalah fungsi harus diikuti oleh tanda kurung “()” yang digunakan sebagai tempat parameter.  Di dalam tanda kurung setelah kata function, dapat diletakkan parameter fungsi. Untuk lebih jelas lagi perhatikan sintak berikut : function jumlah (a,b) { var c = a+b; document.write (z) }

Parameter di dalam fungsi bisa digunakan bisa juga tidak digunakan. Parameter merupakan variable atau nilai yang akan diolah ekspresi-ekspresi yang terdapat di dalam fungsi tersebut.

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

100

Contoh : function pengurangan (x,y) { var z = x+y; document.write (z) }

 Isi fungsi harus di letakkan di dalam tanda kurung kurawal.  Di setiap akhir frase fungsi, selalu di beri akhiran titik koma (;) sebagai pemisah antar frase dan untuk frase terakhir tidak perlu di tambah tanda titik koma. 3. Parameter Fungsi Fungsi dapat di buat menggunakan parameter atau tanpa parameter. 1. Fungsi tanpa parameter. Sintax yang mengatur tentang fungsi parameter : <script language= “javascript”> function fungsi () { Document.write(“

---

”) } fungsi ()

2. fungsi dengan parameter. Sintax yang mengatur tentang fungsi dengan parameter : <script language= “javascript”> function pengurangan(a,b) { Var r = a-b; Document.write(z) }

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

101

//Pemanggilan fungsi Pengurangan(45,3)

4. Memanggil fungsi Cara pemanggilan fungsi dalam sebuah script java script ada beberapa cara antara lain : 1. Fungsi dipanggil dari dalam script java script. Fungsi disini dapat di panggil dari dalam script java script sendiri seperti pada contoh fungsi dengan parameter seperti diatas. Selain itu dapat juga pemanggilan fungsi di lakukan di dalam body script HTML. Contoh : <script language= “javascript”> function pengurangan(a,b) { Var r = a-b; document.write(z) } <script language=”javascript”> Pengurangan(78,122)

2. Fungsi dipanggil dari dalam fungsi itu sendiri (fungsi rekursif) Fungsi ini sering disebut dengan fungsi rekursif atau berulang dimana suatu fungsi yang dapat memanggil dirinya sendiri sintax yang mewakilinya adalah : Contoh pencarian nilai factorial : <script language= “javascript”> PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

102

function factorial(a) { If ((a==0)||(a==1)) {Return 1} else { hasil_adalah = ( a*factorial (x-1)); return hasil_adalah } } for (counter = 0; counter < 16; counter++) { document.write(“nilai factorial ” ,counter, “adalah= ”,

factorial (counter)+”
”)

}

3. Fungsi dipanggil dari dalam fungsi yang lain. <script language= “javascript”> function garis () { document.write(“

---

”) } function factorial(a) { If ((a==0)||(a==1)) {Return 1} else { hasil_adalah = ( a*factorial (a-1)); return hasil_adalah } }

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

103

for (counter = 0; counter < 16; counter++) { document.write(“nilai factorial ” ,counter, “adalah= ”, factorial (counter)+”
”) garis() }

# Pertemuan 13. (Kerjakan No.1-2) No. 1 : <TITLE>Jam <SCRIPT Language="JavaScript">

No.2 : <style> .spanstyle { position : absolute; visibility : visible; top : -50px; font-size : 10pt;

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

104

font-family : Verdana; font-weight : bold; color : blue; } <script> var message="aidemitluM & retupmoK namargormeP .baL".split(""); var x; /* last recorded mouse X location */ var y; /* last recorded mouse Y location */ var step=-15; /* how much to move the characters from each other */ var xpos=new Array(); /* X placement for each character */ var ypos=new Array(); /* Y placement for each character */ /* tunjuk di browser */ var isIE=document.all?true:false; var isNS=document.layers?true:false; var isDOM=document.getElementById?true:false; function mouseMoved(e){ if(isDOM) { if(isIE) { x = event.clientX; y = event.clientY; } else { x = e.clientX; y = e.clientY; } } else if(isIE) { x = document.body.scrollLeft+event.clientX; y = document.body.scrollTop+event.clientY; } else if(isNS) { x = e.pageX; y = e.pageY; } } function makesnake() { var thisspan; for (var i=message.length-1; i>=0; i--) { xpos[i]=xpos[i-1]+step; ypos[i]=ypos[i-1]; } xpos[0]=x+step; ypos[0]=y; for (var i in message) { PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

105

if (isDOM) { thisspan = document.getElementById("span"+i).style; thisspan.left=xpos[i]; thisspan.top=ypos[i]; } else if (isIE) { thisspan = eval("span"+(i)+".style"); thisspan.posLeft=xpos[i]; thisspan.posTop=ypos[i]; } else if (isDOM) { thisspan = eval("document.span"+i); thisspan.left=xpos[i]; thisspan.top=ypos[i]; } } } var timer = null; function pakaiUlar() { for (var i in message) { xpos[i]=-50; ypos[i]=-50; } setTimeout('timer=setInterval("makesnake()",30);',1000); } for (var i in message) { document.write("<span id='span"+i+"' class='spanstyle'>") document.write(message[i]); document.write(""); } if (isNS) { document.captureEvents(Event.MOUSEMOVE); } document.onmousemove = mouseMoved;
Mulai

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

106

Chapter 5 Web Server dan TCP/IP ======================================= # Pertemuan 14. 5.1 Pendahuluan Berikut ini adalah alasan pentingnya internet yaitu :  Kebutuhan manusia akan informasi / saling tukar informasi yang cepat, akurat dan Up to date.  Komunikasi melalui internet tidak tergantung jarak, waktu dan tempat asalkan ada fasilitas sambungan ke internet. Manfaat adanya internet yaitu :  Pengembangan dunia RISET, kita dapat mendownload berbagai artikel, journal, atau hasil penelitian.  Mencari gambar atau galeri apapun.  Mencari informasi, pertukaran data, tutorial, termasuk bahan kuliah di internet.  Prakiraan cuaca, biro jodoh, surat kabar, ilmu-ilmu agama.  Chating (Ngobrol di Internet), Email, Video Conference, Main Game dll.  Sebagai Media Promosi (Jualan Barang)

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

107

Bagaimana Koneksinya:

 Internet Service Provider (ISP), misalnya TelKomnet, GlobalNet,Mitranet,RadNet dll.  Diperlukan Server untuk melayani beberapa Client  Agar dapat masuk ke dunia maya/internet, maka harus mengetikkan alamat internet yang kemudian kita kenal dengan domain name. Misalnya URL http : www.kompas.com http

: Browser dan Web Server yang akan berkomunikasi menggunakan protokol HTTP

www

: Rosource yang ada pada WWW

kompas.com : Domain Name

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

108

 Setiap komputer dan jaringan terhubung secara langsung maupun tidak langsung - ke beberapa jalur utama yang disebut internet backbone  Antara satu komputer dengan yang lain dibedakan menggunakan unique name yang biasa disebut dengan alamat IP 32 bit. Contoh: 202.155.4.230 Komputer dan jaringan dengan berbagai platform yang mempunyai perbedaan dan ciri khas masing-masing (Unix, Linux, Windows, Mac, dll) bertukar informasi dengan sebuah protokol standar yang dikenal dengan nama TCP/IP (Transmission Control Protocol/Internet Protocol).  Server Vs Client Server : 1. Menyediakan dokumen web 2. Mengeksekusi dokumen web yang bersifat “server side” (php, asp, jsp ), menerjemahkan ke dalam bentuk yang bisa dipahami oleh “web browser” di client 3. Memiliki service (program) web server (IIS, Apache dsb)

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

109

4. Memberikan response ke client. Client : 1. Mengambil dokumen web. 2. Mengeksekusi dokumen web yang bersifat “client side” (javascript, html, css). 3. Memiliki web browser untuk menerjemahkan dokumen web ke bentuk yang “manusiawi”. 4. Mengirimkan request ke server.

Gambar 29. Aristektur Client-server

Teknologi Web Client  Web browser, HTML / XML / XHTML, Javascript / VBScript, CSS, Flash player, Java Applet, ActiveX / Plugin: program yang terintegrasi dengan browser, Helper: program yg terinstall di client.

Server Side Technologies  Hardware : Komputer Server  Software: 1. Web server 2. Server side Programming Tools: PHP, ASP, .NET 3. Utility Programming Tools : Database Server (MySQL, SQLServer)

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

110

Web server adalah software yang menjadi tulang belakang dari world wide web (www). Web server menunggu permintaan dari client yang menggunakan browser seperti Netscape Navigator, Internet Explorer, Modzilla, dan program browser lainnya. Jika ada permintaan dari browser, maka web server akan memproses permintaan itu kemudian memberikan hasil prosesnya berupa data yang diinginkan kembali ke browser. Data ini mempunyai format yang standar, disebut dengan format SGML (standar general markup language). Data yang berupa format ini kemudian akan ditampilkan oleh browser sesuai dengan kemampuan browser tersebut. Contohnya, bila data yang dikirim berupa gambar, browser yang hanya mampu menampilkan teks (misalnya lynx) tidak akan mampu menampilkan gambar tersebut, dan jika ada akan menampilkan alternatifnya saja. Web server, untuk berkomunikasi dengan client-nya (web browser) mempunyai protokol sendiri, yaitu HTTP (hypertext transfer protocol).

Dengan protokol ini, komunikasi antar web server dengan client-nya dapat saling dimengerti dan lebih mudah. Seperti telah dijelaskan diatas, format data pada world wide web adalah SGML. Tapi para pengguna internet saat ini lebih banyak menggunakan format HTML (hypertext markup language) karena penggunaannya lebih sederhana dan mudah dipelajari. Kata HyperText mempunyai arti bahwa seorang pengguna internet dengan web browsernya dapat membuka dan membaca dokumen-dokumen yang ada dalam komputernya atau bahkan jauh tempatnya sekalipun.

Hal ini memberikan cita rasa dari suatu proses yang tridimensional, artinya pengguna internet dapat membaca dari satu dokumen ke dokumen yang lain hanya

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

111

dengan mengklik beberapa bagian dari halaman-halaman dokumen (web) itu. Proses yang dimulai dari permintaan webclient (browser), diterima web server, diproses, dan dikembalikan hasil prosesnya oleh web server ke web client lagi dilakukan secara transparan. Setiap orang dapat dengan mudah mengetahui apa yang terjadi pada tiap-tiap proses. Secara garis besarnya web server hanya memproses semua masukan yang diperolehnya dari web clientnya. # Pertemuan 15. 5.2 Web Server Apache Apache merupakan web server yang paling banyak dipergunakan di Internet. Program ini pertama kali didesain untuk sistem operasi lingkungan UNIX. Namun demikian, pada beberapa versi berikutnya Apache mengeluarkan programnya yang dapat dijalankan di Windows NT. Apache mempunyai program pendukung yang cukup banyak. Hal ini memberikan layanan yang cukup lengkap bagi penggunanya. Beberapa dukungan Apache : A. Kontrol Akses Kontrol ini dapat dijalankan berdasarkan nama host atau nomor IP. B. CGI (Common Gateway Interface) Yang paling terkenal untuk digunakan adalah perl (Practical Extraction and Report Language), didukung oleh Apache dengan menempatkannya sebagai modul (mod_perl). C. PHP (Personal Home Page/PHP Hypertext Processor); Program dengan metode semacam CGI, yang memproses teks dan bekerja di server. Apache mendukung PHP dengan menempatkannya sebagai salah satu modulnya (mod_php). Hal ini membuat kinerja PHP menjadi lebih baik. PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

112

D. SSI (Server Side Includes) Web server Apache mempunyai kelebihan dari beberapa pertimbangan di atas : 1. Apache termasuk dalam kategori freeware. 2. Apache mudah sekali proses instalasinya jika dibanding web server lainnya seperti NCSA, IIS, dan lain-lain. 3. Mampu beroperasi pada berbagai platform sistem operasi. 4. Mudah mengatur konfigurasinya. Apache mempunyai hanya empat file konfigurasi. 5. Mudah dalam menambahkan peripheral lainnya ke dalam platform web servernya. 5.3 Fasilitas atau Ciri Khas dari Web Server Apache 1. Dapat dijadikan pengganti bagi NCSA web server. 2. Perbaikan terhadap kerusakan dan error pada NCSA 1.3 dan 1.4. 3. Apache merespon web client sangat cepat jauh melebihi NCSA. 4. Mampu di kompilasi sesuai dengan spesifikasi HTTP yang sekarang. 5. Apache menyediakan feature untuk multihomed dan virtual server. 6. Kita dapat menetapkan respon error yang akan dikirim web server dengan menggunakan file atau skrip. 7. Server apache dapat otomatis berkomunikasi dengan client browsernya untuk menampilkan tampilan terbaik pada client browsernya. Web server Apache secara otomatis menjalankan file index.html, halaman utamanya, untuk ditampilkan secara otomatis pada clientnya. 8. Web server Apache mempunyai level-level pengamanan.

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

113

9. Apache mempunyai komponen dasar terbanyak di antara web server lain. 10. Ditinjau dari segi sejarah perkembangan dan prospeknya, Apache web server mempunyai prospek yang cerah. Apache berasal dari web server NCSA

yang

kemudian

dikembangkan

karena

NCSA

masih

mempunyai kekurangan di bidang kompatibilitasnya dengan sistim operasi lain. Sampai saat ini, web server Apache terus dikembangkan oleh tim dari apache.org. 11. Performasi dan konsumsi sumber daya dari web server Apache tidak terlalu banyak, hanya sekitar 20 MB untuk file-file dasarnya dan setiap daemonnya hanya memerlukan sekitar 950 KB memory per child. 12. Mendukung transaksi yang aman (secure transaction) menggunakan SSL (secure socket layer). 13. Mempunyai dukungan teknis melalui web. 14. Mempunyai kompatibilitas platform yang tinggi. 15. Mendukung third party berupa modul-modul tambahan.

Agar jaringan intrenet ini berlaku semestinya harus ada aturan standard yang mengaturnya karena itu diperlukan suatu protokol internet.

5.4 Sejarah TCP/IP Internet Protocol dikembangkan pertama kali oleh Defense Advanced Research Projects Agency (DARPA) pada tahun 1970 sebagai awal dari usaha untuk mengembangkan protokol yang dapat melakukan interkoneksi berbagai jaringan komputer yang terpisah, yang masing-masing jaringan tersebut menggunakan

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

114

teknologi yang berbeda. Protokol utama yang dihasilkan proyek ini adalah Internet Protocol (IP). Riset yang sama dikembangkan pula yaitu beberapa protokol level tinggi yang didesain dapat bekerja dengan IP. Yang paling penting dari proyek tersebut adalah Transmission Control Protocol (TCP), dan semua grup protocol diganti dengan TCP/IP suite. Pertamakali TCP/IP diterapkan di ARPANET, dan mulai berkembang setelah Universitas California di Berkeley mulai menggunakan TCP/IP dengan sistem operasi UNIX. Selain Defense Advanced Research Projects Agency (DARPA) ini yang mengembangkan Internet Protocol, yang juga mengembangkan TCP/IP adalah Department of Defense (DOD).

5.5 Istilah-istilah didalam Internet Protocol Ada beberapa istilah yang sering ditemukan didalam pembicaraan mengenai TCP/IP, yaitu diantaranya :  Host atau end-system, Seorang pelanggan pada layanan jaringan komunikasi. Host biasanya berupa individual workstation atau personal computers (PC) dimana tugas dari Host ini biasanya adalah menjalankan applikasi dan program software server yang berfungsi sebagai user dan pelaksana pelayanan jaringan komunikasi.  Internet, yaitu merupakan suatu kumpulan dari jaringan (network of networks) yang menyeluruh dan menggunakan protokol TCP/IP untuk berhubungan seperti virtual networks.  Node, adalah istilah yang diterapkan untuk router dan host.protocol, yaitu merupakan sebuah prosedur standar atau aturan untuk pendefinisian dan pengaturan transmisi data antara komputer-komputer. PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

115

 Router, adalah suatu devais yang digunakan sebagai penghubung antara dua network atau lebih. Router berbeda dengan host karena router bisanya bukan berupa tujuan atau data traffic. Routing dari datagram IP biasanya telah dilakukan dengan software. Jadi fungsi routing dapat dilakukan oleh host yang mempunyai dua networks connection atau lebih.

5.6 Overview TCP/IP Sebagaimana yang telah dikemukakan di atas, TCP/IP juga dikembangkan oleh Department of Defense (DOD). DOD telah melakukan proyek penelitian untuk menghubungkan beberapa jaringan yang didesain oleh berbagai vendor untuk menjadi sebuah networks of networks (Internet). Pada awalnya hal ini berhasil karena hanya menyediakan pelayanan dasar seperti file transfer, electronic mail, remote logon. Beberapa komputer dalam sebuah departemen dapat menggunakan TCP/IP (bersamaan dengan protokol lain) dalam suatu LAN tunggal. Komponen IP menyediakan routing dari departmen ke network enterprise, kemudian ke jaringan regional

dan akhirnya ke global internet. Hal ini dapat menjadikan

jaringan komunikasi dapat rusak, sehingga untuk mengatasinya maka kemudian DOD mendesain TCP/IP yang dapat memperbaiki dengan otomatis apabila ada node atau saluran telepon yang gagal. Hasil rancangan ini memungkinkan untuk membangun jaringan yang sangat besar dengan pengaturan pusat yang sedikit. Karena adanya perbaikan otomatis maka masalah dalam jaringan tidak diperiksa dan tak diperbaiki untuk waktu yang lama.

Seperti halnya protokol komunikasi yang lain, maka TCP/IP pun mempunyai beberapa layer, layer-layer itu adalah :

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

116

 IP (internet protocol) yang berperan dalam pentransmisian paket data dari node ke node. IP mendahului setiap paket data berdasarkan 4 byte (untuk versi IPv4) alamat tujuan (nomor IP). Internet authorities menciptakan range angka untuk organisasi yang berbeda. Organisasi menciptakan grup dengan nomornya untuk departemen. IP bekerja pada mesin gateaway yang memindahkan data dari departemen ke organisasi kemudian ke region dan kemudian ke seluruh dunia.  TCP (transmission transfer protocol) berperan didalam memperbaiki pengiriman data yang benar dari suatu klien ke server. Data dapat hilang di tengah-tengah jaringan. TCP dapat mendeteksi error atau data yang hilang dan kemudian melakukan transmisi ulang sampai data diterima dengan benar dan lengkap.  Sockets yaitu merupakan nama yang diberikan kepada subrutin paket yang menyediakan akses ke TCP/IP pada kebanyakan sistem. # Pertemuan 16. 5.7 Beberapa Hal Penting Didalam TCP/IP 

Jaringan Peminta Terendah (Network of Lowest Bidders) IP dikembangkan untuk membuat sebuah network of networks (Internet). Individual machine dihubungkan ke LAN (ethernet atau Token ring). TCP/IP membagi LAN dengan user yang lain (Novell file server, windows dll). Satu devais menyediakan TCP/IP menghubungkan antara LAN dengan dunia luar. Untuk meyakinkan bahwa semua tipe sistem dari berbagai vendor dapat berkomunikasi, maka penggunaan TCP/IP distandarkan pada

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

LAN.

117

Dengan bertambahnya kecepatan mikroprossesor, fiber optics, dan saluran telepon digital maka telah menciptakan beberapa pilihan teknologi baru diantaranya yaitu ISDN, frame relay, FDDI, Asynchronous Transfer Mode (ATM). Rancangan asli dari TCP/IP adalah sebagai sebuah network of networks yang cocok dengan penggunaan teknologi sekarang ini. Data TCP/IP dapat dikirimkan melalui sebuah LAN, atau dapat dibawa dengan sebuah jaringan internal corporate SNA, atau data dapat terhubung pada TV kabel . Lebih jauh lagi, mesin-mesin yang berhubungan pada salah satu jaringan tersebut dapat berkomunikasi dengan jaringan yang lain melalui gateways yang disediakan vendor jaringan . 

Masalah Pengalamatan Dalam sebuah jaringan SNA, setiap mesin mempunyai Logical Units dengan alamat jaringan masing-masing. DECNET, Appletalk, dan Novell IPX mempunyai rancangan untuk membuat nomor untuk setiap jaringan lokal dan untuk setiap workstation yang terhubung ke jaringan. Pada bagian utama pengalamatan lokal network, TCP/IP membuat nomor unik untuk setiap workstation di seluruh dunia. Nomor IP adalah nilai 4 byte (IPv4) dengan konvensi merubah setiap byte ke dalam nomor desimal (0 sampai 255 untuk IP yang digunakan sekarang) dan memisahkan setiap bytes

dengan periode. Sebagai contoh misalnya

130.132.59.234. Sebuah organisasi dimulai dengan mengirimkan electronic mail ke [email protected] meminta untuk pembuatan nomor jaringan.

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

118

Hal ini dimungkinkan bagi hampir setiap orang untuk memperoleh nomor untuk jaringan "small class C" dengan 3 bytes pertama meyatakan jaringan dan byte terakhir menyatakan individual komputer. Organisasi yang lebih besar dapat memperoleh jaringan "Class B" dengan 2 bytes pertama menyatakan jaringan dan 2 bytes terakhir menyatakan menyatakan masing-masing

workstation

sampai

mencapai

64.000

individual

workstation. Contoh Jaringan Class B Yale adalah 130.132, jadi semua komputer dengan IP address 130.132.*.* adalah dihubungkan melalui Yale. Kemudian organisasi berhubungan dengan intenet melalui satu dari beberapa jaringan regional atau jaringan khusus. vendor jaringan diberi nomor pelanggan networks dan ditambahkan ke dalam

konfigurasi

routing dalam masing-masing mesin. Tidak ada rumus matematika yang mengubah nomor 192.35.91 atau 130.132 menjadi "Yale University" atau "New Haven". Mesin-mesin yang mengatur jaringan regional yang besar atau routers Internet pusat dapat menentukan lokasi jaringan-jaringan tersebut dengan mencari setiap nomor jaringan tersebut dalam tabel. Diperkirakan ada ribuan jaringan class B dan jutaan jaringan class C. Pelanggan yang terhubung dengan Internet, bahkan perusahaan besar seperti IBM tidak perlu untuk memelihara informasi pada jaringan-jatingan yang lain. Mereka mengirim semua eksternal data ke regional carrier yang mereka langgan, dan regional carrier mengamati dan memelihara tabel dan melakukan routing yang tepat.

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

119



Subnets Meskipun pelanggan individual tidak membutuhkan nomor tabel jaringan/menyediakan eksplisit routing, tapi untuk kebanyakan jaringan class B dapat diatur secara internal sehingga lebih kecil dan versi organisasi jaringan yang lebih sederhana. Biasanya membagi dua byte internal assignment menjadi satu byte nomor departmen dan satu byte Workstation ID. Enterprise network dibangun dengan menggunakan TCP/IP router box secara komersial. setiap router mempunyai tabel dengan 255 masukan untuk ethernet

mengubah satu byte nomor departmen menjadi pilihan tujuan yang terhubung ke salah satu router. Misalnya, pesan ke

130.132.59.234 melalui jaringan regional National dan New

England

berdasarkan bagian nomor 130.132. Tiba di Yale, 59 department ID memilih ethernet connector . 234 memilih workstation tertentu pada LAN. Jaringan Yale harus diupdate sebagai ethernet baru dan departemen ditambahkan, tapi tidak dipengaruhi oleh perubahan dari luar atau perpindahan mesin dalam departemen. 

Jalur-jalur tak tentu Setiap kali sebuah pesan tiba pada sebuah IP router, maka router akan membuat keputusan ke mana berikutnya pesan tersebut akan dikirimkan. Ada konsep satu waktu tertentu dengan preselected path untuk semua traffic. Misalkan sebuah perusahaan dengan fasilitas di New York, Los Angles, Chicago dan Atlanta. Dapat dibuat jaringan dari empat jalur telepon membentuk sebuah loop (NY ke Chicago ke LA ke Atlanta ke

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

120

NY). Sebuah pesan tiba di router NY dapat pergi ke LA melalui Chicago atau melalui Atlanta. jawaban dapat kembali ke jalan lain. Bagaimana sebuah router dapat membuat keputusan antara router dengan router? tidak ada jawaban yang benar. Traffic dapat dipetakan dengan algoritma "clockwise" (pergi ke NY ke Atlanta, LA ke chicago). Router dapat menentukan, mengirimkan pesan ke Atlanta kemudian selanjutnya ke ke Chicago. Routing yang lebih baik adalah dengan mengukur pola traffic dan mengirimkan data melalui link yang paling tidak sibuk. Jika satu saluran telepon dalam satu jaringan rusak, pesan dapat tetap mencapai tujuannya melalui jalur yang lain. Setelah kehilangan jalur dari NY ke Chicago, data dapat dikirim dari NY ke Atlanta

ke LA

ke

Chicago. Dengan begitu maka jalur akan berlanjut meskipun dengan kerugian performance menurun. Perbaikan seperti ini merupakan bagian tambahan pada desain IP. 

Masalah yang Tidak Diperiksa (Undiagnosed Problem) Jika ada error terjadi, maka dilaporkan ke network authorities. Error tersebut harus dibenarkan atau diperbaiki. IP, didesain untuk dapat tahan dan kuat. Kehilangan node atau jalur adalah hal biasa, tetapi jaringan harus tetap jalan. Jadi IP secara otomatis menkonfigurasi ulang dirinya sendiri bila terjadi sesuatu yang salah. Jika banyak redundancy

yang

dibangun ke dalam sistem maka komuniksi tetap berlangsung dan terjaga. TCP dirancang untuk memulihkan node atau saluran yang gagal dimana propagasi routing table berubah untuk semua node router. Karena proses

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

121

updating memerlukan waktu yang lama , TCP agak lambat untuk menginisiasi pemulihan. 

Mengenai Nomor IP Setiap perusahaan besar atau perguruan tinggi yang terhubung ke internet harus mempunyai level intermediet network. beberapa router mungkin dikonfigurasi untuk berhubungan dengan bebarapa department LAN. Semua traffic di luar organisasi dihubungkan dengan koneksi tunggal ke jaringan provider regional. Jadi, pemakai akhir dapat menginstall TCP/IP pada PC tanpa harus tahu jaringan regional . Tiga bagian informasi dibutuhkan : a) IP address dibuat pada PC. b) Bagian dari IP address (subnet mask) yang membedakan mesin lain dalam LAN yang sama (pesan dapat dikirim secara langsung) dengan mesin-mesin di departemen lain atao dimanapun di seluruh dunia (yang dikirimkan ke router mesin). c) IP address dari router mesin yang menghubungkan LAN tersebut dengan dunia luar.



Susunan TCP/IP Internet pada mulanya didesain dengan dua kriteria utama. Dua kriteria ini mempengaruhi dan membentuk hardware dan software yang digunakan sekarang. Kriteria tersebut : Jaringan harus melakukan komunikasi antara para peneliti di belahan dunia yang berbeda, memungkinkan meraka dapat berbagi dan berkomunikasi mengenai penelitian mereka satu sama lain. Sayangnya, riset memerlukan berbagai komputer dari beragam platform

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

122

dan arsitektur jaringan yang berbeda untuk keperluan keilmuan. Maka untuk itu diperlukan protocol suite untuk dapat berhubungan dengan berbagai platforms hardware yang berbeda dan bahkan sistem jaringan yang berbeda. Lebih jauh lagi, network harus merupakan jaringan komunikasi yang kuat yang mempunyai kemampuan dapat bertahan dari serangan nuklir. Rancangan ini memebawa ke arah desentralisasi jaringan yang terdiri dari jaringan yang terpisah, lebih kecil, jaringan yang diisolasi yang mempunyai kemampuan otomatis bila diperlukan. Layer menyediakan level abstrsaksi untuk software dan menaikkan kemampuan menggunakan kembali dan kebebasan platform. Layer-layer tersebut dimaksudkan untuk benar-benar terpisah dari satu sama lain dan juga independen. Layer tersebut tidak mengandalkan informasi detail dari layer yang lain. Arsitektur rancangan ini membuat lebih mudah untuk melakukan pemeliharaan karena layer dapat didesain ulang atau dikembangkan tanpa merusak integritas protokol stack. TCP/IP protocol suite terdiri dari 4 layers: Applikasi, Transport, Internetwork, dan network interface. Layer tersebut dapat dilihat sebagai hirarki seperti di bawah ini : Layer Applikasi adalah sebuah aplikasi yang mengirimkan data ke transport layer. Misalnya FTP, email programs dan web browsers. Layer Transport bertanggung jawab untuk komunikasi antara aplikasi. Layer ini mengatur aluran informasi dan mungkin menyediakan pemeriksaan error. Data dibagi kedalam beberapa paket yang dikirim ke internet layer dengan sebuah header. Header mengandung alamat tujuan,

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

123

alamat sumber dan checksum. Checksum diperiksa oleh mesin penerima untuk melihat apakah paket tersebut ada yang hilang pada rute. Layer Internetwork bertanggung jawab untuk komunikasi antara mesin. Layer ini meg-engcapsul paket dari transport layer ke dalam IP datagrams dan menggunakan algoritma routing untuk menentukan kemana datagaram harus dikirim. Masuknya datagram diproses dan diperiksa kesahannya sebelum melewatinya pada Transport layer. Layer networks interface adalah level yang paling bawah dari susunan TCP/IP. Layer ini adalah device driver yang memungkinkan datagaram IP dikirim ke atau dari pisikal network. Jaringan dapaat berupa sebuah kabel, Ethernet, frame relay, Token ring, ISDN, ATM jaringan, radio, satelit atau alat lain yang dapat mentransfer data dari sistem ke sistem. Layer network interface adalah abstraksi yang memudahkan komunikasi antara multitude arsitektur network.  Internet merupakan kumpulan dari berbagai jaringan komputer LAN dan WAN di seluruh dunia yang saling berkomunikasi.  Untuk dapat berkomunikasi maka harus ada aturan mainnya yang disebut TCP/IP (Transmission Control Protocol/Internet Protocol)  Internet menekan waktu, beaya dan meniadakan jarak untuk berkomunikasi dan tukar menukar informasi di seluruh dunia.

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

124

KATA PENGANTAR

Puji syukur kehadirat Allah S.W.T atas segala nikmat yang tiada terbilang sehingga terselesainya modul ini. Modul ini dibuat untuk membantu mahasiswa/i IBI Darmajaya dalam melaksanakan matakuliah sehingga mempermudah dalam pemahaman materi bahasa Pemrograman Web khususnya dalam modul selain berisi materi, juga mencantumkan contoh latihan serta tugas mandiri. Untuk itu diharapkan mahasiswa/i sebelumnya membaca isi dari modul ini sehingga mempermudah pemahaman materi saat dosen memberikan penjelasan materi yang disampaikan.

Demikian prakata ini penulis buat, semoga modul ini dapat bermanfaat bagi mahasiswa/i. Sekiranya penulis menyadari adanya kekurangan dari modul ini, maka mohon kritik dan saran membangun dari para pembaca. Akhir kata tak luput penulis mengucapkan terima kasih untuk semua yang telah membantu sehingga terselesainya modul ini.

Bandar Lampung, Mei 2010

Penulis

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

125

DAFTAR ISI

Halaman HALAMAN JUDUL ...................................................................................... i KATA PENGANTAR .................................................................................... ii DAFTAR ISI ................................................................................................... iii I.

KONSEP DASAR DAN CONTOH HTML ........................................ 1.1. Pendahuluan ................................................................................... 1.2. Sejarah internet............................................................................... 1.3. Peralatan yang dibutuhkan ............................................................. 1.4. World Wide Web ............................................................................ 1.5. Pengenalan HTML ......................................................................... 1.6. Browser dan editor ......................................................................... 1.7. Tag-tag HTML ............................................................................... 1.7.1 Struktur HTML dokumen ...................................................... 1.7.2 Basic element HTML ............................................................ 1.7.2.1 List item..................................................................... 1.7.2.2 Horizontal rules (HR) ................................................ 1.7.2.3 Pemformatan page .....................................................

II.

XHTML.................................................................................................. 52 2.1 Pendahuluan ........................................................................................... 52 2.2 Perbedan HTML dan XHTML ............................................................. 52 2.3 W3C XHTML validation service ......................................................... 53 2.4 Header..................................................................................................... 54 2.5 Linking ................................................................................................... 54 2.6 Image ...................................................................................................... 56 2.7 Special characters dan line breaks ........................................................ 58 2.8 Unordered list ......................................................................................... 59 2.9 Nested & ordered list ............................................................................. 59 2.10 Pengenalan macromedia dreamweaver ................................................ 61 2.10.1 HTML, XHTML, dan dreamweaver ........................................ 65 2.10.2 Body HTML ........................................................................ 67 2.10.3 Format teks HTML ............................................................. 68 2.10.3.1 Heading ................................................................. 68 2.10.3.2 Membuat baris baru............................................... 69 2.10.3.3 Membuat paragraf ................................................. 69 2.10.3.4 Membuat daftar/list ............................................... 70 2.10.3.5 Unordered list ........................................................ 70 2.10.3.6 Ordered list ............................................................ 71 2.10.3.7 Definition list ........................................................ 72 2.10.3.8 Format tulisan........................................................ 73 2.11 Graphics di HTML ............................................................................... 73 2.12 Hyperlink di HTML ............................................................................. 74 2.13 Membuat layout frame di HTML ........................................................ 76

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

2 2 2 4 6 7 9 11 13 15 15 17 18

126

III. CSS ......................................................................................................... 3.1 Pendahuluan .................................................................................. 3.2 Menambahkan CSS ke dalam HTML ............................................ 3.2.1 External style sheet ................................................................. 3.2.2 Internal style sheet................................................................... 3.2.3 Inline style ............................................................................... 3.3 Istilah-istilah dalam CSS ................................................................ 3.4 Komentar pada CSS ....................................................................... 3.5 Class selector.................................................................................. 3.6 CSS background properties ............................................................ 3.7 CSS text properties......................................................................... 3.8 CSS border properties .................................................................... 3.9 CSS margin properties ................................................................... 3.10 CSS padding properties .................................................................. 3.11 CSS list properties ..........................................................................

80 80 80 80 80 81 81 81 82 82 83 84 86 86 87

IV. JAVA SCRIPT ...................................................................................... 4.1 Pendahuluan...................................................................................... 4.2 Kelebihan dan kekurangan javascript ............................................... 4.2.1 Kelebihan javascript ............................................................... 4.2.2 Kekurangan javascript ............................................................ 4.3 Struktur dan syntax dasar javascript ................................................. 4.4 Nilai, variable, dan konstanta/literal ................................................. 4.4.1 Nilai dalam javascript ............................................................. 4.4.2 Variable .................................................................................. 4.4.3 Konstanta/literal...................................................................... 4.5 Fungsi ...............................................................................................

89 89 89 89 90 91 95 95 97 98 99

V.

107 107 112 113 114 115 116 117

WEB SERVER DAN TCP/IP................................................................ 5.1 Pendahuluan ..................................................................................... 5.2 Web server apache ........................................................................... 5.3 Fasilitas atau ciri khas dari web server apache ................................ 5.4 Sejarah TCP/IP ................................................................................. 5.5 Istilah-istilah didalam internet protokol ........................................... 5.6 Overview TCP/IP ............................................................................. 5.7 Beberapa hal penting dalam TCP/IP ................................................

DAFTAR PUSTAKA

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

127

DAFTAR PUSTAKA

Anonim. 2006. Mempercantik Web dengan CSS. Yogyakarta: CV. Andi Offset. Hunt, Craig. 2002. TCP/IP Network Administration. 3rd Edition.O‟reilly. Jennifer Niederst, Jennifer Niederst Robbins, 2003, “Learning Web design: a beginner's guide to HTML, graphics, and beyond”, O‟reilly digital stidio Jennifer Niederst Robbins, 2007, “Learning web design: a beginner's guide to (X)HTML, style sheets, and web graphics”, 3rd edition.

Setiawan, Andi. 2004. “Pemrograman HTML Standarisasi, Konfigurasi dan Implementasi”. Bandung : Yrama Widya. Supadi. 2007.”Buku Ajar Pengembangan Web”. Lampung : IBI Darmajaya. Wahidin, 2005, “Dreamweaver MX 2004”, Palembang : Maxikom.

PEMROGRAMAN WEB | INFORMATICS & BUSINESS DARMAJAYA |

128

×

Report "PEMROGRAMAN WEB M O D U L DISUSUN OLEH : ANGGALIA WIBASURI, S.KOM INFORMATICS AND BUSINESS INSTITUTE DARMAJAYA [X23 LTD]"

Your name

Email

Reason -Select Reason- Pornographic Defamatory Illegal/Unlawful Spam Other Terms Of Service Violation File a copyright complaint

Description

Close Send

×

Sign In

Email

Password

Remember me Forgot password?

Sign In

Our partners will collect data and use cookies for ad personalization and measurement. Learn how we and our ad partner Google, collect and use data. Agree & close