Senin, 20 Oktober 2014

MODUL 5

A.      TUJUAN
Memahami dan mengetahui fungsi dari CSS (Cascading Style Sheet) sebagai bahasa pemograman guna mengatur desain dan layout web.

B.      LANDASAN TEORI
CSS (Cascading Style Sheet) adalah sebuah cara untuk memisahkan isi dengan layout dalam halaman-halaman  web yang dibuat. CSS dapat menciptakan halaman yang tampak sama dengan resolusi layar dari pengunjung yangberbeda tanpa memerlukan suatu tabel. Dengan CSS, akan lebih mudah melakukan setting tampilan keseluruhan web hanya dengan menggantikan atribut-atribut atau perintah dalam style CSS dengan atribut yang dinginkan tanpa harus mengubah satu per satu atribut tiap elemen yang ada dala situs yang dibuat.

C.      ALAT DAN BAHAN
1.       Satu buah PC
2.       Aplikasi Notepad
3.       Web browser
4.       Lembar kerja percobaan

D.      LANGKAH-LANGKAH PRAKTIKUM
1.       Membuat folder di Dekstop dengan memberi nama folder dengan NIM
2.       Untuk menyimpan file dengan ekstensi css , tulis nama file dengan ekstensi “.css
3.       Untuk menyimpan file dengan ekstensi html , tulis nama file dengan ekstensi “.html


E.        Percobaan 1 (Border)

Langkah-langkah praktikum        :

1.       Buka Aplikasi Notepad.
2.       Ketikkan script berikut ke dalam notepad.



Hasil :

Percobaan 2 (Gambar)
Langkah-langkah praktikum :
1. Letakkan sebuah file gambar ber-ekstensi .jpg didalam folder yang dibuat, beri nama file gambar tersebut dengan nama gambar.jpg
2. Buka apikasi Notepad
3. Ketik script berikut :



Hasil :

Percobaan 3 (Bayangan)

Langkah-langkah praktikum :
1. Buka aplikasi Notepad
2. Ketik script berikut :



Hasil :

Percobaan 4 (Hyperlink)

Langkah-langkah praktikum :
1. Buka aplikasi Notepad
2. Ketikkan Script :

 Hasil :

Percobaan 5 (Form Menggunakan Eksternal Style)
Langkah-langkah praktikum :
1. Buka aplikasi Notepad
2. Ketikkan script berikut :


3. Simpan file dengan nama style.css
4. Buka kembali lembar kerja baru di Notepad, Kemudian ketikkan script berikut :




5. Simpan dengan nama form.html

Hasil :

E. TUGAS

1. Buatlah border form pada percobaan 5 menggunakan salah satu style border pada percobaan 1. Tulis scriptnya dan lampirkan (printscreen) juga hasilnya di browser.



Hasil :

Jumat, 10 Oktober 2014

MODUL 4


1.       TUJUAN
Mengimplementasi bahasa pemrograman PHP dengan menggunakan database MYSQL kedalam sebuah aplikasi berbasis web

2.       ALAT DAN BAHAN
-                      PC
-                      Sistem Operasi Windows 7
-                      Browser Mozilla Firefox/Chrome
-                      Notepad++
-                      Web server local XAMPP /AppServ
-                      Lembar kerja percobaan

3.       LANGKAH PERCOBAAN
-                      install software xammp
-                      aktifkan mysql yang terdapat di dalam xampp

4.       Percobaan 1 
1. buka browser, dan ketikan localhost/phpmyadmin
2. buat database dengan nama 'mahasiswa'
3. Buat table dengan nama 'mhs', dengan jumlah field 5
4. Isikan field tersebut dengan
-                     Nim (varchar 20)
-                     Nama (Char 40)
-                     Jenis_kelamin(enum "laki-laki","perempuan")
-                     alamat (text)
-                     jurusan (varchar 45)


5.       Buka aplikasi notepad, kemudia ketikan sebagai berikut



1.       Buka aplikasi notepad, kemudia ketikan sebagai berikut
2.       simpan file dengan nama form.php pada folder yang sudah di buat
3.       Buka browser lalu mengetikan localhost/nimmu/form.php
4.       isikan data yg diperlukan
5.       Hasil :
TUGAS
1.    Dari form percobaan diatas, buatlah supaya data dalam tabel disetiap barisnya dapat di hapus dan di Ubah
2.    Menambahkan form validasi html5

JAWABAN
-          Untuk menambahkan form validasi HTML5, cukup menambahkan kode di awal script, dan menambahkan kode required didalam suatu form input



Menambah fungsi hapus dan edit
- Ketikan script berikut, beri nama index.php



- kemudian membuat file baru, dengan nama form.php, masukan script dibawah ini



- Kemudian buat file proses.php, yang berisi script



- Kemudian buat file proses.php, yang berisi script



- buatlah file update.php file ini di gunakan untuk mengubah data dalam database :



- Dan pada tahap terakhir buatlah action delete data di file hapus.php



- Dan pada tahap terakhir buatlah action delete data di file hapus.php



- Hasil :



Selasa, 07 Oktober 2014

MODUL 3


Percobaan 1

1. Mengetikkan script berikut di dalam notepad :

2. Menyimpan file dengan nama variable.php
3. Mengisi data yang diperlukan, dan tekan tombol kirim
hasil :




Percobaan 2
1. Mengetikkan script berikut di dalam notepad:

2. Simpan file dengan nama kendali.php
3. Hasil:



Percobaan 3
1. Mengetikkan script berikut di dalam notepad :


2. Menyimpan file dengan nama upload.php
3. cari gambar untuk di upload dengan menekan tombol browse, kemudian tekan tombol upload
hasil :




Percobaan 4
1. Mengetikkan script berikut di dalam notepad:

2. Menyimpan file dengan nama tanggal.php
3. Hasilnya :



Tugas 1
menulis script PHP untuk membuat program penjumlahan, kemudian print sreen hasilnya di browser
Script HTML:

Hasil :