Diana Cindy UMSIDA
POKOK BAHASAN
1
HTML
(Hypertext Markup Language)
A.
Tujuan :
1.
Mengenal dan mengetahui tenang pemrograman berbasis HTML
2.
Memahami dan mengetahui struktur dan fitur-fitur HTML
3.
Mahasiswa mampu menuliskan kode-kode HTML
4.
Memahami tentang pembuatan dan fungsi form.
B.
Dasar Teori
HTML adalah (Hipertext Markup Language) sebuah bahasa
standar yang digunakan oleh browser untuk membuat halaman dan dokumen pada
sebuah Web yang kemudian dapat diakses dan dibaca layaknya sebuah artikel. HTML
juga dapat digunakan sebagai link-link antara file-file dalam situs atau dalam
komputer dengan menggunakan localhost, atau link yang menghubungkan antar situs
dalam dunia internet.
Standar minimun elemen HTML adalah :
·
Document Type Declaration (DTD)
·
Head
·
Body
DTD
Sebagai standar versi
dokumen W3C yauti suatu deklarasi yang digunakan untuk mengidentifikasi jenis
dokumen HTML yang digunakan sehingga browser dapat menentukan bagaimana
memperlakukan kode tersebut.
Contoh DTD pada HTML vrsi
4:
<!DOCTYPE HTML PUBLIC
“-//W3C//DTD HTML 4.01 Transitional//EN” http://www.w3.org/TR/html4/loose.dtd>
Meta Dokumen
Elemen meta sebagai
identitas dari halaman web yang biasa terdiri dari owner, keyword, layout,
ataupun inisialisasi proses seperti refresh.
Contoh:
·
<meta http-equiv=”Content-Type” content=”text/html;charset=UTF-8”/>
·
<meta name=”kewords” content=”blog, web development, indonesia, html,
css”/>
·
<meta name=”description” content=”Tentang dasar-dasar HTML”/>
Keterangan tag-tag lainnya dapat dilihat pada tabel 1
dibawah.
Pada perkembangannya
versi HTML yang dimulai dipakai saat ini adalah HTML5 (HTML Versi 5) yang
merupakan standar baru pada pemrograman web berbasis HTML. HTML5
menawarkan fitur baru dan kemudahan penggunaan tag-tag html. HTML5 menggantikan
versi HTML sebelumnya, HTML 4.01 yang diperkenalkan pada 1999. Sejak saat itu,
telah terjadi banyak perubahan pada web. Walaupun HTML5 masih dalam tahap
pengembangan, namun browser-browser modern sudah banyak yang mendukung standar
HTML baru ini. Untuk tag-tag html versi sebelumnya masih dipakai di modul ini.
Fitur Baru HTML5
HTML5 menawarkan banyak
fitur yang menarik. Berikut ini adalah beberapa fitur HTML5 yang cukup menarik.
·
Tag <canvas> untuk menggambar 2D
·
Tag <video> dan <audio> untuk media playback
·
Mendukung penyimpanan lokal
·
Tag khusus, <articel>, <footer>, <header>, <nav>,
<section>
·
Kontrol baru pada form, seperti kalender, tanggal, waktu, email, url, an
search
Tabel 3. Tag-tag dalam HTML5
Tag |
Deskripsi |
<!-..-> |
Mendefinisikan komentar |
<!DOCTYPE> |
Mendefinisikan jenis
document |
<a> |
Mendefinisikan
hyperlink |
<area> |
Mendefinisikan area |
<article>* |
Mendefinisikan artikel |
<aside>* |
Mendefinisikan content
selain content halaman |
<audio>* |
Mendefinisikan audio |
<b> |
Mendefinisikan text
tebal |
<body> |
Mendefinisikan elemen
body |
<br> |
Mendefinisikan baris
baru |
<button> |
Mendefinisikan document
button/tombol |
<canvas>* |
Mendefinisikan document
grafis |
<caption> |
Mendefinisikan document
table caption |
<col> |
Mendefinisikan atribut
untuk kolom table |
<colgroup> |
Mendefinisikan kolom
table |
<command>* |
Mendefiniskan perintah
tombol |
<datalist>* |
Mendefinisikan dropdown
list |
<dd> |
Mendefinisikan definisi
deskripsi |
<del> |
Mendefinisikan text
yang di hapus |
<details>* |
Mendefinisikan suatu
elemen |
<dialog>* |
Mendefinisikan dialog
(converstation) |
<div> |
Mendefinisikan bagian
dalam suatu document |
<dl> |
Mendefinisikan daftar |
<dt> |
Mendefinisikan istilah |
<cm> |
Mendefinisikan text
rapat |
<embed>* |
Mendefinisikan external
content |
<fieldset> |
Mendefinisikan fieldset |
<figure>* |
Mendefinisikan isi
media, dan keterangan |
<footer>* |
Mendefinisikan bagian
footer |
<form> |
Mendefinisikan formulir |
<h1> ampai
<h6> |
Mendefinisikan header |
<head> |
Mendefinisikan
informasi tentang document |
<header>* |
Mendefinisikan sebuah
header untuk bagian suatu halaman |
<hgroup>* |
Mendefinisikan
informasi tentang bagian sebuah document |
<hr> |
Mendefinisikan garis
horizontal |
<html> |
Mendefinisikan document
html |
<i> |
Mendefinisikan text
italic |
<iframe> |
Mendefinisikan inline
sub frame |
<img> |
Mendefinisikan gambar |
<input> |
Medefinisikan input |
<keygen>* |
Mendefinisikan sebuah
kunci yang dihasilkan dalam bentuk |
<label> |
Mendefinisikan label
untuk form |
<legend> |
Mendefinisikan judul di
fieldset |
<li> |
Mendefinisikan list |
<link> |
Mendefinisikan refrensi
sumber |
<map> |
Mendefinisikan peta
gambar |
<mark>* |
Medefinisikan text yang
ditandai |
<menu> |
Mendefinisikan daftar
menu |
<meta> |
Mendefinisikan meta
information |
<meter>* |
Mendefinisikan ukuran
yang sudah di tetapkan |
<nav>* |
Mendefinisikan
navigation link |
<noscript> |
Mendefiisikan bagian
noscript |
<object> |
Mendefinisikan sebuah
object |
<ol> |
Mendefiisikan daftar
angka |
<optgroup> |
Mendefinisikan grup
pilihan |
<option> |
Mendefinisikan
drop-down option |
<output>* |
Mendefinisikan beberapa
jenis output |
<p> |
Mendefinisikan
paragraph |
<pre> |
Mendefinisikan text ke
format awal |
<progress>* |
Mendefinisikan kemajuan
suatu tugas apapun |
<rp>* |
Digunakan untuk
menentukan apakah browser mendukung ruby |
<rt>* |
Menjelaskan tentang
penggunaan ruby |
<ruby>* |
Mendefinisikan ruby
annotations |
<script> |
Mendefinisikan script |
<section>* |
Mendefinisikan section |
<select> |
Mendefinisikan
selectable list |
<small> |
Mendefinisikan text
kecil |
<source>* |
Mendefinisikan section |
<span> |
Mendefinisikan bagian
dalam sebuah document |
<strong> |
Mendefinisikan text
paket/tabel |
<style> |
Mendefinisikan style
untuk css |
<sub> |
Mendifinisikan
subscripted text lawan pangkat |
<sup> |
Mendefinisikan superscripted
text pangkat |
<table> |
Mendefinisikan table |
<tbody> |
Mendefinisikan table
body |
<td> |
Mendefinisikan table
cell |
<textarea> |
Mendefinisikan text
area |
<tfoot> |
Mendefinisikan table
footer |
<th> |
Mendefinisikan table
header |
<thead> |
Mendefinisikan table
header |
<time>* |
Mendefinisikan
date/time |
<title> |
Mendefinisikan judul
document |
<tr> |
Mendefinisikan baris
table |
<ul> |
Mendefinisikan daftar |
<video>* |
Mendefinisikan video |
Keterangan : Yang betanda (*) adalah tag baru yang tidak ada
di html 4
Dari tabel tag-tag html diatas kita tidak perlu menghafal
semua, karena pada pengaplikasiannya tidak semua tag dipakai.
POKOK BAHASAN II
CSS (Cascading Style Sheet)
A.
Tujuan
1.
Mahasiswa
mampu membuat style sheet pada dokumen HTML
2.
Mahasiswa
memahami aturan penulisan pada CSS
3.
Mahasiswa
mampu membuat layout website dengan CSS
B.
Dasar
Teori
Cascading
Style Sheet (CSS) merupakan aturan untuk mengendalikan beberapa komponen dalams
ebuah web sehingga akan lebih terstruktur dan seragam. CSS bukan merupakan
bahasa pemrograman.
Sama halnya
styles dalam aplikasi pengolahan kata seperti Microsoft Word yang dapat
mengatur beberapa style, misalnya heading, subbab, bodytext, footer, images,
dan style lainnya untuk dapat digunakan bersama-sama dalam beberapa berkas
(file).
Pada umumnya
CSS dipakai untuk memformat tampilan halaman web yang dibuat dengan bahasa HTML
dan XHTML. CSS dapat mengendalikan ukuran gambar, warna bagian tubuh pada teks,
warna table, ukuran border, warna border, warna hyperlink, warna mouse over,
spasiantar paragraph, spasiantarteks, margin kiri, kanan, atas, bawah, dan
parameter lainnya. CSS adalahbahasa style sheet yang digunakan untuk mengatur tampilan
dokumen. Dengan adanya CSS memungkinkankitauntukmenampilkanhalaman yang
samadengan format yang berbeda.
Sejarah CSS
Nama CSS didapat dari fakta bahwa setiap deklarasi style yang berbeda dapat diletakkan secara berurutan, yang kemudian membentuk hubungan ayah-anak (parent-child) pada setiap style. CSS sendiri merupakan sebuah teknologi internet yang direkomendasikan oleh World Wide Web Consortium atau W3C padatahun 1996. Setelah CSS distandarisasikan, Internet Explorer dan Netscape melepas browser terbaru mereka yang telah sesuai atau paling tidak hampir mendekati dengan standar CSS.
Versi
Untuk saat
ini terdapat tiga versi CSS, yaitu CSS1, CSS2, dan CSS3. CSS1 dikembangkan
berpusat pada pemformatan dokumen HTML, CSS2 dikembangkan untuk memenuhi
kebutuhan terhadap format dokumen agar bisa ditampilkan di printer, sedangkan
CSS3 adalah versi terbaru dari CSS yang mampu melakukan banyak hal dalam desain
website. CSS3 mendukung penentuan posisi konten, downloadable, huruf font,
tampilan pada table /table layout dan media tipeuntuk printer. Kehadiran CSS
yang ketiga diharapkan lebih baik dari versi pertama dan kedua.
Penulisan
Saat masuk pada
bagian CSS, sering dijumpai kode sebagai berikut:
h1 {
color: #0789de;
}
Bagian pertama sebelum tanda ‘{}’ dinamakan selector, sedangkan yang diapitoleh ‘{}’ disebut declaration yang terdiri dari dua unsur, yaitu property dan value. Selector dalam
pernyataan di atas adalah h1, sedangkan
color adalah property, dan
#0789de adalah value. Selain itu ada
tiga metode penulisan CSS atribut, yaitu:
Inline Style
Sheet
CSS didefinisikan langsung pada tag HTML yang bersangkutan. Cara
penulisannya cukup dengan menambahkan atribut style=”…”dalam tag HTML tersebut. Style hanya akan berlaku pada tag
yang bersangkutan, dan tidak akan memengaruhi tag HTML yang lain.
Embedded Style
Sheet
CSS didefinisikan terlebih dahulu dalam tag <style> … </style> di atas tag <body>. Pada pendefinisian ini disebutkan atribut-atribut CSS
yang akan digunakan untuk tag-tag HTML, yang selanjutnya dapat digunakan oleh
tag HTML yang bersangkutan.
External
Style Sheet
Menempatkan aturan CSS secara terpisah, style shet external
terhubung dengan dokumen melalui elemen head. File style sheet text disimpan
menggunakan ekstensi .css.
Syntax CSS
Syntax pada CSS terdiri dari tiga bagian, yaitu selector, property dan value
Selector {property: value}
Bagian selector untuk menentukan pada elemen/tag HTML apa style
tersebut diterapkan. Selector dapat berupa nama Id elemen atau nama class.
Property dapat diisi dengan jenis warna, ukuran, perataan margin dll, sedangkan
value diisi dengan nilai property nya, misalnya red untuk warna dll. Setiap
akhir penulisan property dan value diakhiri dengan tanda titik koma
(semicolon). Tanda ini juga digunakan sebagai pemisah antar satu property
dengan property lain.
Jika value lebih dari sebuah kata, maka harus diapit dengan tanda kutip ganda diantara value:
P{font-family: “sans serif”}
Jika Anda ingin menetapkan lebih dari satu property, maka property harus dipisahkan dengan titik kome (semicolon). Berikut ini adalah contoh yang menampilkan pendefinisian elemen paragraph agar rata tengah serta warna text nya adalah merah:
P{text-align:center;color:red}
Agar definisi style lebih mudah dibaca, maka kita dapat menuliskannya dengan bentuk berikut:
P{
Text-align: center;
Color: black;
Font-family: arial
}
Class Selector
Dengan
menggunakan class selector, kita dapat mendefinisikan style yang berbeda untuk
elemen HTML yang sama. Secara umum syntax style untuk class adalah sebagai berikut:
.namaKelas{
Property1: value1;
Property2: value2;
.
.
}
Misalnya kita ingin mendefinisikan dua buah tipe paragraph yaitu paragraph dengan rata kanan, sedang yang lainnya adalah rata tengah. Berikut bentuk penulisannya:
p.right {text-align: right}
p.center {text-align: center}
Dalam dokumen HTML kita harus menambahkan atribut
<p class=”right”>This paragraph will be right-aligned. </p>
<p class=”center”>This paragraph will be center-aligned. </p
Pada contoh
dibawah ini, semua elemen HTML dengan class=”center”, akan menjadikan rata
tengah.
center {text-align: center}
Pada dokumen HTML dibawah, elemen h1 dan elemen p menggunakan class “center”, artinya kedua elemen tersebut akan mengikuti aturan pada selector “center”:
<h1 class=”center”>This heading will be center-aligned </h1>
<p class=”center”>This paragraph will also be center-aligned </p>
Id selector
Kita juga
dapat mendefinisikan style dengan menggunakan id selector. nid selector didefinisikan
dengan menggunakan karakter #.Berikut adalah contoh penggunaan id selector:
#green {color: green}
Aturan style dibawah ini akan diterapkan pada elemen p yang menggunakan id dengan value adala “para1”.
p#para1 {
text-align: center;
color: red}
Komentar pada CSS
Komentar digunakan untuk menjelaskan baris kode Anda, sehingga dapat membantu juga suatu hari nanti Anda akan melakukan pengeditan terhadap source code. Sebuah komentar akan diabaikan oleh browser. Komentar pada CSS dimulai dengan dengan /* dan diakhiri dengan */, seperti contoh berikut
/* This is a comment */
p {
text-align: center;
/* This is anhoter comment */
color: black
font-family: arial
}
POKOK BAHASAN
III
JAVA SCRIPT
A.
Tujuan
1. Memahami
tentang struktur javascript.
2. Memahami
tentang pemrograman di javascript.
3.
Memahami tentang
pemakaian object dan form.
B.
Dasar
Teori
Javascript adalah bahasa scrip yang ditempel pada kode HTML dan
diproses disisi klient. Dengan adanya bahasa ini, kemampuan HTML menjadi
semakin luas. Contoh: untuk menvalidasi masukan pada formulir sebelum formulir
dikirim ke server.
Javascript bukan bahasa java dan merupakan dua bahasa yang berbeda.
Javascript diinterpretasikan oleh klient, sedang java dikompilasi oleh program
dan hasil kompilasinya dijalankan oleh clien.
Struktur
Javascript
<script language=”javascript”>
<!—
Penulisanjavascriptkode
//-->
</script>
Keterangan <!--//--> umumnya disertakan dengan tujuan agar
sekiranya browser tidak mengenali javascript maka browser akan memperlakukannya
sebagai komentar sehingga tidak di tampilkan dijendela browser.
Javascript
sebagai bahasa berorientasikan objek
Properti
Adalah atibut dari sebuah objek. Contoh: objek mobil mempunyai
property warna mobil.
Penulisan:
nama_objek.nama_properti=nilai
window.defaultstatus=”selamat belajar javascript”
Metode
Adalah sekumpulan kode yang digunakan untuk melakukan sesuatu
tindakan terhadap objek.
Penulisannya:
nama_objek.nama_method(parameter)
document.write(“halo”)
Letak
javascript dalam HTML
Skrip javascript dalam dokumen HTML dapat diletakkan pada:
1. Bagian
head
2. Bagian
body
Table 4. Aritmatic operator
Operator |
Description |
Example |
Result |
+ |
Penjumlaha |
X=2 Y=2 X+y |
4 |
- |
Pengurangan |
X=5 Y=2 X-y |
3 |
* |
Perkalian |
X=5 Y=3 X*y |
20 |
/ |
Pembagian |
15/5 5/2 |
3 2.5 |
% |
Modulus |
5%2 10%8 10%2 |
1 2 0 |
++ |
Penaikan |
X=5 X++ |
X=6 |
-- |
Penurunan |
X=5 X-- |
X=4 |
Tabel 5. Assignment Operator
Operator |
Keterangan |
Example |
Is the same
as |
= |
Pemberian nilai |
X=y |
X=y |
+= |
Penambahan bilangan |
X+=y |
X=x+y |
-= |
Pengurangan bilangan |
x-=y |
X=x-y |
*= |
Pengalian bilangan |
X*=y |
X=x*y |
/= |
Pembagian bilangan |
x/=y |
X=x/y |
%= |
Perolehan sisa bagi |
X%=y |
X=x%y |
Tabel 6. Comparisson Operator
Operator |
Description |
Example |
== |
Kesamaan |
5==8 return false |
=== |
Is equel to (checks for both value and type) |
X=5 Y=”5” X==y return false X===y return false |
!= |
Ketidaksamaan |
5!=8 return true |
> |
Lebihdari |
X*=y5>8 return false |
< |
Kurangdari |
5<8 return false |
>= |
Lebihbesaratausamadengan |
5>= return false |
<= |
Kurangdariatausamadengan |
5<=8 return true |
Tabel 7. Comparisson Operator
Operator |
Description |
Example |
&& |
And |
X=6 Y=3 (x<10&&y>1) return true |
|| |
Or |
X=6 Y=3 (x==5||y==5) return false |
! |
Not |
X=6 Y=3 !(x==y) return true |
POKOK BAHASAN IV
PHP
1.
Tujuan
1. Mengenalkan
kepada mahasiswa tentang pemrograman PHP.
2. Mahasiswa
mempu memahami Instalasi Apache dan PHP.
3. Memahami
tentang struktur kontrol.
4. Mahasiswa
dapat membuat halaman web dengan menggunakan script HTML dan PHP.
2. Dasar
Teori
PHP
(Preprocesor Hypertext) adalah bahasa scripting yang menyatu dengan HTML
dan dijalankan pada server side. Artinya semua sintaks yang diberikan
akan sepenuhnya dijalakan pada server sedangkan yang dikirimkan ke browser
hanya hasilnya saja berupa HTML. Untuk membedakan perintah HTML dan PHP
digunakan tanda <?...?> atau <?php...?>
PHP
dapat diaplikasikan dengan berbagai macam database seperti MySQL,
PostgreSQL,Oracle, dan lainnya.
Beberapa
script dasar PHP
§ Menampilkan
text
Echo “..text...<br>”
<br>:ganti baris
§ Variabel
Untuk membuat variabel diberi tanda
dollar ($). Variabel berfungsi untuk menyimpan suatu nilai dan dapat
berubah-ubah. Penulisann variabel yang benar adalah :
-
Karakter pertama tidak boleh berupa angka
(harus berupa huruf atau garis bawah)
-
Tidak mengandung spasi
-
Pemakaian huruf kapital dan huruf kecil
dibedakan
Contoh
penulisan variabel :
$data,
$data1,$data_ku
PHP
dapat anda Download secara free atau cuma-Cuma. Kunjungi saja situs www.php.net,
dan download versi terbarunya.
INSTALASI
Instalasi
Apache :
1. Appserv-win32-2.5.10.exe
2. Klik
next, sampai ada isian seperti berikut :
Server name : www.umsida.ac.id
Administrator email addess : admin@umsida.ac.id
3. Next
sampai ada isian berikut :
User admin : umsida
Pasword : umsida
4. Klik
next sampai Finish
5. Test
koneksi dengan mengetikan : http:/localhost di Internet Explorer, Mozilla,
Firefox atau Google Chrome.
Gambar 4.1.
Tampilan awal Appserv
6. Test
apakah php sudah terinstal dengan baik : Klik php information version.5.2.86
Gambar 4.2.
Tampilan info.php
Tag
dalam PHP
Banyak
cara untuk menyisipkan php dalam script html, ada berbagai macam bentuk tag yang
dapat digunakan, antara lain :
a. Cara
1
<?php Menandai awal tag
..........
?> Menandai
akhir tag
b. Cara
2
<? Menamdai
awal tag
.........
?> Menamdai
akhir tag
c. Cara
3
<% Menandai
awal tag
.........
%> menandai
akhir tag
Cara ini sama dengan tag pada ASP.
Opsi ini bisa dilakukan jika nilai asp_tags pada php ini bernilai on.
d. Cara
4
<script language=”php”> Menandai tag awal
.........
</script> Menandai akhir
tag
Ada kalanya sebagai pemrogram, karena
banyaknya kode program atau variabel dalam program, perlu menandai atau memberi
komentar pada program. Komentar pada program merupakan tulisan pada proram yang
tidak dieksekusi. Pada PHP, ada 3 macam cara penulisan :
a) /*komentar*/
Tulisan
apapun yang berada diantara ‘/*’ dan ‘*/’ akan dianggap sebagai komentar. Cara
seperti ini sangat berguna dan efisien untuk pemberian komentar yang memakan
banyak baris.
b) //komentar
Tulisan
di baris yang setelah ‘//’ akan dianggap sebagai komentar. Cara ini berguna
untuk pemberian komentar singkat yang tak lebih dari 1 baris saja.
c) #komentar
Sama seperti ‘//’, tulisan di baris yang sama setelah ‘#’ akan dianggap sebagai komentar. Cara ini berguna untuk pemberian komentar singkat yang tak lebih dari 1 baris saja.
Array
Array merupakan suatu variabel yang
dapat berisi banyak data dalam waktu yang sama. Pendefinisisan Array dapat
dibentuk dengan format berikut :
$nama_array=array(elemen_1,...,elemen_n);
Untuk menghitung jumlah elemen array
digunakan fungsi count(), dengan format count($nama_array)
§ Operator
Dalam PHP juga dapat melakukan proses
operasi, bail itu penjumlahan, operasi logika, ataupun operasi pembanding.
Operasi Mtematika yang digunakan
dalam PHP yaitu :
Operator |
Fungsi |
Operator |
Fungsi |
+ |
Penjumlahan |
- |
Pengurangan |
* |
Perkalian |
/ |
Pembagian |
% |
Sisa pembagian |
++,-- |
Penaikan, penurunan |
Operator
pembanding yang digunakan dalam PHP yaitu :
Operator |
Fungsi |
Operator |
Fungsi |
== |
Sama dengan |
< |
Kurang dari |
> |
Lebih dari |
<= |
Kurang dari atau sama dengan |
>= |
Lebih dari atau sama dengan |
!=,<> |
Tidak sama dengan |
Selain itu, operator
Logika juga dapat digunakan di PHP, antara lain, and (&&), or (||),
xor, dan !.
§ Penulisan
Karakter Khusus dengan tanda \
Karakter yang ditulis dengan diawali
tanda (\) yaitu :
Karaketer |
Keterangan |
Karakter |
Keterangan |
\” |
Tanda petik ganda |
\\ |
Tanda backslash |
\$ |
Tanda $ |
\n |
Pindah baris |
\t |
Tab |
\x00 s.d \xFF |
Heksadesimal |
§ Tipe Data
tipe data yang dikenal pada
pemrograman PHP yaitu :
Tipe data |
Keterangan |
Integer |
Tipe data bilangan bulat |
Double |
Tipe data bilangan real |
String |
Tipe data teks |
§ Konversi
Tipe Data
Fungsi-fungsi yang digunakan dalam
PHP untuk mengkonversi tipe data ke tipe data yang lain yaitu dengan memberikan
fungsi intval, doubleval, dan strval. Atau dengan menggunakan teknik cast,
yaitu dengan mengubah tipe ekspresi yang akan dikonversi.
§ Menampilkan
Tanggal fan Waktu
Untuk menampilkan tanggal dan waktu
secara update, dapat menggunakan perintah date dengan format-format
berikut :
Format |
Keterangan |
a, A |
am atau pm, AM atau PM |
d, D |
Hari/tanggal dalam 2 digit, hari (Sun..Sat) |
F |
Nama bulan (January..December) |
g, G |
Jam (1..12), jam (0..23) |
Z |
Hari dari tahun (0..365) |
y, Y |
Tahun dalam 2 digit, tahun dalam 4 digit |
h, H |
Jam (01..12), (00..23) |
I |
Menit (00..59) |
m, M |
Nama bulan (01..12), nama bulan (Jan..Dec) |
S |
Detik (00..59) |
W |
Hari ( 0=Sunday.. 6=Saturday ) |
POKOK BAHASAN V
Konektivitas PHP dengan
MYSQL
A.
Tujuan :
1.
Memahami langkah-langkah
koneksi PHP dengan MySQL.
2.
Memahami perbedaan
pengambilan record dari database.
B. Dasar Teori
Langkah-langkah koneksi PHP-MySQL
1. Membuka koneksi ke server
MySQL
mysql_connect()
Digunakan untuk melakukan uji dan koneksi kepada server database MySQL
Sintaks :
$conn = mysql_connect (”host”,”username”,”password”);
$conn : adalah nama
variabel penampung status hasil koneksi kepada database.
host : adalah nama host atau alamat
server database MySQL.
username : adalah nama user
yang telah diberi hak untuk dapat mengakses server database.
password : adalah kata sandi
untuk username untuk dapat masuk ke dalam database.
1. Memilih database yang akan
digunakan di server
mysql_select_db()
Digunakan untuk melakukan
koneksi kepada database yang dalam server yang berhasil dikoneksi dengan
perintah mysql_connect().
$db = mysql_select_db(”namadatabase”,$conn);
Sintaks :
$db : berisi status koneksi kepada
database.
$conn : merupakan koneksi kepada server
database yang berhasil.
namadatabase : adalah nama database yang akan dikenai
proses.
2. Mengambil sebuah query
dari sebuah database.
mysql_query()
Digunakan untuk melakukan
eksekusi perintah SQL untuk memanipulasi database yang berhasil dilakukan
koneksinya menggunakan mysql_select_db().
$hasil = mysql_query(”SQL Statement”);
Sintaks :
$hasil : akan berupa
record set apabila SQL Statement berupa perintah select.
Contoh SQL Statement :
”SELECT * FROM MAHASISWA ORDER BY NIM”
3. Mengambil record dari
database
a.
mysql_fetch_array()
Digunakan untuk melakukan pemrosesan hasil query yang dilakukan dengan
perintah mysql_query(), dan memasukkannya ke dalam array asosiatif, array
numeris atau keduanya.
$row = mysql_fetch_array($hasil);
Sintaks :
$row : adalah array satu
record dari record $hasil yang diproses nomor record sesuai dengan nomor urut
dari proses mysql_fetch_array yang sedang dilakukan.
$hasil : adalah record set yang akan
diproses.
b. mysql_fetch_assoc()
Fungsi ini hampir sama
dengan fungsi mysql_fetch_array(), hanya saja array yang dihasilkan hanya array
asosiatif.
$row = mysql_fetch_assoc($hasil);
Sintaks :
c. mysql_fetch_row()
Fungsi ini hampir sama
dengan fungsi mysql_fetch_array(), hanya saja array yang dihasilkan hanya array
numeris.
$row = mysql_fetch_row($hasil);
Sintaks :
d. mysql_num_rows()
Fungsi ini digunakan untuk
menghitung jumlah record yang ada pada database.
$row = mysql_num_row($hasil);
Sintaks :
$jml :
akan memiliki nilai sesuai dengan jumlah record yang ada.
POKOK BAHASAN VI
Desain Web Mobile jQuery
Mobile
A.
Tujuan
1. Mahasiswa memahami
tentang jquery mobile
2. Mahasiswa memahami
interkoneksi antar
halaman
3. Mahasiswa memahami
pembuatan aplikasi jquery
4. Mahasiswa
mampu menampilkan aplikasi yang dibuat di emulator mobile
B.
Dasar Teori
jQuery Mobile adalah framework berbasis jQuery yang memudahkan kita untuk membuat web app untuk mobile. Selain jQuery mobile sebenarnya banyak framework lain yang dapat digunakan seperti Sencha, jTouch, DHTMLX Touch, Jo dan lainnya. Kelebihan jQuery adalah:
1. Support banyak
platform: Webkit (Android, iOS,
Opera, Chrome), Firefox mobile, Windows
Phone, Blackberry, Bada,
Meego.
2. Berbasis
JQuery yang populer.
3. Penggunanya
banyak dan forum aktif.
jQuery Mobile menyediakan komponen UI widget seperti
button, listview, header dan elemen form dan navigasi.Kode ini dibangun
oleh jQuery dan
terus dikembangkan
oleh pengembangnya secara aktif untuk
memperbaiki
bug-bug yang
ada diaplikasi ini. Banyak
fitur yang
ditawarkan dalam
framework
ini termasuk
dukungan HTML5,
Ajax-powered
navigasi
link, dan sentuhan/atau navigasi gesekan.
Sebelum melakukan praktikum Desain Web Mobile dengan
jQuery Mobile ini, yang perlu disiapkan adalah:
a. jquery.mobile-1.3.2.min.css
b.
jquery-1.9.1.min.js
c. jquery.mobile-1.3.2.min.js
d. images
e. Opera Mobile
Emulator download gratis.
Komentar
Posting Komentar