WEB PROGRAMMING 1
Software yang digunakan : PHP Coder & Apache2triad.
Konsep Dasar Pembuatan Web
Dalam pembuatan sebuah website, tentu kita harus
mengetahui konsep dasarnya.Dimana ide dan gagasan yang
ada dipikirannya bisa tertuang pada setiap halaman web.
Namun, kita juga juga perlu berkonsultasi pada pemilik web Namun, kita juga juga perlu berkonsultasi pada pemilik web
itu sendiri agar konsepnya dapat tercapai dengan yang
diharapkan
Struktur Navigasi
alur dari suatu program yang merupakan rancangan hubungan
(rantai kerja) dari beberapa area yang berbeda dan dapat
membantu mengorganisasikan seluruh elemen
pembuatan Website pembuatan Website
Macam-macam Struktur Navigasi:
A. Struktur Navigasi Linier :
Struktur navigasi linier hanya
mempunyai satu rangkaian
cerita yang berurut, yang cerita yang berurut, yang
menampilkan satu demi satu
tampilan layar secara
berurut menurut urutannya.
Struktur Navigasi Non-Linier
Struktur navigasi non-linier atau struktur tidak berurut
merupakan pengembangan dari struktur navigasi linier.
Pada struktur ini diperkenankan membuat navigasi
bercabang. Percabangan yang dibuat pada struktur bercabang. Percabangan yang dibuat pada struktur
nonlinier ini berbeda dengan percabangan pada struktur
hirarki,
Struktur Navigasi Non-Linier
Struktur Navigasi Hirarki
Struktur navigasi hirarki biasa disebut struktur
bercabang, merupakan suatu struktur yang
Mengandalkan percabangan untuk menampilkan Mengandalkan percabangan untuk menampilkan
data berdasarkan kriteria tertentu
Struktur Navigasi Hirarki
Struktur Navigasi Campuran
Struktur navigasi campuran merupakan gabungan dari ketiga
struktur sebelumnya yaitu linier, non-linier dan hirarki.
Struktur navigasi ini juga biasa disebut dengan struktur
navigasi bebas.
Struktur Navigasi Campuran
Pengertian HTML (Hypertext Markup
Language)
HTML adalah bahasa standar yang digunakan untuk
menyusun/membangun suatu halaman web.
Dokumen HTML merupakan Teks murni (ASCII) dengan kode-
kode special. Maksudnya adalah dokumen HTML hanya akan
berisi Tulisan berupa Huruf, Angka, tanda baca dan karakter-
karakter lainnya termasuk Kode-kode Tag HTML itu sendiri. karakter lainnya termasuk Kode-kode Tag HTML itu sendiri.
Macam-macam Tag
Tag <HTML>
Tag <HEAD>
Tag <TITLE>
Tag <BODY>
Bentuk Umum Dokumen HTML
Contoh program
Silakan Ketik Program dibawah ini
Penyimpanan File
Untuk penyimpanan file selalu disimpan dalam htdocs.
Mahasiswa bisa membuat folder Nim didalam htdocs.
c:\Apache2triad\htdocs\1212xxxx. Pembuatan nama file
pada saat penyimpanan harus diakhiri dengan extention pada saat penyimpanan harus diakhiri dengan extention
.php. Contoh : contoh01.php
Cara Melihat Hasil File yang diekskusi
Buka Web Browser
ketikkan pada address bar
localhost.
Kemudian pilih file Kemudian pilih file
contoh01.php
Contoh 2
Silakan Ketik Script dibawah ini dan simpan dengan nama:
contoh2.php
Hasil dari Contoh2.php
Take Home
Buatlah script HTML dengan nama latihan1.php untuk bentuk
tampilan dibawah ini :
Note : Sebelum
Mengerjakan script
tersebut.
Mahasiswa diperkenankan Mahasiswa diperkenankan
terlebih dahulu
mengerjakan
contoh3.php yang ada
di Modul
Pada Bab I
Pertemuan 2
ReviewPertemuan 1 Tentang Latihan1.php
Mahasiswa diharapkan sudah menyelesaikan latihan
tersebut
Pengenalan PHP
PHP (Hypertext Preprocessor) adalah bahasa pemrograman
yang berfungsi untuk membuat website dinamis maupun
aplikasi web. PHP bisa berinteraksi dengan database, file dan
folder, sehingga membuat PHP bisa menampilkan konten yang folder, sehingga membuat PHP bisa menampilkan konten yang
dinamis dari sebuah website.
Sejarah Perkembangan PHP
PHP (PHP: Hypertext Preprocessor) diciptakan oleh Rasmus
Lerdorf. PHP awal mulanya hanya digunakan oleh penciptanya
untuk mencatat pengunjung pada hompagenya (semacam hit
counter). Rasmus salah seorang yang mendukung counter). Rasmus salah seorang yang mendukung
opensource, maka ia mengeluarkan Personal Home Page
(PHP) Tools versi 1.0. PHP terus dikembangkan dan sampai
saat ini versinya sudah mencapai 5.0
Kelebihan PHP
PHP adalah termasuk bahasa embedded ( bisa diletakkan dalam
tag HTML )
PHP diterbitkan secara gratis.
Web Server yang mendukung php relatif mudah dan dapat
ditemukan dimana - mana
Dalam sisi pengembangan lebih mudah.
PHP adalah bahasa open source yang dapat digunakan di
berbagai mesin (linux, unix, windows) dan dapat dijalankan
secara runtime melalui console serta juga dapat menjalankan
perintah-perintah system.
Kode PHP diawali dengan tanda <? dan diakhiri dengan
?>. Cara lain adalah diawali dengan <?php dan diakhiri
dengan ?>.
Memulai PHP
KONSEP DASAR PHP
Pemahaman Script
Script yaitu kumpulan instruksi program yang tidak
memerlukan kompilasi dan hasilnya ditampilkan pada
browser. Yang termasuk ke dalam kategori script, yaitu : browser. Yang termasuk ke dalam kategori script, yaitu :
JavaScript, VBScript, PHP, ASP, dan JSP.
Aturan penulisan script PHP
Semua script bisa ditandai dengan tanda :
<?php dan ?>
Pada setiap akhir perintah, diakhiri dengan tanda Pada setiap akhir perintah, diakhiri dengan tanda
titik koma ( ; )
contoh script PHP sederhana
Buat script dibawah ini dengan nama contoh4.php
Program yang dihasilkan
Latihan
Buatlah script dengan tampilan dibawah ini :
Hello Word!!!!
This is my first PHP
Simpan dengan nama latihan2.php
Pertemuan 3
VARIABEL, TIPE DATA dan Konstanta
Pencapaian Materi :
Dapat menggunakantipe data yang sesuaidengan variabelnya Dapat menggunakantipe data yang sesuaidengan variabelnya
Variabel
Variabel adalah tempat penyimpanan data.
Yang diperbolehkan dalam penamaan variabel antara lain:
Nama variabel bisa terdiri atas huruf abjad, angka, dan
underscore ( _ )
Nama variabel bisa diawali dengan underscore ( _ ) Nama variabel bisa diawali dengan underscore ( _ )
Nama variabel tidak boleh diawali dengan angka
Nama variabel tidak boleh mengandung operator aritmatika
Nama variabel tidak boleh mengandung karakter khusus,
seperti : @ ; # ! & .
Nama variabel tidak boleh mengandung spasi
METHOD GET
Nama dan nilai variabel akan tampak di address URL
browser. Method GET lebih cocok untuk pengiriman
variabel di sertai argumen yang panjang, serta tidak
membutuhkan keamanan lebih. membutuhkan keamanan lebih.
METHOD POST
Nama dan nilai variabel tidak akan tampak di address URL
browser. METHOD POST lebih cocok untuk pengiriman
variabel yang membutuhkan pengamanan.
Tampilan Input
Note: Mahasiswa bisa
melihat scriptnya pada melihat scriptnya pada
modul web programming
Tampilan Output
Take Home
Note: Mahasiswa
mengerjakan tugas ini
dalam bentuk cd
Tampilan output
PERTEMUAN 15
Mengenal MySQL
Mysql adalah sebuah program database
server yang mampu menerima dan
mengirimkan datanya dengan sangat
cepat,multi user serta menggunkan perintah cepat,multi user serta menggunkan perintah
standar sql (struktur query language ).
Penggunaan MySQL Dengan Command
Prompt
Langkah-langkah mengaktifkan MySQL :
Klik menu Start, kemudian pilih All Program
Accessories Command Prompt. Kemudian tampil
1.
Accessories Command Prompt. Kemudian tampil
jendela sebagai berikut :
Ketikkan perintah di bawah ini, untuk masuk ke
dalam MySQL
2.
Pembuatan Database MySQL
Langkah-langkah pembuatan database MySQL :
Create Database nama_database;
Perintah untuk pembuatan database 1.
Show Databases;
Melihat isi seluruh database yang ada 2.
Use nama_database;
Mengaktifkan Database yang akan digunakan 3.
Langkah-langkah pembuatan tabel :
Create table nama_tabel (field1,
type(length), field2 type(length),
field3 type(length));
Syntax pembuatan tabel : 1.
Contoh :
Show tables;
Untuk melihat tabel yang sudah ada
Contoh :
2.
Desc nama_tabel;
Untuk melihat struktur tabel 3.
Contoh :
4.
Drop table nama_tabel;
Untuk menghapus tabel
Contoh :
Latihan
1. Aktifkan database Akademik yang sudah dibuat
sebelumnya.
2. Buat tabel baru dengan nama Mata_kuliah
3. Buat struktur tabel sebagai berikut
Nama field Type Data Length Keterangan
Kode_matkul Varchar 3 Primary key
Nama_matkul Varchar 20
Sks Varchar 1
Perintah Select, Insert, Delete, dan Update
Insert into nama_tabel
Perintah Insert
Perintah insert digunakan untuk menambahkan
data baru ke dalam tabel.
1.
Insert into nama_tabel
(daftar_kolom) values
(daftar_nilai);
2.
Select * from nama_tabel;
Perintah Select
Berfungsi untuk menampilkan data yang
terdapat di dalam database atau tabel.
Contoh : Contoh :
Kode_matkul Nama_matkul Sks
001 Web Programming 1 4
002 Visual Basic 4
003 Delphi 4
Isi data pada tabel mata_kuliah sebanyak 3 record
003 Delphi 4
3.
Delete nama_tabel where
nama_kolom=content_kolom;
Perintah Delete
Berfungsi untuk menghapus sejumlah data
yang ada di dalam tabel yang sudah dibuat.
Delete mata_kuliah where kode_matkul=001;
Contoh :
4. Perintah Update
Update tabel_name set
column1_name=column1_content where
Berfungsi untuk melakukan sejumlah perubahan
terhadap sejumlah data yang ada di dalam tabel
yang telah dibuat.
column2_name=column2_content
Contoh:
PERTEMUAN 16
PHPMyAdmin merupakan salah satu kakas
pengolah database MySQL yang berbasis web.
Cara mengaktifkan phpmyadmin, ketikan pada
alamat url :
http://localhost/phpmyadmin
PHPMyAdmin
http://localhost/phpmyadmin
Tampilan phpmyadmin pada browser :
Membuat Database Baru
Buatlah database baru dengan nama :
penggajian di ketik pada textbox create new
database kemudian tekan create
1.
Membuat tabel baru
Setelah membuat database kampus, setelah itu buat
tabel baru dengan nama karyawan pada textbox
create new table on database, number of field= 5
kemudian klik Go
isi data seperti di bawah ini :
Kemudian klik save untuk menyimpan field-field yang
baru saja dimasukkan
Memasukan data ke dalamtabel
Jika ingin memasukan data-data ke dalam tabel, klik
insert
Kemudian isi data-datanya :
Memasukan isi data
Menambahkan
baris baru
Untuk menyimpan isi data klik Go, jika ingin
membatalkan klik reset
Jika ingin melihat data yang telah anda isi klik
maka akan muncul tampilan seperti ini :
Menambahkan tabel baru
Jika ingin menambahkan tabel baru klik nama
database yang anda buat contoh
kemudian ikuti langkah cara membuat tabel baru.
Menghapus Tabel dan database
Jika ingin menghapus database ataupun tabel yang
anda buat klik maka akan muncul pesan
apakah anda ingin menghapus database / tabel ? klik
OK jika ingin menghapus, jika tidak klik Cancel
1. Buatlah database baru dengan nama toko
2. Buat tabel baru dengan nama barang, number
of field=4 Isi Field-field berikut ini :
Latihan :
Field Type Length Key
Kd_brg Varchar 5 primary key
Nm_brg Varchar 20
Harga Int 5
Stok Int 2
Kd_brg Nm_Brg Harga Stok
BK001 Buku Tulis 5000 10
PL002 Pulpen 4000 25
PS003 Pensil 2000 30
Isi data-data berikut ini :
PS003 Pensil 2000 30
Field Type Length Key
Kd_pembeli Varchar 6 primary key
3. Buat tabel ke-2 dengan nama pembeli, number
of field=3
Isi Field-field berikut ini :
Nama Varchar 20
Telp Varchar 7
Isi data-data berikut ini :
Kd_Pembeli Nama Alamat Telp
P00001 Fitria Depok 7771607
P00002 Ifur Jagakarsa 7762010
P00003 Trias Lenteng 7772101 P00003 Trias Lenteng 7772101
4. Tampilkan isi data tabel barang dan pembeli
5. Tambahkan 1 field Merk dalam tabel barang
(type=Varchar, Length=15) letakan field
tersebut di bawah field nama kemudian isi
datanya
Kd_brg Merk Kd_brg Merk
BK001 Kiky
PL002 Snowman
PS003 Fiber Castle
6. Hapus database yang telah anda buat.
PERTEMUAN 17
Fungsi-fungsi dalam mysql diantaranya
adalah :
MYSQL-CONNECT()
Menghubungkan ke server mysql. Fungsi ini
merupakan fungsi awal yang akan dijalankan
sebelum melakukan fungsi-fungsi lain.
Bentuk umum penulisan :
1.
sebelum melakukan fungsi-fungsi lain.
Mysql_connect(host,user,password ) ;
MYSQL_CREATE_DB()
Fungsi yang sangat jarang di gunakan karena pada
umumnya setiap programmer web, lebih cenderung
dalam membuat database pada console atau
phpmyadmin pada browser. Fungsi ini untuk
membuat database baru.
2.
membuat database baru.
Mysql_create_db(nama_database) ;
MYSQL_SELECT_DB()
Fungsi ini untuk mengaktifkan database yang telah
tersedia pada mysql server.
Mysql_select_db(nama_database) ;
3.
MYSQL_QUERY() 4. MYSQL_QUERY()
Fungsi ini untuk memasukkan perintah-perintah
SQL.
Mysql_query(perintah-perintah SQL) ;
4.
MYSQL_NUM_ROWS()
Fungsi ini untuk mengetahui berapa jumlah
record terkini. Fungsi ini berguna apabila akan
membuat tabel yang bercorak.
Mysql_num_rows(variabel) ;
5.
MYSQL_FETCH_ROW()
Fungsi ini untuk mengambil data per record atau
per baris dalam suatu tabel, berdasarkan sistem
urutan nomor index field.
Mysql_fetch_rows(variabel) ;
6.
MYSQL_FETCH_ARRAY()
Fungsi ini memiliki fungsi yang sama dengan
mysql_fetch_row() yaitu mengambil data per
record. Yang membedakan adalah jika
mysql_fetch_row() mengambil data berdasarkan
nomor urut index sedangkan fungsi ini adalah
nama fieldnya.
7.
nama fieldnya.
Mysql_fetch_rows(variabel) ;
Contoh kasus koneksi MySQL :
1. Buat database dengan nama kampus
2. Buat tabel dengan nama Mahasiswa. Struktur
tabel sebagai berikut :
Buat tampilan form input seperti di bawah ini,
simpan dengan nama tambah_mahasiswa.php :
3.
Script tambah_mahasiswa.php
Script simpan_mahasiswa.php
Buat tampilan form output seperti di bawah ini : 4.
Script tampil_mahasiswa.php
PERTEMUAN 18
Field Type Size Key
1. Buatlah sebuah database dengan nama
buku_tamu
2. Buatlah sebuah tabel dengan nama tamu number
of field : 6
Berikut field-fieldnya :
Id Int 10 auto increament
primary key
name varchar 80
email varchar 100
address varchar 100
city varchar 100
msg text
Berikut tampilan program buku tamu, silakan
anda buat script programnya
4.
PERTEMUAN 19 & 20
Pada bab ini membahas studi kasus mengenai
formulir online dengan ketentuan sebagai berikut :
1. Buatlah sebuah database dengan nama formulir
2. Buatlah sebuah tabel dengan nama siswa number
of field : 6
Berikut field-fieldnya :
Field Type Size Key
Id Int 10 auto increament primary key
nama varchar 100
address varchar 100
city varchar 50
telp varchar 8
pekerjaan varchar 50
foto varchar 100
Berikut tampilan program formulir, silakan anda
buat script programnya.
PERTEMUAN 21
1. Buat database menggunakan database MySQL
dengan nama Media.
2. Buat tabel dengan nama User. Struktur tabel
sebagai berikut :
Buat tabel dengan nama Berita. Struturk tabel
sebagai berikut :
3.
Buat tampilan form login
Script login.php
Buat tampilan form signup
Script signup.php
Script simpanuser.php
Script ceklogin.php
PERTEMUAN 22
Buat tampilan form berita
Script tambah_berita.php
Script simpan_berita.php
script tampil_berita.php
Script buka_file.php
PERTEMUAN 23
Script logout.php
status.php Script status.php
Buat tampilan Index
Script index.php
PERTEMUAN 24
TUGAS KELOMPOK
1. Buat kelompok dengan jumlah peserta 5 7
mahasiswa tiap kelompok (jumlah disesuaikan
dengan jumlah mahasiswa tiap kelas).
2. Tiap kelompok diwajibkan merancang sebuah website
informasi dengan tema yang berbeda-beda. Tema
website bisa didiskusikan sebelumnya kepada website bisa didiskusikan sebelumnya kepada
instruktur masing-masing.
3. Tugas dikerjakan di kelas masing-masing dan akan
dipresentasikan di akhir pertemuan menjelan UAS.
4. Nilai Tugas akan digunakan sebagai nilai quiz.
Dengan kriteria penilaian adalah rata-rata dari nilai
kelompok dan nilai pribadi.