Simple Site

Pemrosesan form (form processing) merupakan operasi mendasar pada
aplikasi web. Contohnya adalah pada waktu menerima masukkkan dari user,
kita membutuhkan form login, seperti yang ada pada project kita berikut ini.

Di bawah ini adalah aplikasi login form sederhana dengan tanpa menggunakan
database. Form ini terdiri dari Username dan Password. Username dan Password sudah dimasukkan dalam program php.
Tampilan awal dari form login adalah sebagai berikut.


Script html-nya adalah sebagai berikut:


Sementara script php-nya bisa dilihat di sini.

PHP atau yang disebut sebagai Hypertext Preprocessor, merupakan bahasa yang
dimaksudkan untuk menghasilkan halaman-halaman web yang dinamis.
Kita dapat membuat aplikasi web—baik lokal maupun Internet—dinamis dan atraktif melalui PHP .
Berikut ini adalah program sederhana untuk men-generate sel tabel secara fleksibel. Tekniknya adalah dengan membuat sebuah fungsi yang menerima argumen berupa jumlah sel dan jumlah kolom. Jadi, pembentukan sel tabel didasarkan pada nilai jumlah sel dan jumlah kolom yang diberikan.

Tampilan awal yaitu dengan cara memasukkan jumlah baris, kolom dan sell, seperti pada gambar berikut:









Setelah anda memasukkan jumlah baris, kolom, dan sell, maka tampilan berikutnya adalah sebagai berikut:









Script html-nya bisa didownload di sini (click).
Sementara script php-nya click di sini.

Dalam PHP dikenal istilah passing argumen. Variabel yang diberikan
method itulah yang dinamakan dengan passing argumen. Contoh dari passing
argumen pada pemrograman PhP adalah passing by value dan passing vy reference.
Adapun penjelasannya adalah sebagai berikut:
1. Passing by value
Passing by value berarti PHP membuat salinan dari argumen yang asli. Argumen yang asli tidak akan berubah walaupun terjadi manipulasi terhadap argument tersebut karena argumen salinan yang akan dimanipulasi, sementara argument asli tidak terpengaruh.


Fungsi jumlah($nilai) akan memasukkan variable $input ke dalam argumennya artinya nilai dari $input adalah argument asli yaitu bernilai 7. Kemudian PHP akan menyalin nilai tersebut. Hasil salinan itulah yang akan dimanipulasi melalui proses manipulasi sebagai berikut:

$nilai++;
$nilai = $nilai + 1
$nilai = 7 + 1
$nilai = 8

Outputnya adalah echo $input;
Variable $input yang diminta di sini adalah variable aslinya, bukan hasil manipulasi fungsi. Jadi outputnya adalah 7 bukan 8.


2. Passing by reference
Berbeda dengan passing by value, passing by reference akan membawa argument asli ke dalam fungsi. Jadi argument asli tersebut akan ikut berubah ketika terjadi proses manipulasi.





Nilai yang diminta dan dimanipulasi adalah nilai aslinya. Jadi outputnya adalah hasil manipulasi tersebut, yaitu 8.

Nama lain dari pemrograman adalah scripting. Script dapat disisipkan ke dalam dokumen HTML. DHTML (Dynamic HTML) merupakan suatu teknik untuk menciptakan
halaman web yang interaktif dengan cara mengombinasikan elemen-elemen
seperti HTML, style sheet, dan scripting. Jadi, DHTML bukanlah suatu jenis
bahasa pemrograman melainkan hanya sekadar istilah saja. Pada bagian ini,
pembuatan DHTML akan dilakukan dengan memanfaatkan JavaScript, yaitu pada aplikasi pemesanan seperti yang terlihat pada gambar di samping.
Aplikasi pemesanan ini memiliki spesifikasi:

1. Field Harga, Jumlah Total, Diskon, dan Jumlah Dibayar bersifat read-only
2. Jika pesan disi, maka field jumlah total secara otomatis akan menghitung totalnya, termasuk juga field jumlah dibayar.
Rumus:
Jumlah Total = ∑ (harga * pesan)
Jumlah Dibayar = Jumlah Total - Diskon
3. Jika pembelian lebih dari 50000, maka field diskon secara otomatis
akan berisi nilai diskon sebesar 10000 (tidak berlaku kelipatannya)
dan otomatis pula field jumlah dibayar akan berkurang
4. Jika tombol Batal diklik, maka semua field Pesan akan dibersihkan
Anda dapat melihat script lengkapnya di sini

Kali ini kita akan mencoba membuat desain layout sederhana yang di dalamnya terdapat header, menu, content, dan footer dengan style terpisah. Tampilan sederhananya seperti pada gambar di samping.
Pertama, definisikan style seperti di bawah ini dan simpan dengan nama desain.css
Berikut script css-nya:

#wrapper {
margin:auto;
width: 1260px;
border: 3px solid red;
}
#header {
margin: 2px 0;
height: 100px;
border: 1px solid blue;
}

#separateheader {
clear: both;
width: 1260px;
height: 9px;
}

#inner {
width: 1260px
height: auto;
float: left;
margin: 0 0;
border: 2px solid orange;
}

#sidebar {
float: left;
margin-right: 30px;
width: 200px;
height: 350px;
border: 1px solid yellow;
border: 1px solid blue;
}


#content {
float: left;
width: 1015px;
height: 350px;
border: 1px solid black;
}

#topcontent {
float: left;
width: 1014px;
height: 100px;
border: 2px solid orange;
}
#maincontent {
float: left;
width: 750px;
height: 248px;
border: 1px solid blue;
}

#rightcontent {
float: right;
width : 220px;
height : 220px;
border : 1px solid black;
}
#footer {
clear: both;
height: 50px;
border: 1px solid blue;
padding: 10px 0 0 0;
font-size: 15px;
font-weight: bold;
text-align : center;
font-family: "comic sans series", Times, serif;
color: orange;
}

Selanjutnya membuat desain layout dan simpan dengan nama dengan nama desain.htmml
Untuk mengetahui script desain layoutnya klik di sini

Masih seputar grafik berbasis tabel.
Berikut ini kita akan memanfaatkan fitur pengelompokan seperti gambar di samping.
Untuk scriptnya bisa dilihat (di sini)

Terdapat elemen-elemen HTML yang biasanya sering kita gunakan diantaranya:
- Link
- Tabel
- Frame
- Form
Salah satu implementasinya adalah membuat kreasi batang grafik statis seperti gambar di samping dengan memanfaatkan elemen tabel.
Berikut ini adalah scriptnya: (Click di sini)

Keinginan untuk dapat membangun website sendiri mungkin ada di benak para pecinta IT.
Hal ini berawal dari pemrograman web. Mempelajari dasar-dasar HTML adalah yang pertama dilakukan oleh pemula seperti saya ini.heheee...
Apa itu HTML? HTML merupakan dokumen standar yang digunakan untuk
mendesain halaman web.
Berikut ini adalah kebutuhan-kebutuhan yang minimal diperlukan:
a. WampServer
b. Web Browser
c. Editor Teks
d. HTML Validator
Oke, kita coba dengan membuat tampilan web sederhana seperti di atas, n berikut ini scriptnya :click di sini