Abimanyu Satria Purwanto

LAPORAN PRAKTEK KERJA INDUSTRI
DI
BALEMEDIA
KOMPETENSI KEAHLIAN : REKAYASA PERANGKAT LUNAK (RPL)
Disusun Oleh :
Nama : Abimanyu Satria Purwanto
NIS : 2965
Kelas : XI RPL 3
DINAS PENDIDIKAN PEMUDA DAN OLAHRAGA PROVINSI BALI

DINAS PENDIDIKAN PEMUDA DAN OLAHRAGA KOTA DENPASAR
SEKOLAH MENENGAH KEJURUAN TEKNOLOGI INFORMASI
(SMK TI) BALI GLOBAL DENPASAR
2017
i
iv
KATA PENGANTAR
Puji syukur penulis ucapkan Kehadirat TuhanYang Maha Esa yang telah
melimpahkan karunia dan rahmat-Nya sehingga Laporan Praktek Kerja Industri
ini dapat terselesaikan dengan baik dan tepat pada waktunya.
Penulis mengucapkan banyak terima kasih kepada semua pihak, baik
secara langsung maupun tidak langsung yang telah memberikan bantuan dalam
penyusunan Laporan Praktek Kerja Industri ini baik secara moral maupun secara
material.
Pada kesempatan yang baik ini tidak lupa penulis mengucapkan terima kasih
kepada :
1. Bapak Drs. I Gusti Made Murjana, M.Pd selaku Kepala SMK TI Bali Global
Denpasar.
2. Ibu Ni Wayan Sri Arini, ST., M.Kom selaku Koordinator Praktek Kerja
Industri.
3. Bapak A.A.G. Putra Dwi Arthajaya, S.Si selaku Ketua Kompetensi Keahlian
Rekayasa Perangkat Lunak.
4. Bapak I Gusti Putu Oka Dayendra, ST selaku Pimpinan Perusahaan.
5. Bapak Surya Putra Sandi Nugroho, S.Kom selaku Pembina di Industri.
6. Ibu Ida Ayu Widyawati, BPA selaku Pembina di Sekolah.
7. Semua pihak yang membantu dalam pelaksanaan Praktek Kerja Industri.
Penulis menyadari bahwa laporan ini belum sempurna, oleh karena itu
penulis mengharapkan saran dan kritik dari pembaca demi kesempurnaan laporan
ini. Semoga laporan ini dapat bermanfaat.
Akhir kata penulis ucapkan terima kasih
Denpasar, Mei 2017
( Penulis )
iii
MOTTO
“Kerjakanlah apa yang bisa dikerjakan

jangan menunda-nunda pekerjaan
sampai nanti waktu habis.”
iv
DAFTAR ISI
Judul .......................................................................................................... i
Lembar Pengesahan ................................................................................. ii
Kata Pengantar ........................................................................................ iii
Motto ......................................................................................................... iv
Daftar Isi ................................................................................................... v
Daftar Gambar ......................................................................................... vii
Daftar Tabel.............................................................................................. viii
BAB I PENDAHULUAN .................................................................... 1
1.1 Latar Belakang ................................................................... 1
1.1.1 Umum..................................................................... 2
1.1.2 Khusus .................................................................... 2
1.2 Tujuan ................................................................................ 3
1.2.1 Umum..................................................................... 3
1.2.2 Khusus .................................................................... 3
1.3 Manfaat .............................................................................. 3
1.3.1 Bagi SMK TI Bali Global Denpasar ...................... 3
1.3.2 Bagi Perusahaan ..................................................... 4
1.3.3 Bagi Siswa.............................................................. 4
1.4 Sistematika Penyusunan Laporan ...................................... 4
BAB II TINJAUAN UMUM PERUSAHAAN ................................... 6
2.1 Sejarah Balemedia .............................................................. 6
2.2 Visi dan Misi Balemedia .................................................... 6
2.2.1 Visi ......................................................................... 6
2.2.2 Misi ........................................................................ 6
2.3 Logo Balemedia ................................................................. 7
2.4 Struktur Organisasi Balemedia .......................................... 8
2.5 Produk Balemedia .............................................................. 9
v
BAB III PELAKSANAAN PRAKTEK KERJA INDUSTRI ............. 12
3.1 Rencana Kegiatan............................................................... 12
3.2 Pelaksanaan Praktek Kerja Industri ................................... 12
3.2.1 Ringakasan tugas yang dilaksanakan ..................... 12
3.2.2 Deskripsi tugas yang dilaksanakan ........................ 13
BAB IV PENUTUP ................................................................................ 158
4.1 Kesimpulan ........................................................................ 158
4.2 Saran ................................................................................... 158
4.2.1 Bagi Balemedia ..................................................... 158
4.2.2 Bagi SMK TI Bali Global Denpasar ...................... 158
Lampiran – lampiran
- Biodata
- Surat Pernyataan
- Surat Balasan
- Jurnal Kegiatan Siswa
- Absensi
- Nilai Kompetensi
- Form Bimbingan
- Sertifikat
vi
DAFTAR GAMBAR
Gambar 2.1 Logo Balemedia ................................................................. 7

Gambar 2.2 Struktur Organisasi Balemedia .......................................... 8
Gambar 2.3 Website InputBali ............................................................... 9
Gambar 2.4 Website Pondok Bambu ..................................................... 9
Gambar 2.5 Website JDIH Jembrana ..................................................... 10
Gambar 2.6 Website JDIH Karangasem ................................................ 10
Gambar 2.7 MAXOMORRA ................................................................. 11
Gambar 2.8 Meyaboo Admin Panel ....................................................... 11
Gambar 3.1 XAMPP Control Panel ....................................................... 14
Gambar 3.2 Phpmyadmin ....................................................................... 14
Gambar 3.3 Membuat tabel pada dbperpus ........................................... 15
Gambar 3.4 Membuat folder baru dihtdocs ........................................... 19
Gambar 3.5 Membaut folder assets ....................................................... 20
Gambar 3.6 Download Font-awesome................................................... 21
Gambar 3.7 Membuat Folder Baru dihtdocs ......................................... 21
Gambar 3.8 Peletakan Jquery ................................................................ 22
Gambar 3.9 Membuka folder pada Sublime Text ................................... 22
Gambar 3.10 Simpan file koneksi.php ..................................................... 23
Gambar 3.11 Membaut folder admin ....................................................... 26
Gambar 3.12 Membuat folder page dan partial ...................................... 27
Gambar 3.13 Membuat file header, content, footer ................................. 27
Gambar 3.14 Membuat New Folder ........................................................ 89
Gambar 3.15 Memberi nama pada foder user.......................................... 89
Gambar 3.16 Membuat File header, content, footer................................ 90
Gambar 3.17 Tampilan Website perpus ................................................... 157
vii
DAFTAR TABEL
Tabel 3.1 Ringkasan Kegiatan Bulan Januari 2017 ................................. 12

Tabel 3.2 Ringkasan Kegiatan Bulan Februari 2017 ............................... 12
Tabel 3.3 Ringkasan Kegiatan Bulan Maret 2017 ................................... 13
Tabel 3.4 Ringkasan Kegiatan Bulan April 2017 .................................... 13
viii
BAB I
PENDAHULUAN
1.1 Latar Belakang

Teknologi selalu berhubungan dengan kehidupan manusia. Dimana manusia
akan terus menggunakan teknologi sebagai pencari informasi maupun
membantu pekerjaan manusia dalam kehidupan sehari-hari. Perkembangan
teknologi sampai dengan saat ini berkembang dengan pesat seiring dengan
perkembangan ilmu pengetahuan dalam bidang informasi dan komunikasi
sehingga mampu menciptakan alat-alat yang mendukung perkembangan
Teknologi Informasi.
Pesatnya kemajuan tekonolgi, maka saat ini diperlukan tenaga-tenaga ahli
yang terdidik, terampil dan profesional di bidang teknologi, maka dengan itu
SMK TI Bali Global sebagai salah satu Sekolah Menengah Kejuruan yang
khusus bergerak dalam bidang Teknologi Informasi terus mengembangkan dan
meningkatkan mutu pendidikan agar mampu mengimbangi laju perkembangan
ilmu pengetahuan dan teknologi di masa yang akan datang.
Sistem kurikulum di SMK TI Bali Global menuntut para anak didiknya
untuk memiliki ilmu pengetahuan di bidang teknologi dan informasi, dan lebih
penting lagi para siswa yang telah selesai mengikuti pendidikan, juga akan
memiliki keterampilan serta kemampuan untuk menerapkan ilmu yang
dimilikinya, diterapkan dalam setiap pelaksanaan tugas di lapangan. Oleh
karena itu, SMK TI Bali Global sebagai sekolah yang mengkhususkan
pendidikan dalam bidang teknologi dan informasi, menambah Praktek Kerja
Industri di kelas XI sebagai pelajaran yang wajib bagi semua siswa.
Dengan melaksanakan Praktek Kerja Industri para pelajar juga dilatih
untuk bersosialisasi dengan lingkungan baru, belajar bertanggung jawab, serta
membiasakan diri menghadapi berbagai tantangan dalam dunia kerja dan
melalui praktek ini siswa dan siswi juga dapat memahami serta menghayati
pekerjaan sesungguhnya di lapangan.
1
2
1.1.1 Umum
a. Untuk memberi pengalaman Praktek Kerja Industri secara
langsung serta menyelesaikan berbagai masalah atau pekerjaan
yang timbul di lapangan.
b. Untuk meningkatkan keterampilan dan wawasan, baik secara
teknis maupun hubungan kemanusiaan.
c. Mempersiapkan siswa agar mampu berkompetensi dan
mengembangkan diri.
d. Melatih dan mendidik siswa untuk siap bekerja nantinya setelah
tamat sekolah.
e. Untuk membentuk prilaku positif bagi para siswa peserta Praktek
Kerja Industri melalui penyesuaian diri dengan lingkungan kerja
tempat praktek kerja.
f. Untuk mempersiapkan tenaga kerja tingkat menengah untuk
mengisi kebutuhan dunia kerja dan industri sekarang maupun pada
masa yang akan datang.
g. Untuk memupuk rasa kebersamaan tim secara baik terutama dalam
menyukseskan suatu program kerja.
h. Untuk membentuk rasa bertanggung jawab jika di tempat DU/DI
melakukan kesalahan.
i. Untuk mengukur suatu kemampuan masing – masing peserta,
setelah yang bersangkutan menghadapi berbagai masalah di
lapangan.
1.1.2 Khusus
a. Agar para siswa memiliki pengalaman Praktek Kerja Industri
sesuai dengan program keahlian masing – masing.
b. Siswa mempunyai gambaran nyata tentang dunia kerja, mulai dari
tingkat bawah sampai dengan tingkat yang lebih tinggi.
c. Kehadiran siswa peserta Praktek Kerja Industri diharapkan dapat
memberikan manfaat dan wawasan baru bagi dirinya serta tempat
Praktek Kerja Industri.
3
d. Mengajarkan siswa untuk menghargai waktu dan berdisiplin.

e. Siswa mempraktekkan ilmu yang didapatkan di sekolah dan
nantinya digunakan untuk Praktek Kerja Industri.
1.2 Tujuan
Tujuan yang diharapkan setelah siswa mengikuti Praktek Kerja
Industri adalah :
1.2.1 Umum
a. Untuk meningkatkan mutu SDM ( Sumber Daya Manusia ).
b. Agar siswa mampu beradaptasi di lingkungan kerja.
c. Untuk mensinergikan antara teori dan praktek.
d. Agar siswa memahami cara melakukan suatu pekerjaan di dunia
usaha.
1.2.2 Khusus
a. Untuk memenuhi syarat ketuntasan nilai kenaikan kelas.
b. Untuk mencari pengalaman kerja.
c. Untuk memperoleh keterampilan agar kelak masa depan cerah.
d. Untuk menambah pengetahuan untuk bekerja nanti.
1.3 Manfaat
Manfaat yang diharapkan bisa diperoleh melalui Praktek Kerja Industri
adalah :
1.3.1 Bagi SMK TI Bali Global Denpasar
a. Untuk membantu memberikan pembekalan pengetahuan dan
keterampilan kepada setiap siswa tentang kondisi yang terdapat di
lapangan secara nyata.
b. Dapat lebih membuka wawasan bagi setiap siswa untuk mendapat
pengetahuan melalui Praktek Kerja Indurtri.
c. Sebagai perwujudan program keterkaitan dan kesepadanan antara
dunia pendidikan dan dunia industri.
4
d. Melalui praktek ini diharapkan semua siswa dapat menerapkan

ilmu yang telah didapat di sekolah untuk diterapkan dalam praktek
langsungnya di dunia usaha.
e. Praktek Kerja Industri diharapkan dapat menghasilkan tenaga kerja
yang dapat memenuhi kebutuhan pasar kerja di dunia usaha.
1.3.2 Bagi Perusahaan
a. Dapat saling menukar informasi di bidang teknologi antara
lembaga sebagai pengguna teknologi dengan perkembangan
pengetahuan yang terjadi di sekolah.
b. Peserta Praktek Kerja Industri dapat dimanfaatkan untuk
melaksanakan pekerjaan – pekerjaan.
c. Menilai kemampuan yang dimiliki oleh siswa peserta Praktek
Kerja Industri.
d. Mendapat tenaga kerja yang berkompeten dibidangnya.
1.3.3 Bagi Siswa
a. Dapat mengasah kemampuan yang didapat dari sekolah melalui
dunia usaha.
b. Mendapat pengalaman kerja yang baik dan dilatih langsung oleh
tenaga kerja yang profesional.
1.4 Sistematika Penyusunan Laporan

Adapun Sistematika Penyusunan Laporan Praktek Kerja Industri ini adalah
sebagai berikut :
BAB I PENDAHULUAN
Pada bab ini berisi Latar Belakang, Tujuan, Manfaat, dan
Sistematika Penyusunan Laporan.
BAB II TINJAUAN UMUM PERUSAHAAN
Pada bab ini berisi Sejarah, Visi dan Misi, Logo, Struktur
Organisasi, dan Produk Balemedia.
BAB III PELAKSANAAN PRAKTEK KERJA INDUSTRI
5
Pada bab ini berisi Rencana Kegiatan dan Pelaksanaan Praktek

Kerja Industri.
BAB IV PENUTUP
Pada bab ini berisi Kesimpulan dan Saran.
BAB II
TINJAUAN UMUM PERUSAHAAN
2.1 Sejarah Balemedia

Pada awalnya CV Balemedia dibentuk oleh I Gusti Putu Oka Dayendra
sebagai perusahaan tunggal yang diurus sendiri oleh beliau. Namun
perusahaan ini baru diresmikan pada awal 2015 bersamaan dengan ditutupnya
PT. Meyaboo Indonesia. PT. Meyaboo Indonesia adalah anak perusahaan
Maxomorra AB yang merupakan bagian IT dari Maxomorra AB yang
dibasiskan di Bali, namun didaftarkan di Indonesia sebagai PT dengan nama
yang berbeda. Maxomorra AB sendiri merupakan perusahaan asal Swedia
yang memproduksi pakaian anak-anak yang dijual secara wholesale ke
perusahaan-perusahaan retail di berbagai negara.
Penutupan PT. Meyaboo Indonesia dilakukan setelah perusahaan ini
beroperasi kurang lebih selama dua tahun sejak awal tahun 2012. Penutupan
ini dilakukan karena dirasa cukup sulit menangani perusahaan dengan
penaggung jawab berada di luar negeri. Maka untuk mengatasi hal tersebut, I
Gusti Putu Oka Dayendra memutuskan untuk menutup PT. Meyaboo
Indonesia dan membuka CV Balemedia bersama seluruh tim dari PT.
Meyaboo Indonesia dengan tetap menjadikan Maxomorra AB sebagai rekan
kerja utama, namun tidak menutup kemungkinan bagi perusahaan lain yang
ingin bekerja sama.
2.2 Visi dan Misi Balemedia

2.2.1 Visi
a. Menjadi salah satu perusahaan Software Developer yang
independen dan terkemuka.
2.2.2 Misi
a. Mengembangkan Sistem Informasi dan Manajemen Data yang
handal bagi para klien-kliennya.
6
7
b. Ekspansi perusahaan untuk menjadi Application Service Provider.

c. Mengembangkan sistem cloud yang terintegrasi dan handal.
2.3 Logo Balemedia
Gambar 2.1 Logo Balemedia
Arti Logo :
Bale : Bale diibaratkan sebagai Bale Bengong, yaitu tempat
berkumpul atau melakukan kegiatan santai bersama-sama.
Media : Sarana Komunikasi.
Warna Biru : Memiliki makna pola pikir yang dalam, yaitu semua
perangkat lunak yang kami buat diperhitungkan secara
detail, serta dengan sistem yang kompleks, sehingga client
nyaman menggunakan produk yang kami buat.
# (Crash : Penyelesaian suatu proyek dan penerapannya secara
Program/Sharp)
cepat.
Jadi logo Balemedia adalah suatu tempat berkumpulnya para Software

Developer untuk saling berkomunikasi dan bekerja sama menyalurkan
pendapat mereka untuk membuat suatu aplikasi yang berkualitas yang berguna
bagi para klien-kliennya
8
2.4 Struktur Organisasi Balemedia
CEO
CFO / Designer COO System Admin
Programmer
Gambar 2.2 Struktur Organisasi Balemedia
Deskripsi Tugas
a. CEO
1) Bertugas sebagai pimpinan perusahaan.
b. COO
1) Bertugas untuk memimpin divisi operasional internal perusahaan.
c. CFO / Designer
1) Bertugas untuk membuat desain GUI.
2) Mengurusi keuangan atau Financial.
d. System Admin
1) Bertugas untuk memasang, mendukung, dan memelihara server
atau sistem komputer lain, dan perencanaan untuk menanggapi
pemadaman layanan dan masalah lainnya.
e. Programmer
1) Bertugas untuk membangun atau mengembangkan software
terutama pada tahap construction dengan melakukan coding
dengan bahasa pemrograman yang ditentukan.
9
2.5 Produk Balemedia

a. InputBali
Gambar 2.3 Website InputBali
b. Pondok Bambu
Gambar 2.4 Website Pondok Bambu

10
c. JDIH Jembrana
Gambar 2.5 Website JDIH Jembrana
d. JDIH Karangasem
Gambar 2.6 Website JDIH Karangasem

11
e. MAXOMORRA
Gambar 2.7 MAXOMORRA
f. Meyaboo Admin Panel
Gambar 2.8 Meyaboo Admin Panel

BAB III
PELAKSANAAN PRAKTEK KERJA INDUSTRI
3.1 Rencana Kegiatan

Praktek Kerja Industri dilaksanakan di Balemedia pada bagian Web
Development dengan rencana kegiatan saat Praktek Kerja Industri, antara lain :
1. Menaati tata tertib perusahaan.
2. Belajar membuat Web Responsive.
3. Belajar query yang belum dipahami.
3.2 Pelaksanaan Praktek Kerja Industri
3.2.1 Ringkasan tugas yang dilaksanakan
a. Ringkasan Kegiatan Bulan Januari 2017
Tabel 3.1 Ringkasan Kegiatan Bulan Januari 2017
NO Kegiatan
1 Pelepasan dan Pengarahan
2 Membuat Web Article dengan penataan folder yang benar
3 Membuat Database dari Web Article
4 Membuat Layout Web Article
Sumber : Lampiran
b. Ringkasan Kegiatan Bulan Pebruari 2017

Tabel 3.2 Ringkasan Kegiatan Bulan Pebruari 2017
NO Kegiatan
1 Membuat Web Perpustakaan
2 Membuat Database Web Perpustakaan
3 Memahami Asc dan Desc
4 Memahami Inner Join
5 Membuat Layout Web Perpustakaan
Sumber : Lampiran
12
13
c. Ringkasan Kegiatan Bulan Maret 2017

Tabel 3.3 Ringkasan Kegiatan Bulan Maret 2017
NO Kegiatan
1 Memahami Bootstrap
2 Membuat Layout Web Directory dengan Bootstrap
3 Menambahkan jquery pada website
Sumber : Lampiran
d. Ringkasan Kegiatan Bulan April 2017

Tabel 3.4 Ringkasan Kegiatan Bulan April 2017
NO Kegiatan
1 Membuat laporan
2 Membuat website presentasi
3 Memasukan link project ke website presenteasi
4 Kembali ke sekolah
Sumber : Lampiran
3.2.2 Deskripsi tugas yang dilaksanakan

Berikut ini deskripsi tugas dari beberapa uraian tugas yang
dikerjakan di Balimedia antara lain membuat Website Perpustakaan
Dinamis dengan Form Login dan Logout dan membuat Web Layout
Directory Perusahaan denga menggunakan Bootstrap.
1. Membuat Website Perpustakaan Dinamis dengan Form Login dan

Logout.
Alat dan Bahan :
a. Laptop / Komputer
b. Sublime Text
c. Google Chrome
14
d. XAMPP Control Panel

e. Bahan website ( konten dan gambar )
Langkah kerja :
1) Nyalakan XAMPP Control Panel lalu Run Apache dan Mysql.
Gambar 3.1 XAMPP Control Panel
2) Buat Database dengan membuka localhost/phpmyadmin di

google chrome.
Gambar 3.2 Phpmyadmin

15
3) Setelah itu buat empat tabel dengan cara klik sql lalu ketikan
coding di bawah ini lalu klik Go .
Gambar 3.3 Membuat tabel pada dbperpus.
-- phpMyAdmin SQL Dump

-- version 3.2.0.1
-- http://www.phpmyadmin.net
--
-- Host: localhost
-- Generation Time: Mar 22, 2017 at 02:02 AM
-- Server version: 5.1.37
-- PHP Version: 5.3.0
SET SQL_MODE="NO_AUTO_VALUE_ON_ZERO";
/*!40101 SET
@OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIE
NT */;
/*!40101 SET
@OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RE
SULTS */;
/*!40101 SET
@OLD_COLLATION_CONNECTION=@@COLLATION_CONNEC
TION */;
/*!40101 SET NAMES utf8 */;
--
16
--
-- Database: `dbperpus`
--
-- --------------------------------------------------------
--
-- Table structure for table `tbanggota`
--
CREATE TABLE IF NOT EXISTS `tbanggota` (

`nim` int(11) NOT NULL,
`nama` varchar(200) NOT NULL,
`tempat_lahir` varchar(50) NOT NULL,
`tgl_lahir` varchar(50) NOT NULL,
`jk` enum('P','L') NOT NULL,
`prodi` varchar(50) NOT NULL,
`thn_masuk` varchar(5) NOT NULL
) ENGINE=MyISAM DEFAULT CHARSET=latin1;
--
-- Dumping data for table `tbanggota`
--
INSERT INTO `tbanggota` (`nim`, `nama`, `tempat_lahir`,

`tgl_lahir`, `jk`, `prodi`, `thn_masuk`) VALUES
(1, 'Satria', 'Jakarta', '10 Maret 2000', 'L', 'Komputer',
'2012'),
(6, 'Tris', 'Denpasar', '17 April 1998', 'L', 'Bahasa', '2008'),
(3, 'Icha', 'Denpasar', '12 november 2002', 'P', 'Komputer',
'2017'),
(4, 'Santi', 'Banyuwangi', '3 Januari 1999', 'P', 'Komputer',
'2016'),
(5, 'Adam', 'Papua', '12 Febuari 2000', 'L', 'Komputer',
'2010'),
(2, 'abimanyu satria purwanto', 'Jakarta', '10 juni 2001', 'L',
'Bahasa', '2012');
-- --------------------------------------------------------
17
--
-- Table structure for table `tbbuku`
--
CREATE TABLE IF NOT EXISTS `tbbuku` (
ìdbuku` int(11) NOT NULL AUTO_INCREMENT,
`judul` varchar(200) NOT NULL,
`pengarang` varchar(200) NOT NULL,
`penerbit` varchar(200) NOT NULL,
`thnterbit` varchar(200) NOT NULL,
`jumlah` int(11) NOT NULL,
`lokasi` enum('rak1','rak2','rak3') NOT NULL,
`tglinput` timestamp NOT NULL DEFAULT
CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
PRIMARY KEY (ìdbuku`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1
AUTO_INCREMENT=45 ;
--
-- Dumping data for table `tbbuku`
--
INSERT INTO `tbbuku` (ìdbuku`, `judul`, `pengarang`,
`penerbit`, `thnterbit`, `jumlah`, `lokasi`, `tglinput`) VALUES
(32, 'Nenek Kabayan', 'M.Nafsir', 'Matahari', '2012', 30,
'rak1', '2017-02-16 11:38:42'),
(31, 'Si kancil', 'M.Nafsir', 'Matahari', '2010', 12, 'rak2', '2017-
02-16 11:37:58'),
(19, 'Mahabarata The Movies', 'Supardi', 'Matahari', '2012',
5, 'rak2', '2017-02-10 10:12:29'),
(18, 'Dia', 'suparjo', 'Gramedia', '2005', 5, 'rak1', '2017-02-15
13:41:45'),
(33, 'Web Master', 'Dadang Mulyana', 'Gramedia', '2008', 30,
'rak1', '2017-02-16 11:42:11'),
(34, 'Bumi Manusia', 'Pramudya', 'Gramedia', '2005', 25,
'rak3', '2017-02-16 12:10:19'),
(35, 'Sang Pemimpi', 'Ahmad Soebarjo', 'Matahari', '2002',
12, 'rak2', '2017-02-16 12:11:01'),
'2010', 20, 'rak2', '2017-02-20 14:28:01'),
(43, 'Crazy love', 'Supardi', 'Gramedia', '2001', 2, 'rak1',
'2017-02-23 11:48:17'),
(44, 'Crazy love', 'Soebarjo', 'Gramedia', '2015', 20, 'rak3',
'2017-02-23 11:49:11');
18
--
-- Table structure for table `tbtransaksi`
--
CREATE TABLE IF NOT EXISTS `tbtransaksi` (

ìdtransaksi` int(11) NOT NULL AUTO_INCREMENT,
ìdbuku` int(11) NOT NULL,
`nim` int(11) NOT NULL,
`tglpinjam` date NOT NULL,
`tglkembali` date NOT NULL,
`status` enum('pinjam','kembali','perpanjang') NOT NULL,
ìduser` int(11) NOT NULL,
PRIMARY KEY (ìdtransaksi`)
AUTO_INCREMENT=68 ;
--
-- Dumping data for table `tbtransaksi`
--
INSERT INTO `tbtransaksi` (ìdtransaksi`, ìdbuku`, `nim`,

`tglpinjam`, `tglkembali`, `status`, ìduser`) VALUES
(67, 19, 3, '2017-03-07', '2017-03-10', 'pinjam', 4),
(66, 18, 1, '2017-03-22', '2017-03-23', 'pinjam', 4),
(65, 18, 1, '2017-03-06', '2017-03-08', 'pinjam', 0),
(64, 18, 1, '2017-03-06', '2017-03-08', 'pinjam', 0),
(63, 18, 1, '2017-03-06', '2017-03-08', 'pinjam', 0),
(62, 18, 1, '2017-03-22', '2017-03-27', '', 0),
(57, 43, 4, '2017-03-06', '2017-03-16', 'pinjam', 3),
(56, 32, 5, '2017-03-14', '2017-03-18', 'pinjam', 3);
-- ----------------------------------------------
-- Table structure for table `tbuser`
--
CREATE TABLE IF NOT EXISTS `tbuser` (
ìduser` int(11) NOT NULL AUTO_INCREMENT,
`namauser` varchar(200) NOT NULL,
ùsername` varchar(50) NOT NULL,
`password` varchar(200) NOT NULL,
èmail` varchar(100) NOT NULL,
`foto` varchar(50) NOT NULL,
`level` enum('admin','user') NOT NULL,
PRIMARY KEY (ìduser`)
AUTO_INCREMENT=5 ;
19
--
-- Dumping data for table `tbuser`
--
INSERT INTO `tbuser` (ìduser`, `namauser`, ùsername`,

`password`, èmail`, `foto`, `level`) VALUES
(3, 'Bima', 'admin', '21232f297a57a5a743894a0e4a801fc3',
'jelek@gmail.com', 'jelek', 'admin'),
(4, 'santi', 'user', 'ee11cbb19052e40b07aac0ca060c23ee',
'user@gmail.com', '', 'user');
/*!40101 SET
CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT
*/;
/*!40101 SET
CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULT
S */;
/*!40101 SET
COLLATION_CONNECTION=@OLD_COLLATION_CONNECTIO
N */;
4) Buatlah folder baru di dalam XAMPP → htdocs dengan nama

folder perpus.
Gambar 3.4 Membuat folder baru di htdocs

20
5) Di dalam folder perpus buatlah folder assets untuk meletakan

komponen pembantu seperti css dan gambar atau yang lainya.
Kemudian di dalam folder assets tersebut buatlah 4 folder yaitu
css, font-awesome, js, dan gambar.
Gambar 3.5 Membuat folder assets

21
6) Download font-awesome, klik download lalu pilih No thank’s

just download font-awesome, kemudian letakan file di dalam
folder perpus → assets → font-awesome.
Gambar 3.6 Donwload font-awesome
7) Masukan gambar seperlunya kedalam folder assets → gambar.
Gambar 3.7 Membuat Folder Baru dihtdocs

22
8) Di dalalm folder js letakan folder jquery yang akan digunakan

untuk fungsi datepicker.
Gambar 3.8 Peletakan Jquery
9) Buka Sublime Text kemudia klik file lalu pilih Open Foder,
pilihlah folder perpus kemudian klik Select Folder .
Gambar 3.9 Membuka folder pada Sublime Text

23
10) Buatlah koneksi.php pada Sublime Text dengan scirpt seperti

dibawah ini, kemudian simpan pada folder perpus.
<?php
mysql_connect('localhost','root','');
mysql_select_db('dbperpus');
?>
Gambar 3.10 Simpan file koneksi.php
11) Kemudian buat layout login yang diberi nama index.php

dengan script dibawah ini.
<!DOCTYPE html>
<html>
<head>
<title></title>
<link href="assets/css/style.css" type="text/css"
rel="stylesheet">
<link href="assets/font-awesome-4.7.0/css/font-
awesome.min.css" rel="stylesheet" type="text/css">
</head>
24
<body class="bodylogin">
<div style="width: 100%; height: auto; padding-top:
100px;">
<div class="login">
<div style=" text-align: right;height: 80px;">
<i class="fa fa-lock fa-2x" style="float: right; margin:0px
10px;"></i><p>Login Perpus</p>
</div>
<form action="proseslogin.php" method="POST">
<input align="center" type="text" name="user"
placeholder="Username" required>
<input type="Password" name="pass"
placeholder="Password" required>
<input type="submit" name="login" value="Login">
</form>
</div>
</div>
</body>
</html>
12) Setelah membuat layout login, buatlah proses login dengan

script sepeti di bawah ini.
<?php
session_start();
include "koneksi.php";
$username=$_POST['user'];
$password=$_POST['pass'];
if(!isset($username)){
echo "Tidak ada Username";
}
if(!isset($password)){
echo "Tidak ada Passowrd";
}
25
$user=str_replace("'","", $username);
$password_md5=md5($password);
$query="select * from tbuser where username = '". $user ."'
and password = '". $password_md5 ."' limit 1 ";
$query_user=mysql_query($query);
$datauser=mysql_fetch_assoc($query_user);
if(!empty($datauser['username'])){
$_SESSION['id'] = $datauser['iduser'];
$_SESSION['level'] = $datauser['level'];
header("location:admin/index.php");
}
else {
unset($_SESSION['id']);
unset($_SESSION['level']);
echo "Username atau Password salah";
}
?>
13) Setelah itu buat proser logout login tersebut, dengan script di
bawah ini
<?php
session_start();
include "koneksi.php";
unset($_SESSION['id']);
unset($_SESSION['level']);
session_destroy();
header("location:index.php")
?>
26
14) Buatlah New Folder dengan klik kanan folder perpus dan pilih
New folder, lalu folder tersebut berikan nama admin lalu klik
membuat file baru dengan cara klik New File atau control+N
dan masukan script di bawah ini lalu file tersebut disave di
dalam folder admin tersebut dan diberikan nama index.php, lalu
isikan sript dibawah ini.
Gambar 3.11 Membuat folder admin
<?php
session_start();
if($_SESSION['level']=='admin'){
require ('partial/header.php');
require ('partial/content.php');
require ('partial/footer.php');
}
elseif ($_SESSION['level']=='user') {
header('location:../user');
}
else{
header('location:../index.php');
}
27
15) Buatlah 2 folder baru di dalam folder admin dengan nama

folder page dan partial.
Gambar 3.12 Membuat folder page dan partial
16) Buatlah file bernama header, content, dan footer didalam folder
partial.
Gambar 3.13 Membuat file header, content, footer

28
17) Buatlah script di bawah ini di dalam file header.
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css"
href="../assets/css/style.css">
<link rel="shortcut icon" href="assets/gambar/heart-
128.png" />
<link href="../assets/font-awesome-4.7.0/css/font-
</head>
<body>
<div class="header">
<div class="judul">
<h1 style="font-family: Betty; color: white;
">Perpustakaan</h1>
<div class="sosmed">
<i class="fa fa-facebook fa-lg"></i>
<i class="fa fa-instagram fa-lg"></i>
<i class="fa fa-twitter fa-lg"></i>
</div>
</div>
<div class="nav">
<ul>
<li><a href="?page=home"><i class="fa fa-home fa-
lg"></i> Home</a></li>
<li><a href="?page=anggota"><i class="fa fa-user fa-
lg"></i> Anggota</a></li>
<li><a href="?page=buku"><i class="fa fa-book fa-lg"></i>
Buku</a></li>
29
<li><a href="?page=transaksi"><i class="fa fa-handshake-o

fa-lg"></i> Transaksi</a></li>
<li><a href="../logout.php"><i class="fa fa-sign-out fa-
lg"></i> Logout</a></li>
</ul>
</div>
</div>
18) Buatlah script di bawah ini di dalam file content.
<?php
$page=$_GET['page'];
switch ($page) {
case 'home':
include('page/home.php');
break;
case 'anggota':
include('page/anggota.php');
break
case 'buku':
include('page/buku.php');
break;
case 'transaksi':
include ('page/transaksi.php');
break;
default:
}
30
19) Buatlah script di bawah ini dalam file footer.
<div class="footer">
<p style="font-family: arial; font-size: 16px;">Copyright
© 2017 </p>
</div>
</div>
</body>
</html>
20) Lalu buatlah file di dalam folder page dengan nama-nama yang
ada di content. Pertama buatlah file dengan nama home.
<div class="content">
<div class="title"><h2>Home</h2></div>
<div class="putih">
<div class="home">
<h2>Selamat Datang Di Website Perpustakaan</h2>
<p>Perpustakaan biasanya identik dengan dunia pendidikan,
karena pada umumnya memang terdapat di lembaga-lembaga
pendidikan. Masyarakat awam menilai perpustakaan hanya
sebagai tempat dimana terdapat rak, dengan buku-buku yang
berjajar, seolah-olah di samakan dengan toko buku, karena
memang demikian lah fungsi dari perpustakaan menurut
kebanyakan orang.</p>
</div>
<div class="jarakbutton">
<a href="?page=home"><button
class="menubutton">Home</button></a>
<a href="?page=anggota"><button
class="menubutton">Anggota</button></a>
<a href="?page=buku"><button
class="menubutton">Buku</button></a>
<a href="?page=transaksi"><button
class="menubutton">Transaksi</button></a>
31
<a href="../logout.php"><button class="menubutton">Log

Out</button></a>
</div>
</div>
21) Lalu buatlah file bernama anggota.php dan isikan script di

bawah berikut.
<div class="title">
<h2>Data Anggota</h2>
</div>
<div class="putih">
<div class="sbar">
<form action="" method="post">
<input type="submit" name="cari" value="search">
<input type="text" name="input" placeholder="cari...">
</form>
<a href="formtambahanggota.php"><input type="button"
name="tambah" value="Tambah Anggota"></a>
</div>
<table align="center" class="tabel">
<tr>
<th>Nim</th>
<th>Nama</th>
<th>Jenis Kelamin</th>
<th>Tahun Masuk</th>
<th>Prodi</th>
<th colspan="3">Action</th>
</tr>
<?php
include "../koneksi.php";
$input=@$_POST['input'];
$submit=@$_POST['cari'];
if($submit){
if($input!='')
$query=mysql_query("select * from tbanggota where
nama like '%$input%'");
else{$query=mysql_query("select * from tbanggota order
by nim asc");}}
32
else{
$query=mysql_query("select * from tbanggota order by
nim asc");}
$cek = mysql_num_rows($query);
if($cek<1){
?>
<tr>
<td colspan="8" style="text-align: center">Data Tidak
Tersedia</td>
</tr>
<?php
}
else{
while ($data=mysql_fetch_array($query)){
echo'<tr>
<td>'.$data['nim'].'</td>
<td> <i class="fa fa-user fa-lg"></i>
'.$data['nama'].'</td>
<td>'.$data['jk'].'</td>
<td>'.$data['thn_masuk'].'</td>
<td>'.$data['prodi'].'</td>
<td><center><a href="hapus_anggota.php?nim='.
$data['nim'] .'"><i title="Delete" style="color:red;"
class="fa fa-times fa-lg"></center></i></a></center></td>
<td> <a href="formubahanggota.php?nim='. $data['nim']
.'"><center><i title="Edit" style="color:green;" class="fa
fa-pencil-square fa-lg"></i></a></center>
</td>
<td>
<a href="page/detailanggota.php?nim='.
$data['nim'].'"><center><i title="Detail"
style="color:blue;" class="fa fa-info-circle fa-
lg"></i></a></center>
</td>
</tr>
';
}
}
?>
33
22) Buatllah file bernama buku.php dengan script di bawah ini.
<div class="title">
<h2>Data Buku</h2>
</div>
<div class="putih">
<div class="sbar">
</form>
<a href="formtambahbuku.php"><input type="button"
name="tambah" value="Tambah Buku"></a>
</div>
<tr>
<th>Judul</th>
<th>Jumlah</th>
<th>Lokasi</th>
<th>Penerbit</th>
<th>Tahun Terbit</th>
</tr>
<?php
if($submit){
if($input!=''){
$query=mysql_query("select * from tbbuku where judul
like '%$input%'");
}
else{
$query=mysql_query("select * from tbbuku order by judul
asc");
}
}
else{
asc");
}
34
if($cek<1){
?>
<tr>
<td colspan="8" style="text-align: center">Data Tidak
Tersedia</td>
</tr>
<?php
}
else{
while ($data=mysql_fetch_array($query)) {
echo'
<tr>
<td> <i class="fa fa-book fa-lg"></i> '.
$data['judul'] .'</td>
<td>'. $data['jumlah'] .'</td>
<td>'. $data['lokasi'] .'</td>
<td>'. $data['penerbit'] .'</td>
<td>'. $data['thnterbit'] .'</td>
<td><a href="delete_buku.php?id='. $data['idbuku'] .'">
<center><i title="Delete" style="color:red;" class="fa fa-
times fa-lg"></i></center></a></td>
<td><a href="formubahbuku.php?id='. $data['idbuku'] .'">
<center><i title="Edit" style="color:green;" class="fa fa-
pencil-square fa-lg"></i></center></a></td>
<td><a href="page/detailbuku.php?id='. $data['idbuku']
.'"> <center><i style="color:blue;" class="fa fa-info-circle
fa-lg" title="Detail"></i></center></a></td>
</tr>
';
}
}
?>
</table>
</div>
35
23) Buatllah file bernama transaksi.php dengan script di bawah ini.
<div class="title">
<h2 style="width: auto; float: left; margin-right:
20px">Transaksi</h2>
<a title="Download" href="javascript:;"
onclick="window.open('./page/exportexcel.php','scrollwind
ow','top=200,left=300,width=800,height=500');"><i
class="fa fa-download fa-2x"></i></a>
</div>
<div class="putih">
<div class="sbar">
</form>
<a href="formtambahtransaksi.php"><input type="button"
name="tambah" value="Tambah"></a>
</div>
<tr>
<th>Nama Peminjam</th>
<th>Nim Piminjam</th>
<th>Judul Buku</th>
<th>Id buku</th>
<th>Tanggal Kembali</th>
<th>Status</th>
<th>Petugas</th>
<th>Hak Akses</th>
36
<th colspan="3" >Action</th>

</tr>
<?php
$submit=@$_POST['cari'] ;
if($submit){
if($input!=''){
$query=mysql_query("select * from tbtransaksi
inner join tbbuku on tbtransaksi.idbuku = tbbuku.idbuku
inner join tbanggota on tbtransaksi.nim=tbanggota.nim
inner join tbuser on tbtransaksi.iduser=tbuser.iduser where
tbanggota.nama like '%$input%' ");
}
else{
inner join tbuser on tbtransaksi.iduser=tbuser.iduser ");
}
}
else{
$sql="select * from tbtransaksi
inner join tbuser on tbtransaksi.iduser=tbuser.iduser";
$query= mysql_query($sql);
}
37
if($cek<1){
?>
<tr>
<td colspan="8">Data Tidak Tersedia</td>
</tr>
<?php
}
else{
while($data=mysql_fetch_array($query)){
echo '
<tr>
<td><i class="fa fa-user fa-lg"></i> '.
$data['nama'] .'</td>
<td>'. $data['nim'] .'</td>
td><i class="fa fa-book fa-lg"></i> '.
<td>'. $data['idbuku'] .'</td>
<td>'. $data['tglkembali'] .'</td>
<td>'. $data['status'] .'</td>
<td>'. $data['namauser'] .'</td>
<td>'. $data['username'] .'</td>
<td><a href="hapustransaksi.php?id='. $data['idtransaksi']
.'"><i title="Delete" style="color:red;" class="fa fa-times fa-
lg"></i></a></td>
<td><a href="formubahtransaksi.php?id='.
$data['idtransaksi'] .'"><i title="Edit" style="color:green;"
class="fa fa-pencil-square fa-lg"></i></a></td>
<td><a href="page/detailtransaksi.php?id='.
$data['idtransaksi'].'"><center><i title="Detail"
</td></tr>';
}}?>
</table>
</div>
38
24) Berikan setiap page tadi itu halaman detail jadi buatah file baru
dengan nama file detailanggota.php dengan sript dibawah ini.
<?php
include"../../koneksi.php";
$nim=$_GET['nim'];
$q=mysql_query("select * from tbanggota where nim
='$nim'");
while ($data=mysql_fetch_array($q)) {
?>
<!DOCTYPE html>
<html>
<head>
<title></title>
href="../../assets/css/style.css">
<link href="../../assets/font-awesome-4.7.0/css/font-
</head>
<body>
<div class="judul">
<h1 style="font-family: arial; color: white;
">WebPerpus</h1>
</div>
39
</div>
<div class="nav">
<ul>
<li><a href="../?page=home"><i class="fa fa-home fa-
<li><a href="../?page=anggota"><i class="fa fa-user fa-
<li><a href="../?page=buku"><i class="fa fa-book fa-
lg"></i> Buku</a></li>
<li><a href="../?page=transaksi"><i class="fa fa-handshake-o
fa-lg"></i> Transaksi</a></li>
<li><a href="../../logout.php"><i class="fa fa-sign-out fa-
</ul>
</div>
</div>
<div class="title">
<h2>Detail Anggota</h2>
</div>
<div class="putih">
<div class="form">
<table>
<tr style="border-bottom: 1px solid #D4D4D4;">
<td>NIM</td>
<td>:</td>
<td><?php echo $data['nim'] ; ?></td>
</tr>
<tr style="border-bottom: 1px solid #D4D4D4";>
<td>Nama</td>
40
<td>:</td>
<td><?php echo $data['nama'] ; ?></td>
</tr>
<td>Tempat Lahir</td>
<td>:</td>
<td><?php echo $data['tempat_lahir'] ; ?></td>
</tr>
<td>Tanggal Lahir</td>
<td>:</td>
<td><?php echo $data['tgl_lahir'] ; ?></td>
</tr>
<td>Jenis Kelamin</td>
<td>:</td>
<td><?php echo $data['jk'] ; ?></td>
</tr>
<td>Prodi</td>
<td>:</td>
<td><?php echo $data['prodi'] ; ?></td>
</tr>
<td>Tahun Masuk</td>
<td>:</td>
<td><?php echo $data['thn_masuk'] ; ?></td>
</tr>
41
</table>
</div>
</div>
© 2017 </p>
</div>
</div>
<?php
}
?>
25) Buatlah file detailbuku.php dengan srcipt di bawah ini.
<?php
include "../../koneksi.php";
$id=$_GET['id'];
$q="select * from tbbuku where idbuku='$id'";
$u=mysql_query($q);
while ($data=mysql_fetch_array($u)) {
?>
<!DOCTYPE html>
<html>
<head>
<title></title>

42
<h2>Detail Buku</h2>
</div>
<div class="putih">
<div class="form">
<table>
<td>Id</td>
<td>:</td>
<td><?php echo $data['idbuku'] ; ?></td>
</tr>
<td>Judul</td>
<td>:</td>
<td><?php echo $data['judul'] ; ?></td>
</tr>
<td>Pengarang</td>
<td>:</td>
<td><?php echo $data['pengarang'] ; ?></td>
</tr>
<td>Penerbit</td>
<td>:</td>
<td><?php echo $data['penerbit'] ; ?></td>
</tr>
<td>Tahun Terbit</td>
<td>:</td>
<td><?php echo $data['thnterbit'] ; ?></td>
43
</tr>
<td>Jumlah Buku</td>
<td>:</td>
<td><?php echo $data['jumlah'] ; ?></td>
</tr>
<td>Lokasi</td>
<td>:</td>
<td><?php echo $data['lokasi'] ; ?></td>
</tr>
<td>Tanggal Input</td>
<td>:</td>
<td><?php echo $data['tglinput'] ; ?></td>
</tr>
</table>
</div>
</div>
© 2017 </p>
</div>
</div>
</body>
</html>
<?php
}
?>
44
26) Buatlah sricpt detailtransaksi.php dengan script di bawah ini.
<!DOCTYPE html>
<head><meta charset="utf-8">
<title>Let's Go Green | About</title>
<link href="css/bootstrap.css" rel="stylesheet">
</head><body background="img/bg.jpg">

<div class="row"><div class="col-md-12">
<?php
$id=$_GET['id'];
$q="select tbbuku.idbuku, tbbuku.judul, tbanggota.nama,
tbanggota.nim, tbtransaksi.tglpinjam,
tbtransaksi.tglkembali, tbtransaksi.status,
tbtransaksi.idtransaksi from (tbtransaksi inner join tbbuku
on tbtransaksi.idbuku=tbbuku.idbuku) inner join
tbanggota on tbtransaksi.nim=tbanggota.nim where
tbtransaksi.idtransaksi='$id'";
$u=mysql_query($q);
while ($data=mysql_fetch_array($u)) {?>
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
45
<body>
<div class="judul">
">WebPerpus</h1>
</div>
</div>
<div class="nav">
<ul>
<li><a href="../?page=transaksi"><i class="fa fa-
handshake-o fa-lg"></i> Transaksi</a></li>
</ul>
</div>
</div>
<div class="title">
<h2>Detail Transaksi</h2>
46
</div>
<div class="putih">
<div class="form">
<table>
<td>Id Buku</td>
<td>:</td>
</tr>
<td>Judul</td>
<td>:</td>
</tr>
<td>Nama</td>
<td>:</td>
</tr>
<td>Nim</td>
<td>:</td>
</tr>
<td>Tanggal Pinjam</td>
<td>:</td>
<td><?php echo $data['tglpinjam'] ; ?></td>
</tr>
47

<td>Tanggal Kembali</td>
<td>:</td>
<td><?php echo $data['tglkembali'] ; ?></td>
</tr>
<td>Status</td>
<td>:</td>
<td><?php echo $data['status'] ; ?></td>
</tr>
</table>
</div>
</div>
© 2017 </p>
</div>
</div>
</body>
</html>
<?php
}
?>
48
27) Buatlah file bernama exportexcel.php file ini berfungsi agar

data dari perpus tersebut bisa didownload dan berekstensi
Micorsoft Excel dengan script di bawah ini.
<?php
include"fungsi.php";
$query=mysql_query("select tbbuku.idbuku, tbbuku.judul,
tbanggota.nama, tbanggota.nim, tbtransaksi.tglpinjam,
tbtransaksi.tglkembali, tbtransaksi.status, tbtransaksi.idtransaksi
from (tbtransaksi inner join tbbuku on
tbtransaksi.idbuku=tbbuku.idbuku) inner join tbanggota on
tbtransaksi.nim=tbanggota.nim");
while ($laporan=mysql_fetch_array($query)) {
$data['idtransaksi'][]=$laporan['idtransaksi'];
$data['idbuku'][]=$laporan['idbuku'];
$data['judul'][]=$laporan['judul'];
$data['nim'][]=$laporan['nim'];
$data['nama'][]=$laporan['nama'];
$data['tglpinjam'][]=$laporan['tglpinjam'];
$data['tglkembali'][]=$laporan['tglkembali'];
$data['status'][]=$laporan['status'];
}
$jm=sizeof($data['idtransaksi']);
header("Pragma: public");
header("Expires:0");
header("Cache-Control: must-revalidate, post-check=0, pre-
check=0");
header("Content-Type: application/force-download");
header("Content-Type: application/octet-stream");
header("Content-Type: application/download");
header("Content-Disposition:
49
attachment;filename=laporan_transaksi.xls");
header("Content-Transfer-Encoding:binary");
xlsBOF();
xlsWriteLabel(0,4,"Laporan Trasaksi");
xlsWriteLabel(2,0,"ID Transaksi");
xlsWriteLabel(2,1,"ID Buku");
xlsWriteLabel(2,2,"Judul");
xlsWriteLabel(2,3,"NIM");
xlsWriteLabel(2,4,"Nama");
xlsWriteLabel(2,5,"Tanggal Pinjam");
xlsWriteLabel(2,6,"Tanggal Kembali");
xlsWriteLabel(2,7,"Status");
$xlsRow=3;
for($y=0; $y<$jm; $y++){
xlsWriteLabel($xlsRow,0,$data['idtransaksi'][$y]);
xlsWriteLabel($xlsRow,1,$data['idbuku'][$y]);
xlsWriteLabel($xlsRow,2,$data['judul'][$y]);
xlsWriteLabel($xlsRow,3,$data['nim'][$y]);
xlsWriteLabel($xlsRow,4,$data['nama'][$y]);
xlsWriteLabel($xlsRow,5,$data['tglpinjam'][$y]);
xlsWriteLabel($xlsRow,6,$data['tglkembali'][$y]);
xlsWriteLabel($xlsRow,7,$data['status'][$y]);
$xlsRow++;
}
xlsEOF();
exit();
50
28) Setelah membuat file exportexcel lalu buat file bernama

fungsi.php dengan script di bawah ini.
<?php
function xlsBOF(){
echo pack("ssssss", 0x809, 0x8, 0x0, 0x10, 0x0, 0x0);
return;
}
function xlsEOF(){
echo pack("ss", 0x0A, 0x00);
return;
}
function xlsWriteNumber($Row, $Col, $Value) {

echo pack("sssss", 0x203, 14, $Row, $Col, 0x0);
echo pack("d", $Value);
return;
}
function xlsWriteLabel($Row, $Col, $Value ) {

$L = strlen($Value);
echo pack("ssssss", 0x204, 8 + $L, $Row, $Col, 0x0, $L);
echo $Value;
return;
}
?>
51
29) Lalu buatlah proses-proses yang terdiri dari delete, edit

,add. Yang pertama buatlah file hapus_anggota.php dengan
script di bawah ini, dengan file disave didalam folder
htdocs → perpus → admin.
<?php
$nim=$_GET["nim"];
$sql=mysql_query("delete from tbanggota where
nim='$nim'");
echo "<script>alert('Data Terhapus');
location.href='../admin/?page=anggota'</script>";
?
30) Buatlah file dengan nama delete_buku.php dengan script di

bawah ini,
<?php
$id=$_GET["id"];
mysql_query("delete from tbbuku where idbuku='$id'");
echo "
<script>alert('Data Terhapus');
location.href='../admin/?page=buku'</script>
";
?>
31) Buatlah file bernama hapustransaksi.php dengan script di

bawah ini.
52
<?php
$id=$_GET['id'];
mysql_query("delete from tbtransaksi where
idtransaksi='$id'");
header('location:../admin/?page=transaksi');
?
32) Buatlah file bernama formubahanggota.php dengan scirpt

dibawah ini, disave dalam folder htdocs → perpus → admin.
<?php
$nim=$_GET['nim'];
$update=mysql_query("select * from tbanggota where
nim='$nim'");
while($tampil=mysql_fetch_array($update)){
?>
<!DOCTYPE html>
<html>
<head>
<title></title>
<link href="../assets/font-awesome-
4.7.0/css/font-awesome.min.css" rel="stylesheet"
type="text/css">
53
<link rel="stylesheet" type="text/css" href="../assets/">

</head>
<body>
<div class="judul">
">WebPerpus</h1>
</div>
</div>
<div class="nav">
<ul>
<li><a href="../admin/?page=home"><i class="fa fa-home
fa-lg"></i> Home</a></li>
<li><a href="../admin/?page=anggota"><i class="fa fa-user
fa-lg"></i> Anggota</a></li>
<li><a href="../admin/?page=buku"><i class="fa fa-book
fa-lg"></i> Buku</a></li>
<li><a href="../admin/?page=transaksi"><i class="fa fa-
</ul>
</div>
</div>
54
<div class="title">
<h2>Edit Data Anggota</h2>
</div>
<div class="putih">
<div class="form">
<form action="ubahanggota.php" method="post">
<table border="0">
<tr>
<td>
<input type="hidden" name="nim" value="<?php echo
$tampil['nim']; ?>">
</td>
</tr>
<tr>
<td>Nama</td>
<td><input type="text" name="nama" value="<?php echo
$tampil['nama']; ?>">
</td>
</tr>
<tr>
<td>
Tempat Lahir
</td>
<td>
<input type="text" name="tempat_lahir" value="<?php
echo $tampil['tempat_lahir']; ?>">
</td>
</tr>
55
<tr>
<td>
<input type="text" name="tgl_lahir" value="<?php echo
$tampil['tgl_lahir']; ?>">
</td>
</tr>
<tr>
<td>
<input type="radio" name="jk" value="L"<?php
if($tampil['jk']=='L'){echo'checked';} ?>>L
<input type="radio" name="jk" value="P"<?php
if($tampil['jk']=='P'){echo'checked';} ?>>P
</td>
</tr>
<tr>
<td>Prodi</td>
<td>
<input type="text" name="prodi" value="<?php echo
$tampil['prodi']; ?>">
</td>
</tr>
<tr>
<td><input type="text" name="thn_masuk" value="<?php
echo $tampil['thn_masuk']; ?>">
</td>
</tr>
56
<tr>
<td colspan="2" align="right">
<input type="submit" name="submit" value="Simpan">
<input type="reset" name="reset" value="Batal">
</td>
</tr>
</table>
</form>
</div>
</div>
© 2017 </p>
</div>
</div>
</body>
</html>
<?php } ?>
33) Buatlah file dengan nama ubahanggota.php dengan script di

bawah ini, file ini berfungsi sebagai proses untuk edit.
<?php
$nim=$_POST['nim'];
$nama=$_POST['nama'];
$tempat_lahir=$_POST['tempat_lahir'];
$tgl_lahir=$_POST['tgl_lahir'];
$jk=$_POST['jk'];
57
$prodi=$_POST['prodi'];
$thn_masuk=$_POST['thn_masuk'];
$update=mysql_query("update tbanggota set
nama='$nama', tempat_lahir='$tempat_lahir',
tgl_lahir='$tgl_lahir', jk='$jk', prodi='$prodi',
thn_masuk='$thn_masuk' where nim='$nim' ");
echo "<script>alert('data terubah');
location.href='../admin/?page=anggota'</script>";
?>
34) Buatlah file bernama formubahbuku.php dengan script di

bawah ini
<?php
$id=$_GET['id'];
$update=mysql_query("select * from tbbuku where
idbuku='$id'");
?>
<html>
<html>
<head>
<title></title>
</head>
58
<body>
<div class="judul">

">WebPerpus</h1>
</div>
</div>
<div class="nav">
<ul>


<li><a href="../admin/?page=buku"><i class="fa fa-book fa-



</ul>
</div>
</div>
59
<div class="title">
<h2>Edit Data Buku</h2>
</div>
<div class="putih">
<div class="form">
<form action="ubahbuku.php" method="post">
<table>
<input type="hidden" name="id" value="<?php echo
$tampil['idbuku']; ?>">
<tr>
<td>Judul</td>
<td>
<input type="text" name="judul" value="<?php echo
$tampil['judul']; ?>">
</td>
</tr>
<tr>
<td>Pengarang</td>
<td><input type="text" name="pengarang" value="<?php
echo $tampil['pengarang']; ?>"></td>
</tr>
<tr>
<td>Penerbit</td>
<td>
<input type="text" name="penerbit" value="<?php echo
$tampil['penerbit']; ?>">
</td>
</tr>
60
<tr>
<td>
<input type="text" name="thnterbit" value="<?php echo
$tampil['thnterbit']; ?>">
</td>
</tr>
<tr>
<td>Jumlah</td>
<td><input type="text" name="jumlah" value="<?php echo
$tampil['jumlah']; ?>"></td>
</tr>
<tr>
<td>Lokasi</td>
<td><input type="radio" name="lokasi" value="rak1"<?php
if($tampil['lokasi']=='rak1'){echo 'checked';} ?>>Rak1
<input type="radio" name="lokasi" value="rak2"<?php
if($tampil['lokasi']=='rak2'){echo 'checked';} ?>>Rak2<input
type="radio" name="lokasi" value="rak3"<?php
</td>
</tr>
<tr>
<td>
<input type="text" name="tglinput" value="<?php echo
$tampil['tglinput']; ?>">
</td>
</tr>
61
<tr>
<input type="submit" name="" value="Simpan">
<input type="reset" name="" value="Batal">
</td>
</tr>
</table>
</form>
</div>
</div>
© 2017 </p>
</div>
</div>
</body>
</html>
<?php } ?>
35) Bualah proses dari formubahbuku diatas dengan membuat file

bernama ubahbuku.php dengan script dibawah ini.
<?php
$id=$_POST['id'];
$judul=$_POST['judul'];
$pengarang=$_POST['pengarang'];
$penerbit=$_POST['penerbit'];
62
$thnterbit=$_POST['thnterbit'];
$jumlah=$_POST['jumlah'];
$lokasi=$_POST['lokasi'];
$tglinput=$_POST['tglinput'];
$update=mysql_query("update tbbuku set judul='$judul',

pengarang='$pengarang', penerbit='$penerbit',
thnterbit='$thnterbit', jumlah='$jumlah', lokasi='$lokasi',
tglinput='$tglinput' where idbuku='$id'");
echo "<script>alert('data terubah');

location.href='../admin/?page=buku'</script>";
?>
36) Buatlah file bernama formubahtransaksi.php, dengan script

dibawah ini
<?php
session_start();
$id=$_GET['id'];
$update=mysql_query("select * from tbtransaksi where

63
?>
<html>
<head>
<title></title>
<script
src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.
js"></script>
<link rel="stylesheet" href="../assets/js/jquery-ui-
1.12.1.custom/jquery-ui.css" type="text/css"/>
1.12.1.custom/jquery-ui.min.css" type="text/css"/>
1.12.1.custom/jquery-ui.structure.css" type="text/css"/>
1.12.1.custom/jquery-ui.structure.min.css"
type="text/css"/>
1.12.1.custom/jquery-ui.theme.css" type="text/css"/>
1.12.1.custom/jquery-ui.theme.min.css" type="text/css"/>
<script src="../assets/js/jquery-ui-1.12.1.custom/jquery-
ui.js" type="text/javascript"></script>
ui.min.js" type="text/javascript"></script>
64
</head>
<body>
<script type="text/javascript">
$(function() {
$( "#tglpinjam" ).datepicker({
dateFormat:'yy-mm-dd',
});
});
function hitung(){
Date.prototype.addDays = function(days){
var dat = new Date(this.valueOf());
dat.setDate(dat.getDate() + days);
return dat;
}
var dat = new Date();
var jarak =$('#jarak').val();
$('#tglkembali').val(dat.addDays(jarak));
}
function getdate() {
var tt = $('#tglkembali').val();
var date = new Date(tt);
var newdate = new Date(date);
newdate.setDate(newdate.getDate() + (jarak*1));
var dd = newdate.getDate();
var mm = newdate.getMonth() + 1;
var y = newdate.getFullYear();
var someFormattedDate = y + '-' + mm + '-' + dd;
$('#tglkembali').val(someFormattedDate);
65
}
</script>
<div class="judul">
">WebPerpus</h1>
</div>
</div>
<div class="nav">
<ul>
</ul>
</div>
</div>
<div class="title">
66
<h2>Edit Data Transaksi</h2>
</div>
<div class="putih">
<div class="form">
<form action="ubahtransaksi.php" method="post"

name="tambah" onSubmit="return getDate()">
<table>

$tampil['idtransaksi']; ?>">
<input type="hidden" name="iduser" value="<?php echo

$_SESSION['id']; ?>">
<tr>
<td>Nim Peminjam</td>
<td>
<input type="text" name="nim" value="<?php echo

$tampil['nim']; ?>">
</td>
</tr>
<tr>
<td>Id Buku</td>
<td>
<input type="text" name="idbuku" value="<?php echo

$tampil['idbuku'];?>">
</td>
</tr>
<tr>
<td>
67
Tanggal Peminjam</td>
<td>
<input type="text" name="tglpinjam" id="tglpinjam"

placeholder="bulan/tanggal/tahun" value="<?php echo
$tampil['tglpinjam']; ?>">
</td>
</tr>
<tr>
<td>
Tanggal Kembali
</td>
<td>
<input type="text" name="tglkembali" id="tglkembali"

readonly="readonly" placeholder="bulan/tanggal/tahun"
value="<?php echo $tampil['tglkembali']; ?>">
</td>
</tr>
<tr>
<td>
Perpanjang
</td>
<td>
<input type="text" name="jarak" id="jarak"

onkeyup="getdate()">
68
</td>
</tr>
<tr>
<td>status</td>
<td>
<input type="radio" name="status" value="Pinjam"<?php
if($tampil['status']=='pinjam'){echo 'checked';} ?>>Pinjam
<input type="radio" name="status" value="Kembali"<?php
if($tampil['status']=='Kembali'){echo 'checked';}
?>>Kembali
<input type="radio" name="status"
value="perpanjang"<?php
if($tampil['status']=='perpanjang'){echo 'checked';}
?>>Perpanjang</td></tr>
<tr>
<input type="submit" name="" value="Simpan"></td>
</tr>
</table>
</form>
</div>
</div>
</div>
</body>
</html>
<?php
}
?>
69
37) Buatlah file bernama ubahtransaksi.php dengan script dibawah

ini.
<?php
$id=$_POST['id'];
$nim=$_POST['nim'];
$idbuku=$_POST['idbuku'];
$tglpinjam=$_POST['tglpinjam'];
$tglkembali=$_POST['tglkembali'];
$status=$_POST['status'];
$iduser=$_POST['iduser'];
$update="update tbtransaksi set nim='$nim',
idbuku='$idbuku', tglpinjam='$tglpinjam',
tglkembali='$tglkembali', status='$status', iduser='$iduser'
where idtransaksi='$id' ";
$sql=mysql_query($update);
die($update);
header("location:../admin/?page=transaksi");
?>
70
38) Buatlah file dengan nama formtambahanggota.php file ini

berfungsi untuk add atau tambah anggota.
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
function validasi(){
var nim = ffrom.nim.value;
var nama = ffrom.nama.value;
var tempat_lahir = ffrom.tempat_lahir.value;
var tgl_lahir = ffrom.tgl_lahir.value;
var jk = ffrom.jk.value;
var prodi = ffrom.prodi.value;
var thn_masuk = thn_masuk;
var pesan = '';
var nimvalid = /^[0-9]+$/;
if(nim == ''){
pesan += 'Nim tidak boleh kosong\n';
}
if(nim != '' && !nim.match(nimvalid)) {
pesan += 'Nim harus menggunakan angka\n';
}
71
if(nama == ''){
pesan += 'Nama tidak boleh kosong\n';
}
if(tempat_lahir == ''){
pesan += 'Tempat lahir tidak boleh kosong\n';
}
if(tgl_lahir == ''){
pesan += 'Tanggal lahir tidak boleh kosong\n';
}
if(jk == ''){
pesan += 'Jenis kelamin tidak boleh kosong\n';
}
if(prodi == ''){
pesan += 'Prodi tidak boleh kosong\n';
}
if(thn_masuk == ''){
pesan += 'Tahun masuk tidak boloh kosong\n';
}
if(pesan !=''){
alert('Maaf, ada kesalahan pengisian form : \n'+pesan);
return false;
}
return true
}
</script>
div class="header">
<div class="judul">
">WebPerpus</h1>
72
</div>
</div>
<div class="nav">
<ul>
<li><a href="../admin?page=home"><i class="fa fa-home
<li><a href="../admin?page=anggota"><i class="fa fa-user
<li><a href="../admin?page=buku"><i class="fa fa-book fa-
<li><a href="../admin?page=transaksi"><i class="fa fa-
</ul>
</div>
</div>
<div class="title"><h2>Tambah Anggota</h2>
</div>
<div class="putih">
<div class="form">
<form action="tambahanggota.php" method="post"
name="ffrom" onSubmit="return validasi()">
<table border="0">
73
<tr>
<td>Nim</td>
<td>
<input type="text" name="nim"><br>
</td>
</tr>
<tr>
<td>Nama</td>
<td>
<input type="text" name="nama"><br>
</td>
</tr>
<tr>
<td>
<input type="text" name="tempat_lahir"><br>
</td>
</tr>
<tr>
<td>
<input type="text" name="tgl_lahir"><br>
</td>
</tr>
74
<tr>
<td>
<select name="jk">
<option>--Pilih salah satu--</option>
<option value="P">Perempuan</option>
<option value="L">Laki-Laki</option>
</select>
</td>
</tr>
<tr>
<td>Prodi</td>
<td>
<input type="text" name="prodi"><br>
</td>
</tr>
<tr>
<td>
<input type="text" name="thn_masuk"><br>
</td>
</tr>
<tr>

75
<input type="submit" name="submit" value="Tambah">
</td>
</tr>
</table>
</form>
</div>
</div>
<p style="font-family: arial; font-size: 16px;">Copyright ©

2017 </p>
</div>
</div>
</body>
</html>
39) Untuk menyimpaan formtambahanggota.php buatlah file

bernama tambahanggota.php sengan script dibawah ini.
<?php
76
mysql_query("insert into tbbuku (judul, pengarang,
penerbit, thnterbit, jumlah, lokasi ) values
('$judul','$pengarang','$penerbit','$thnterbit','$jumlah','$l
okasi') ");
header('location:../admin/?page=buku');
?>
40) Buatlah file bernama formtambahbuku.php dengan script

dibawah ini.
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
script type="text/javascript">
function validasi() {
var judul = ffrombuku.judul.value;
var pengarang = ffrombuku.pengarang.value;
var penerbit =ffrombuku.penerbit.value;
var thnterbit = ffrombuku.thnterbit.value;
var jumlah = ffrombuku.jumlah.value;
var lokasi = ffrombuku.lokasi.value;
77
if(judul == '') {
alert('judul tidak boleh kosong');
return false;
}
if(pengarang == ''){
alert('pengarang tidak boleh kosong');
return false;
}
if(penerbit == ''){
alert('penerbit tidak boleh kosong');
return false;
}
if(thnterbit == ''){
alert('tahun terbit tidak boleh kosong');
return false;
}
if(jumlah == ''){
alert('jumlah tidak boleh kosong');
return false;
}
if(lokasi == ''){
alert('lokasi tidak boleh kosong');
return false;
}
return true
}
</script>
78
<div class="judul">
">WebPerpus</h1>
</div>
</div>
<div class="nav">
<ul>
</ul>
</div>
</div>
<div class="title">
<h2>Tambah Buku</h2>
79
</div>
<div class="putih">
<div class="form">
<form action="tambahbuku.php" method="post"
name="ffrombuku" onsubmit="return validasi()">
<table border="0">
<tr>
<td>Judul</td>
<td>
<input type="text" name="judul">
</td>
</tr>
<tr>
<td>Pengarang</td>
<td>
<input type="text" name="pengarang">
</td>
</tr>
<tr>
<td>
Penerbit
</td>
<td>
<input type="text" name="penerbit">
</td>
</tr>
<tr>
<td>Tahun Terbit </td>
80
<td>
<input type="text" name="thnterbit">
</td>
</tr>
<tr>
<td>Jumlah</td>
<td>
<input type="text" name="jumlah">
</td>
</tr>
<tr>
<td>Lokasi</td>
<td>
<select name="lokasi">
<option value="rak1">Rak1</option>
</select>
</td>
</tr>
<tr>
</td>
</tr>
</table>
</form>
81
/div>
</div>
© 2017 </p>
</div>
</div>
</body>
</html>
41) Untuk menyimpan formtambahbuku.php maka buatlah file

bernama ubahbuku.php dengan script dibawah ini.
<?php
mysql_query("insert into tbbuku (judul, pengarang,
penerbit, thnterbit, jumlah, lokasi ) values
('$judul','$pengarang','$penerbit','$thnterbit','$jumlah','$lo
kasi') ");
header('location:../admin/?page=buku');
?>
82
42. Buatlah file bernama formtambahtransaksi.php dengan script

dibawah ini.
<?php
session_start();
include"../koneksi.php";
$iduser=$_SESSION['id'];
?>
<!DOCTYPE html>
<html>
<head>
<title></title>
<script
src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js">
</script>
1.12.1.custom/jquery-ui.structure.min.css" type="text/css"/>
83

<script src="../assets/js/jquery-ui-1.12.1.custom/jquery-ui.js"
type="text/javascript"></script>
</head>
<body>
$(function() {
$( "#tglpinjam" ).datepicker({
dateFormat : 'yy-mm-dd',
});
});
function hitung(){
Date.prototype.addDays = function(days){
var dat = new Date(this.valueOf());
dat.setDate(dat.getDate() + days);
return dat;
var dat = new Date();
$('#tglkembali').val(dat.addDays(jarak));
}
84
function getdate() {
var tt = $('#tglpinjam').val();
var date = new Date(tt);
var newdate = new Date(date);
newdate.setDate(newdate.getDate() + (jarak*1));
var dd = newdate.getDate();
var mm = newdate.getMonth() + 1;
var y = newdate.getFullYear();
var someFormattedDate = y + '-' + mm + '-' + dd;
$('#tglkembali').val(someFormattedDate);
</script>
<div class="judul">
<h1 style="font-family: arial; color: white; ">WebPerpus</h1>
</div>
</div>
<div class="nav">
<ul>
85
<li><a href="../admin/?page=home"><i class="fa fa-home fa-

<li><a href="../admin/?page=anggota"><i class="fa fa-user fa-




</ul>
</div>
</div>
<div class="title">
<h2>Input Transaksi</h2>
</div>
<div class="putih">
<div class="form">
<form action="tambahtransaksi.php" method="post"


$iduser; ?>">
<table>
<tr>
<td>Id Buku</td>
86
<td>
<input type="text" name="idbuku">
</td>
</tr>
<tr>
<td>Nim</td>
<td>
<input type="text" name="nim">
</td>
</tr>
<tr>
<td>
<input type="text" name="tglpinjam" id="tglpinjam"

placeholder="bulan/tanggal/tahun">
</td>
</tr>
<tr>
<td>Lama Pinjam</td>
<td>
<input type="text" name="jarak" id="jarak" onchange="getdate()">
</td>
</tr>
<tr>
87
<td><input type="text" name="tglkembali" id="tglkembali"

readonly="readonly"
placeholder="bulan/tanggal/tahun"></td></tr>
<tr>
<td>Status</td>
<td><select name="status"><option>--Pilih salah satu--

</option><option value="pinjam">Pinjam</option>
<option
value="kembali">Kembali</option></select></td></tr>
<tr>
<input type="reset" name="" value="batal">
<input type="submit" name="" value="tambah">
</td>
</tr>
</table>
</form>
</div>
</div>
</body>
</html>
88
43. Buatlah file bernama tambahtransaksi.php untuk menyimpan

formtmbahtransaksi.php dengan script dibawah ini.
<?php
$nim=$_POST['nim'];
// $nama=$_POST['nama'];
// $ket=$_POST['ket'];
$iduser=$_POST['iduser'];
mysql_query("insert into tbtransaksi (idbuku, nim, tglpinjam,

tglkembali, status, iduser) values ('$idbuku', '$nim',
'$tglpinjam', '$tglkembali', '$status', '$iduser')");
header('location:../admin/?page=transaksi');
?>
89
44. Selesai di folder admin lalu buatlah folder user di folder perpus
dengan cara klik kanan pada folder perpus lalu pilih new folder.
Gambar 3.14 Membuat new folder
45. Lalu berikan nama user dan tekan Enter.
Gambar 3.15 Memberi nama pada folder user

90
46. Didalam folder perpus buatlah 2 folder baru yaitu folder partial dan
folder page sama seperti admin didalam folder partial buatlah 3 file
yaitu header, content, dan footer.
Gambar 3.16 Membuat file header, content, footer
47. Didalam file header masukan script dibawah ini
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-

scale=1">
<title></title>

</head>
<body>
<div class="container">
91
<div class="judul">
</div>
</div>
<div class="nav">
<ul>
<li><a href="?page=home"><i class="fa fa-home fa-
<li><a href="?page=anggota"><i class="fa fa-user fa-
<li><a href="?page=buku"><i class="fa fa-book fa-
<li><a href="?page=transaksi"><i class="fa fa-handshake-o fa-
lg"></i> Transaksi</a></li>
</ul>
</div>
</div>
92
48.Buatlah file dengan nama content.php dengan script dibawah ini.

<?php
$page=$_GET['page'];
switch ($page) {
case 'home':
break;
case 'anggota':
include('page/anggota.php');
break;
case 'buku':
include('page/buku.php');
break;
case 'transaksi':
include ('page/transaksi.php');
break;
default:
}
49. Buatlah file bernama footer.php dengan script dibawah ini.
© 2017 </p>
</div>
</div>
</body>
</html>
93
50. Selesai dibagian partial lalu buatlah file didalam folder page
pertama buatlah file bernama home..php dan isikan script dibawah
ini.
<div class="title">
<h2>Home</h2>
</div>
<div class="putih">
<div class="home">
<h2>Selamat Datang Di Website Perpustakaan</h2>
<p>Perpustakaan biasanya identik dengan dunia pendidikan,
karena pada umumnya memang terdapat di lembaga-lembaga
pendidikan. Masyarakat awam menilai perpustakaan hanya
sebagai tempat dimana terdapat rak, dengan buku-buku yang
berjajar, seolah-olah di samakan dengan toko buku, karena
memang demikian lah fungsi dari perpustakaan menurut
kebanyakan oran.</p>
</div>
<div class="jarakbutton">
<a href="?page=home"><button
class="menubutton">Home</button></a>
<a href="?page=anggota"><button
class="menubutton">Anggota</button></a>
<a href="?page=buku"><button
class="menubutton">Buku</button></a>
<a href="?page=transaksi"><button
class="menubutton">Transaksi</button></a>
<a href="../logout.php"><button class="menubutton">Log
94
Out</button></a>
</div>
</div>
</div>
51. Buatlah file bernama anggota.php denga script dibawah ini.
<div class="title">
<h2>Data Anggota</h2>
</div>
<div class="putih">
<div class="sbar">
</form>
<a href="formtambahanggotauser.php"><input
type="button" name="tambah" value="Tambah"></a>
</div>
<tr>
<th>Nim</th>
<th>Nama</th>
<th>Jenis Kelamin</th>
<th>Tahun Masuk</th>
<th>Prodi</th>
</tr>
95
?php
if($submit){
if($input!='')
$query=mysql_query("select * from tbanggota where nama
like '%$input%'");
else{
$query=mysql_query("select * from tbanggota order by nim
asc");
}
}
else{
$query=mysql_query("select * from tbanggota order by nim
asc");
}
if($cek<1){
?>
<tr>
</tr>
<?php
}
else{
while ($data=mysql_fetch_array($query)){
echo '
96
<tr>
<td>'.$data['nim'].'</td>
<td> <i class="fa fa-user fa-lg"></i>
'.$data['nama'].'</td>
<td>'.$data['jk'].'</td>
<td>'.$data['thn_masuk'].'</td>
<td>'.$data['prodi'].'</td>
<td><a href="page/detailanggota.php?nim='. $data['nim']
.'"><center><i title="Detail" style="color:blue;" class="fa fa-
info-circle fa-lg"></i><?center></a></td>
<td>
<a href="formubahanggotauser.php?nim='. $data['nim']
.'"><center><i title="Edit" style="color:green;" class="fa fa-
pencil-square fa-lg"></i></a></center>
</td>
</tr>
';
}
}
?>
</table>
</div>
</div>
97
52. Buatlah file bernama buku.php dengan script dibawah ini.
<div class="title">
<h2>Data Buku</h2>
</div>
<div class="putih">
<div class="sbar">
</form>
<a href="formtambahbuku.php"><input type="button"
name="tambah" value="Tambah Buku"></a>
</div>
<tr>
<th>Judul</th>
<th>Jumlah</th>
<th>Lokasi</th>
<th>Penerbit</th>
<th>Tahun Terbit</th>
</tr>
<?php
if($submit){
if($input!=''){
98
$query=mysql_query("select * from tbbuku where judul like

'%$input%'");
}
else{
asc");
}
}
else{
asc");
}
if($cek<1){
?>
<tr>
</tr>
<?php
}
else{
while ($data=mysql_fetch_array($query)) {
echo'
<tr>
<td> <i class="fa fa-book fa-lg"></i> '.
<td>'. $data['jumlah'] .'</td>
<td>'. $data['lokasi'] .'</td>
<td>'. $data['tglinput'] .'</td>
<td><a href="page/detailbuku.php?id='. $data['idbuku']
99
.'"><center><i style="color:blue;" class="fa fa-info-circle fa-

lg" title="Detail"></i></center></a></td>
<td><a href="formubahbukuuser.php?id='. $data['idbuku']
.'"> <center><i title="Edit" style="color:green;" class="fa fa-
pencil-square fa-lg"></i></center></a>
</td>
</tr>
';
}
}
?>
</table>
</div>
</div>
53. Buatlah file bernama transaksi.php dengan script dibawah ini.
<div class="title">
<h2 style="width: auto; float: left; margin-right:
20px">Transaksi</h2>
<a title="Download" href="javascript:;"
onclick="window.open('./page/exportexcel.php','scrollwindow
','top=200,left=300,width=800,height=500');"><i class="fa fa-
download fa-2x"></i></a>
</div>
<div class="putih">
100
<div class="sbar">
</form>
<a href="formtambahtransaksiuser.php"><input
type="button" name="tambah" value="Tambah"></a>
</div>
<tr>
<th>Nama Peminjam</th>
<th>Nim Piminjam</th>
<th>Judul Buku</th>
<th>Id buku</th>
<th>Tanggal Kembali</th>
<th>Status</th>
<th>Petugas</th>
<th>Hak Akses</th>
<th colspan="2" >Action</th>
</tr>
<?php
$submit=@$_POST['cari'] ;
if($submit){
if($input!=''){
101
nner join tbuser on tbtransaksi.iduser=tbuser.iduser where

tbanggota.nama like '%$input%' ");
}
else{
inner join tbuser on tbtransaksi.iduser=tbuser.iduser ");
}
}
else{
$sql="select * from tbtransaksi
inner join tbuser on tbtransaksi.iduser=tbuser.iduser";
$query= mysql_query($sql);
}
if($cek<1){
?>
<tr>
</tr>
<?php
}
else{
while($data=mysql_fetch_array($query)){
echo '
<tr>
102
<td><i class="fa fa-user fa-lg"></i> '.

$data['nama'] .'</td>
<td>'. $data['nim'] .'</td>
<td><i class="fa fa-book fa-lg"></i> '.
<td>'. $data['idbuku'] .'</td>
<td>'. $data['tglkembali'] .'</td>
<td>'. $data['status'] .'</td>
<td>'. $data['namauser'] .'</td>
<td>'. $data['username'] .'</td>
<td><a href="formubahtransaksiuser.php?id='.
$data['idtransaksi'] .'"><i title="Edit" style="color:green;"
class="fa fa-pencil-square fa-lg"></i></a></td>
<td><a href="detailtransaksiuser.php?id='.
$data['idtransaksi'].'"><center><i title="Detail"
</td>
</tr>';
}
}
?>
</table>
</div>
103
54. Buatlah file dengan nama detailanggota.php dengan script dibawah

ini file ini berfungsi untuk melihat detail atau keseluruhan data dari
anggota.
<?php
$nim=$_GET['nim'];
$q=mysql_query("select * from tbanggota where nim
='$nim'");
while ($data=mysql_fetch_array($q)) {
?>
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<div class="judul">
</div>
104
</div>
<div class="nav">
<ul>
</ul>
</div>
</div>
<div class="title">
<h2>Detail Angota</h2>
</div>
<div class="putih">
<div class="form">
<table>
<tr>
<td>NIM</td><td>:</td>
</tr>
<tr>
<td>Nama</td><td>:</td>
</tr>
105
<tr>
<td>:</td>
<td><?php echo $data['tempat_lahir'] ; ?></td>
</tr>
<tr>
<td>:</td>
<td><?php echo $data['tgl_lahir'] ; ?></td>
</tr>
<tr>
<td>:</td>
<td><?php echo $data['jk'] ; ?></td>
</tr>
<tr>
<td>Prodi</td>
<td>:</td>
<td><?php echo $data['prodi'] ; ?></td>
</tr>
<tr>
<td>:</td>
<td><?php echo $data['thn_masuk'] ; ?></td>
</tr>
106
</table>
</div>
</div>
</div>
<?php
}
?>
55. Buatlah file bernama detailbuku.php dengan script dibawah ini.
<?php
$id=$_GET['id'];
$q="select * from tbbuku where idbuku='$id'";
$u=mysql_query($q);
?>
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
107
<div class="judul">
">WebPerpus</h1>
</div>
</div>
<div class="nav">
<ul>
/ul>
</div>
</div>
<div class="title">
<h2>Detail Buku</h2>
</div>
<div class="putih">
<div class="form">
108
<table>
<tr>
<td>Id</td><td>:</td>
</tr>
<tr>
<td>Judul</td><td>:</td>
</tr>
<tr>
<td>Pengarang</td><td>:</td>
<td><?php echo $data['pengarang'] ; ?></td>
</tr>
<tr>
<td>Penerbit</td><td>:</td>
<td><?php echo $data['penerbit'] ; ?></td>
</tr>
<tr>
<td>Tahun Terbit</td><td>:</td>
<td><?php echo $data['thnterbit'] ; ?></td>
</tr>
<tr>
<td>Jumlah Buku</td><td>:</td>
<td><?php echo $data['jumlah'] ; ?></td>
</tr>
<tr>
<td>Lokasi</td>
<td>:</td>
<td><?php echo $data['lokasi'] ; ?></td>
</tr>
<tr>
<td>:</td>
109
</tr>
<tr>
<td>:</td>
<td><?php echo $data['tglinput'] ; ?></td>
</tr>
</table>
</div>
</div>
</div>
<?php
}
?>
56. Buatlah file bernama detailtransaksiuser.php dengan script dibawah ini.
<?php
$id=$_GET['id'];
$q="select tbbuku.idbuku, tbbuku.judul, tbanggota.nama,
tbanggota.nim, tbtransaksi.tglpinjam, tbtransaksi.tglkembali,
tbtransaksi.status, tbtransaksi.idtransaksi from (tbtransaksi
inner join tbbuku on tbtransaksi.idbuku=tbbuku.idbuku) inner
join tbanggota on tbtransaksi.nim=tbanggota.nim where
tbtransaksi.idtransaksi='$id'";
$u=mysql_query($q);
?>
<!DOCTYPE html>
110
<html>
<head>
<title></title>
</head>
<body>
<div class="judul">
">WebPerpus</h1>
</div>
</div>
div class="nav">
<ul>
<li><a href="../user/?page=home"><i class="fa fa-home fa-
<li><a href="../user/?page=anggota"><i class="fa fa-user fa-
<li><a href="../user/?page=buku"><i class="fa fa-book fa-
<li><a href="../user/?page=transaksi"><i class="fa fa-
111

</ul>
</div>
</div>
<div class="title">
<h2>Detail Transaksi</h2>
</div>
<div class="putih">
<div class="form">
<table>
<td>Id Buku</td>
<td>:</td>
</tr>
<td>Judul</td>
<td>:</td>
</tr>
<td>Nama</td>
<td>:</td>
</tr>
<td>Nim</td>
112
<td>:</td>
</tr>
<td>Tanggal Pinjam</td><td>:</td>
<td><?php echo $data['tglpinjam'] ; ?></td>
</tr>
<td>Tanggal Kembali</td><td>:</td>
<td><?php echo $data['tglkembali'] ; ?></td>
</tr>
<td>Status</td><td>:</td>
<td><?php echo $data['status'] ; ?></td>
</tr>
</table>
</div>
</div>
© 2017 </p>
</div>
</div>
</body>
</html>
<?php
}
?>
113
57. Untuk prosesnya buatlah file didalam folder user dengan cara klik
kanan folder user dan pilih New File lalu simpan dengan nama
formtambahanggotauser.php lalu isikan script dibawah ini.
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<div class="judul">
<h1 style="font-family : arial; color:
white;">WebPerpus</h1>
</div>
</div>
<div class="nav">
<ul>
<li><a href="../user?page=home"><i class="fa fa-home fa-
<li><a href="../user?page=anggtoa"><i class="fa fa-user fa-
<li><a
href="../user?page=buku"><i class="fa fa-book fa-
<li><a
href="../user?page=transaksi"><i class="fa fa-handshake-o
114
<div class="title">
<h2>Tambah Anggota</h2>
</div>
<div class="putih">
<div class="form">
<form name="ffrom" method="post"
action="tambahanggota.php" onsubmit="return validasi()">
<table>
<tr>
<td>Nim</td>
<td><input type="text" name="nim"></td>
</tr>
<tr>
<td>Nama</td>
<td><input type="text" name="nama"></td>
</tr>
<tr>
<td><input type="text" name="tempat_lahir"></td>
</tr>
<tr>
<td><input type="text" name="tgl_lahir"></td>
</tr>
<tr>
<td><select name="jk"><option>--Pilih Salah
satu</option><option value="P">Perempuan</option>
115
<option value="L">Laki-Laki</option></select></td></tr>
<tr>
<td>Prodi</td>
<td><input type="text" name="prodi"></td>
</tr>
<tr>
<td><input type="text" name="thn_masuk"></td>
</tr>
<tr>
<input type="submit" name="" value="Tambah">
</td>
</tr>
</table>
</form>
</div>
</div>
© 2017</p>
</div>
</div>
</body>
</html>
116
58. Buatlah file bernama formtambahbukuuser.php dengan script

dibawah ini.
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<div class="judul">
">WebPerpus</h1>
</div>
</div>
<div class="nav">
<ul>
117

</ul>
</div>
</div>
<div class="title">
<h2>Tambah Buku</h2>
</div>
<div class="putih">
<div class="form">
<form action="tambahbuku.php" method="post"
name="ffrombuku" onsubmit="return validasi()">
<table border="0">
<tr>
<td>Judul</td>
<td><input type="text" name="judul"></td>
</tr>
<tr>
<td>Pengarang</td>
<td>
<input type="text" name="pengarang">
</td>
</tr>
118
<tr>
<td>Penerbit</td>
<td><input type="text" name="penerbit"></td>
</tr>
<tr>
<td><input type="text" name="thnterbit"></td>
</tr>
<tr>
<td>Jumlah</td>
<td><input type="text" name="jumlah"></td>
</tr>
<tr>
<td>Lokasi</td>
<td><select name="lokasi"><option>--Pilih salah satu--
</option><option value="rak1">Rak1</option><option
value="rak2">Rak2</option><option
value="rak3">Rak3</option> </select>
</td>
</tr>
<tr>
</td>
</tr>
</table>
</form>
119
</div>
</div>
© 2017 </p>
</div>
</div>
</body>
</html>
59. Buatlah file dengan nama formtambahtransaksiuser.php dengan

script dibawah ini
<?php
session_start();
include"../koneksi.php";
$iduser=$_SESSION['id'];
?>
<!DOCTYPE html>
<html>
<head>
<title></title>
<script
src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js"
></script>
120

</head>
<body>
<div class="judul">
">WebPerpus</h1>
</div>
</div>
<div class="nav">
121
<ul>
</ul>
</div>
</div>
<div class="title">
<h2>Input Transaksi</h2>
</div>
<div class="putih">
<div class="form">
<form action="tambahtransaksiuser.php" method="post"
<table>
$iduser; ?>">
<tr>
<td>Id Buku</td>
<td><input type="text" name="idbuku"></td>
</tr>
122
<tr>
<td>Nim</td>
<td><input type="text" name="nim"></td>
</tr>
<tr>
<td><input type="text" name="tglpinjam" id="tglpinjam"
placeholder="bulan/tanggal/tahun"></td>
</tr>
<tr>
<td>Lama Pinjam</td>
<td><input type="text" name="jarak" id="jarak"
onkeyup="getdate()"></td>
</tr>
<tr>
<td>
<input type="text" name="tglkembali" id="tglkembali"
readonly="readonly"
placeholder="bulan/tanggal/tahun"></td>
</tr>
<tr>
<td>Status</td>
<td>
<select name="status">
<option value="pinjam">Pinjam</option>
<option value="kembali">Kembali</option>
</select>
123
</td>
</tr>
<tr>
<input type="reset" name="" value="batal">
<input type="submit" name="" value="tambah">
</td>
</tr>
</table>
</form>
</div>
</div>
</div>
</body>
</html>
60. Untuk proses formtambahanggota.php maka buatlah file bernama

tambahanggota.php dengan script dibawah ini.
<?php
include "../koneksi.php";$nim=$_POST['nim'];
$nama=$_POST['nama'];$tempat_lahir=$_POST['tempat_lahi
r'];$tgl_lahir=$_POST['tgl_lahir'];$jk=$_POST['jk'];$prodi=$_P
OST['prodi'];$thn_masuk=$_POST['thn_masuk'];$query="inse
rt into tbanggota (nim, nama, tempat_lahir, tgl_lahir, jk,
prodi, thn_masuk) values ('$nim', '$nama', '$tempat_lahir',
'$tgl_lahir', '$jk', '$prodi', '$thn_masuk')";
$sql=mysql_query($query);header('location:../user/?page=an
ggota');?>
124
61. Buatlah file bernama tambahbuku.php dengan script dibawah ini.
<?php
$query=mysql_query("insert into tbbuku (judul, pengarang,
penerbit, thnterbit, jumlah, lokasi) values ('$judul',
'$pengarang', '$penerbit', '$thnterbit', '$jumlah', '$lokasi')");
header('location:../user/?page=buku');
?>}
}
62. Buatlah file bernama tambahtransaksiuser.php dengan script

dibawah ini.
<?php
$nim=$_POST['nim'];$tglpinjam=$_POST['tglpinjam'];$tglkem
bali=$_POST['tglkembali'];$status=$_POST['status'];$iduser=
$_POST['iduser'];$query="insert into tbtransaksi (idbuku,
nim, tglpinjam, tglkembali, status, iduser) values ('$idbuku',
'$nim', '$tglpinjam', '$tglkembali', '$status', '$iduser')";
$sql=mysql_query($query);er('location:../user/?page=transak
si');?>
125
63. Untuk mengubah data user buatlah file bernma

fomrubahanggotauser.php dengan script dibawa ini.
<?php
$nim=$_GET['nim'];
$update=mysql_query("select * from tbanggota where
nim='$nim'");
?>
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="../assets/">
</head>
<body>
<div class="judul">
">WebPerpus</h1>
</div>
126
</div>
<div class="nav">
<ul>
</ul>
</div>
</div>
<div class="title">
<h2>Edit Data Anggota</h2>
</div>
<div class="putih">
<div class="form">
<form action="ubahanggota.php" method="post">
<table border="0">
<tr>
<td> <input type="hidden" name="nim" value="<?php
echo $tampil['nim']; ?>"></td>
</tr>
127
<tr>
<td> Nama</td>
<td><input type="text" name="nama" value="<?php echo
$tampil['nama']; ?>"></td>
</tr>
<tr>
<td><input type="text" name="tempat_lahir" value="<?php
echo $tampil['tempat_lahir']; ?>"></td>
</tr>
<tr>
<td><input type="text" name="tgl_lahir" value="<?php echo
$tampil['tgl_lahir']; ?>"></td>
</tr>
<tr>
<td><input type="radio" name="jk" value="L"<?php
if($tampil['jk']=='L'){echo'checked';} ?>>L<input type="radio"
name="jk" value="P"<?php
if($tampil['jk']=='P'){echo'checked';} ?>>P
</td>
</tr>
<tr>
<td>Prodi</td>
<td><input type="text" name="prodi" value="<?php echo
$tampil['prodi']; ?>"> </td>
</tr>
128
<tr>
<td>
Tahun Masuk
</td>
<td>
<input type="text" name="thn_masuk" value="<?php echo
$tampil['thn_masuk']; ?>">
</td>
</tr>
<tr>
<input type="submit" name="submit" value="Simpan">
</td>
</tr>
</table>
</form>
</div>
</div>
© 2017 </p>
</div>
</div>
</body>
</html>
<?php } ?>
129
64. Buatlah file dengan nama formubahbukuuser.php dengan script

dibawah ini.
<?php
$id=$_GET['id'];
$update=mysql_query("select * from tbbuku where
idbuku='$id'");
?>
<html>
<html>
<head>
<title></title>
</head>
<body>
<div class="judul">
">WebPerpus</h1>
</div>
130
</div>
<div class="nav">
<ul>
<li><a href="../user?page=home"><i class="fa fa-home fa-
<li><a href="..user/?page=anggota"><i class="fa fa-user fa-
<li><a href="..user/?page=buku"><i class="fa fa-book fa-
<li><a href="..user/?page=transaksi"><i class="fa fa-
</ul>
</div>
</div>
<div class="title">
<h2>Edit Data Buku</h2>
</div>
<div class="putih">
<div class="form">
<form action="ubahbuku.php" method="post">
<table>
$tampil['idbuku']; ?>">
<tr>
<td>Judul</td>
131
<td><input type="text" name="judul" value="<?php echo

$tampil['judul']; ?>"> </td>
</tr>
<tr>
<td>Pengarang</td>
<td><input type="text" name="pengarang" value="<?php
echo $tampil['pengarang']; ?>"></td>
</tr>
<tr>
<td>Penerbit</td>
<td><input type="text" name="penerbit" value="<?php echo
$tampil['penerbit']; ?>"></td>
</tr>
<tr>
<td><input type="text" name="thnterbit" value="<?php echo
$tampil['thnterbit']; ?>"></td>
</tr>
<tr>
<td>Jumlah</td>
<td><input type="text" name="jumlah" value="<?php echo
$tampil['jumlah']; ?>"></td>
</tr>
tr>
<td>Lokasi</td>
<td>
132

</td>
</tr>
<tr>
<td><input type="text" name="tglinput" value="<?php echo
$tampil['tglinput']; ?>"></td>
</tr>
<tr>
</td>
</tr>
</table>
</form>
</div>
</div>
© 2017 </p>
</div>
</div>
</body>
</html>
<?php } ?>
133
65. Buatlah file bernama formubahtransaksiuser.php dengan script

dibawah ini.
<?php
$id=$_GET['id'];
$update=mysql_query("select * from tbtransaksi where
?>
<html>
<head>
<title></title>
<script
src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js"
></script>
134

</head>
<body>
<div class="judul">
">WebPerpus</h1>
</div>
</div>
<div class="nav">
<ul>
135

</ul>
</div>
</div>
<div class="title">
<h2>Edit Data Transaksi</h2>
</div>
<div class="putih">
<div class="form">
<form action="ubahtransaksi.php" method="post"
<table>
$tampil['idtransaksi']; ?>">
<tr>
<td>Nim Peminjam </td>
<td><input type="text" name="nim" value="<?php echo
$tampil['nim']; ?>"></td>
</tr>
<tr>
<td>Id Buku</td>
<td> <input type="text" name="idbuku" value="<?php
echo $tampil['idbuku'];?>"> </td>
</tr>
<tr>
<td>Tanggal Peminjam</td>
136
<td><input type="text" name="tglpinjam" id="tglpinjam"

placeholder="bulan/tanggal/tahun" value="<?php echo
$tampil['tglpinjam']; ?>"></td>
</tr>
<tr>
<td><input type="text" name="tglkembali" id="tglkembali"
readonly="readonly" placeholder="bulan/tanggal/tahun"
value="<?php echo $tampil['tglkembali']; ?>"></td>
</tr>
<tr>
<td>Perpanjang
</td>
<td><input type="text" name="jarak" id="jarak"
onkeyup="getdate()"></td>
</tr>
<tr>
<td>Status</td>
<td><input type="radio" name="status"
value="Pinjam"<?php if($tampil['status']=='pinjam'){echo
'checked';} ?>>Pinjam<input type="radio" name="status"
value="Kembali"<?php if($tampil['status']=='Kembali'){echo
'checked';} ?>>Kembali
<input type="radio" name="status"
value="perpanjang"<?php
if($tampil['status']=='perpanjang'){echo 'checked';}
?>>Perpanjang</td>
</tr>
137
<tr>
</td>
</tr>
</table>
</form>
</div>
</div>
</div>
</body>
</html>
<?php
}
?>
66. Buatlah proses dari formubah diatas dengan cara buat file dengan
nama ubahanggota.php dengan script dibawah ini.
<?php
$nim=$_POST['nim'];
$tempat_lahir=$_POST['tempat_lahir'];
$tgl_lahir=$_POST['tgl_lahir'];
$jk=$_POST['jk'];
$prodi=$_POST['prodi'];
$thn_masuk=$_POST['thn_masuk'];
138
$query="update tbanggota set nama='$nama',

tempat_lahir='$tempat_lahir', tgl_lahir='$tgl_lahir', jk='$jk',
prodi='$prodi', thn_masuk='$thn_masuk' where nim='$nim'
";
$sql=mysql_query($query);
header('location:../user/?page=anggota');
?>
67. Buatlah file bernama ubahbuku.php dengan script dibawah ini.
<?php
$id=$_POST['id'];
$tglinput=$_POST['tglinput'];
$update=mysql_query("update tbbuku set judul='$judul',
pengarang='$pengarang', penerbit='$penerbit',
thnterbit='$thnterbit', jumlah='$jumlah', lokasi='$lokasi',
tglinput='$tglinput' where idbuku='$id'");
header('location:../user/?page=buku')
?>
139
68. Buatlah file bernama ubahtransaksi.php dengan script dibawah ini.
<?php
$id=$_POST['id'];
$nim=$_POST['nim'];
$ket=$_POST['ket'];
$update=mysql_query("update tbtransaksi set
nama='$nama', nim='$nim', idbuku='$idbuku',
tglpinjam='$tglpinjam', tglkembali='$tglkembali',
status='$status', ket='$ket' where idtransaksi='$id' ");
header("location:../user/?page=transaksi");
?>
140
69. Terakir buatlah file bernama style.css dan disimpan difolder assets
→ css lalu masuakan script dibawah ini.
@fontface{
font-family: "Betty Regular";
src:url(../font/Betty Regular.ttf);
}@fontface{
font-family: "font Falling In Love";
src:url(../font/Falling In Love.ttf);
}
html, body{
margin:0px;
padding: 0px;
width: 100%;
height: 100%;
background-color: #f5f5f5;
}
.home {
width: 70%;
height: auto;
padding-top: 50px;
margin-right: auto;
margin-left: auto;
}
.home h2 {
margin: 0px;
color: #3A16C2;
font-family: "falling in Love";
text-align: center;
}
141
.home p {
color: grey;
text-align: center;
}
.bodylogin{
background:url(../gambar/111.jpg);
width: 100%;
height: 100%;
background-size: cover;
}
.login {
width: 500px;
height: 300px;
color: white;
font-size: 24px;
font-family: arial;
margin-left: auto;
margin-right: auto;
/*background-color:rgba(0,0,0, 0.2);*/
padding: 20px;
/*box-shadow: 0px 3px 20px rgba(0,0,0,1);*/
}
.login p {
margin:0px;
text-align: left;
font-family: "Betty";
font-size: 42px;
float: right;
}
142
.home p {
color: grey;
text-align: center;
}
.bodylogin{
background:url(../gambar/111.jpg);
width: 100%;
height: 100%;
background-size: cover;
}
.login {
width: 500px;
height: 300px;
color: white;
font-size: 24px;
font-family: arial;
margin-left: auto;
margin-right: auto;
/*background-color:rgba(0,0,0, 0.2);*/
padding: 20px;
/*box-shadow: 0px 3px 20px rgba(0,0,0,1);*/
}
.login p {
margin:0px;
text-align: left;
font-size: 42px;
float: right;
}
143
.login input[type=text] {
width: 100%;
height: 40px;
border:none;
font-size: 18px;
font-family: arial;
margin-top: 10px;
border-radius: 5px
}
.login input[type=password] {
width: 100%;
height: 40px;
border:none;
font-size: 18px;
font-family: arial;
margin-top: 25px;
border-radius: 5px;
}
.login input[type=submit] {
width: 100%;
height: 40px;
background-color: rgba(255,255,255,1);
font-size: 20px;
font-family: arial;
border:none;
margin-top: 20px;
color: #3c4762 ;
border-radius: 5px;
border:1px solid #3c4762;}
.login input[type=submit]:hover {
font-size: 20px;
font-family: arial;
background-color: #3c4762;
144
.login input[type=password] {
width: 100%;
height: 40px;
border:none;
font-size: 18px;
font-family: arial;
margin-top: 25px;
border-radius: 5px;
}
.login input[type=submit] {
width: 100%;
height: 40px;
background-color: rgba(255,255,255,1);
font-size: 20px;
font-family: arial;
border:none;
margin-top: 20px;
color: #3c4762 ;
border-radius: 5px;
border:1px solid #3c4762;
}
.login input[type=submit]:hover {
font-size: 20px;
font-family: arial;
color: white;
border:1px solid rgba(255,255,255,1);
}
145
.login input[type=reset] {
width: 20%;
height: 40px;
background-color: #00FF9C;
font-size: 20px;
font-family: arial;
border:none;
margin-top: 20px;
color: white;
}
.login input[type=reset]:hover {
font-size: 20px;
font-family: arial;
background-color: #1DDF8B;
color: white;
}
.tabel {
margin-left: auto;
margin-right: auto;
width: 100%;
height: auto;
text-align: center;
padding:20px;
border-collapse: collapse;
}
146
.tabel tr{
height: 30px;
border-bottom: 1px solid #ddd;
border-top: none;
}
.tabel tr:hover{
background-color: rgba(60,71,98, 0.2);
}
.tabel th{
border-right: 1px solid #ddd;
background-color: #C1C1C1;
}
.tabel td{
text-align: left;
padding: 10px;
border-right: 1px solid #ddd;
}
.tabel a {
text-decoration: none;
color: black;
}
.tabel i {
color: grey;
}
label {
text-transform: uppercase;;
font-size: 18px;
}
147
.form {
margin-right: auto;
margin-left: auto;
width: 1000px;
min-height: 500px;
margin-top: 0px;
padding-top: 50px;
}
.form td {
font-size: 18px;
font-family: arial;}
.form input[type=text] {
width: 95%;
height: 30px;
margin: 5px;}
.form input[type=text]:focus {
background-color: rgba(60,71,98, 0.1);}
.form input[type=submit] {
width: 15%;
height: 35px;
margin-top: 10px;
margin-bottom: 10px;
font-size:16px;
font-family: arial;
color: white;
border:none;
background-color: #6C6FFF;
}
148
.form input[type=reset] {
width: 15%;
height: 35px;
margin-top: 10px;
background-color: #FF3434;
color: white;
font-size: 16px;
font-family: arial;
border:none;
}
.form input[type=reset]:hover {
background-color: #FC0000;}
.form input[type=submit]:hover {
background-color: #1B54F8;}
.form select {
width: 95%;
height: 30px;
margin: 5px;}
.form table {
width: 80%;
margin-right: auto;
margin-left: auto;
padding:20px;
min-height: 400px;
text-align: left;
border-collapse: collapse;
}
149
.form input[type="radio"] {
background-color: #ddd;
border-radius: 10px;
cursor: pointer;
display: inline-block;
height: 15px;
margin-right: 15px;
position: relative;
width: 15px;
-webkit-appearance: none;}
.form input[type="radio"]:after {
background-color: #ddd;
border-radius: 25px;
content: '';
display: block;
height: 7px;
left: 4px;
position: relative;
top: 4px;
width: 7px;}
form input[type="radio"]:checked:after {
background-color: #FD3636;}
.sbar {
width: auto;
height:auto;
float: right;
padding-right: 50px;
padding-bottom: 100px;
}
150
.sbar a {
}
.sbar input[type=text] {
width: 125px;
height: 33px;
font-size: 18px;
font-family: arial;
margin-top: 10px;
border-radius: 5px;
transition: 0.3s;
content: "f002";
}
.sbar input[type=text]:focus {
width: 264px;
}
.sbar input[type=submit]{
width: 125px;
height: 35px;
font-size: 20px;
font-family: arial;
color: white;
margin-top: 10px;
border:none;
}
151
.sbar input[type=submit]:hover {
font-size: 20px;
font-family: arial;
color: white;
}
.sbar input[type=button]{
width: 400px;
height: 40px;
font-size: 20px;
font-family: arial;
border:1px solid white ;
border-radius: 5px;
margin-top: 5px;
color: white;
}
.sbar input[type=button]:hover {
font-size: 20px;
font-family: arial;
color: white;
}
.menubutton {
width: 150px;
height: 150px;
border-radius: 100%;
152
background-color:#3c4762;
font-family: arial;
font-size: 24px;
margin:10px;
border:2px solid #7479B8;
box-shadow: 4px 5px 7px #7479B8;
color: white;
}
.menubutton:hover {
background-color: #7479B8;
color: white;
}
.header {
width: 15%;
height: 100%;
background-color:#3c4762;
float: left;
position: fixed;
}
.judul{
width: 100%;
height: 100px;
border-bottom: 1px solid grey;
margin: 0px;
color: white;
margin-top: 10px;
}
153
.judul h1 {
margin: 0px;
text-align: center;
}
.nav {
width: 100%;
height:auto;
margin: 20% 0;
font-family: arial;
font-size: 20px;
}
.nav ul {
padding:0px;
}
.nav li {
text-align: left;
padding-top: 13px;
height: 30px;
list-style: none;
padding-left: 10px;
}
.nav li a {
font-size: 20px;
font-family: arial;
color: white;
}
154
.nav li:hover {
background-color: #7479B8;
}
.content {
width: 85%;
height: auto;
float: right;
background-color: #f5f5f5;
}
.jarakbutton {
margin-left: auto;
margin-right: auto;
width: 70%;
height: auto;
padding-bottom: 30px;
padding-top: 100px;
}
.jarakbutton button {
width: 120px;
height: 120px;
}
.putih{
width: 91.5%;
min-height: 500px;
background-color: white;
margin-right: auto;
margin-left: auto;
padding: 0px 20px;
}
155
.footer {
width: 95%;
height: auto;
margin-right: auto;
margin-left: auto;
color: grey;
text-align: center;
margin-top: -12px;
padding-top: 0px;
top: 0px;
height: 10%;
}
.footer p {
padding-top: 15px;
}
.title{
width: 94.2%;
height: auto;
margin-bottom: 3px;
margin-right: auto;
margin-left: auto;
padding: 5px;
margin-top: 50px;
}
156
.title i {
color: #323232;
transition: 0.3s;
}
.title i:hover {
text-shadow: 1px 1px 1px;
}
.title h2{
margin:0px;
color: black;
font-size: 30px;
}
.sosmed {
width: 50%;
margin-left: auto;
margin-right: auto;
margin-top: 30px;
}
.sosmed i{
margin-right: 3px;
margin-left: 3px;
}
157
.sosmed i:hover {
color: #00FF9C;
}
70. Jika sudah tampilannya seperti berikut:
Gambar 3.17 Tampilan Website perpus

BAB IV
PENUTUP
4.1 Kesimpulan
Dengan adanya pelaksanaan kerja praktek ini, memperoleh banyak
manfaat yang mungkin tidak diperoleh dalam pelajaran di sekolah. Disini
dalam dunia kerja yang sesungguhnya dituntut untuk mandiri sabar dan
bertanggung jawab dalam menyelesaikan tugas. Dalam kerja praktek ini
berkesempatan menerapkan ilmu yang didapatkan dalam dunia pelajaran di
sekolah.
4.2 Saran
Pada kesempatan ini, ijinkanlah penulis untuk memberikan beberapa
saran kepada pihak Dunia industri dan pihak sekolah yang sekiranya dapat
dijadikan sebagai bahan pertimbangan guna kemajuan di masa yang akan
datang:
a. Saran Untuk Perusahaan

1. Antara perusahaan dan pembina maupun guru di sekolah selalu
menjalin komunikasi terkait perkembangan siswa dalam masa
pelaksanaan prakrin.
b. Saran Untuk Sekolah
1. Pihak sekolah harus memberikan dorongan penuh dalam
melaksanakan prakrin.
2. Sebaiknya sekolah memberi jadwal yang lebih banyak dan teratur
dalam pembelajaran sekolah pada saat praktek kerja industri.
158
Lampiran – lampiran
Biodata
BIODATA PRIBADI SISWA
A. IDENTITAS SISWA
1. Nama Siswa : Abimanyu Satria Purwanto
2. NIS : 2965
3. Kelas : XI RPL 3
4. Program Keahlian : Rekayasa Perangkat Lunak
5. Tempat, Tgl Lahir : Denpasar, 01 Juni 2000
6. Alamat Siswa : Jl. Pemogan Gg. Anggrek XI No.9
6.1. Banjar : Dukuh Tangkas
6.2. Telp : 083119340256
B. IDENTITAS ORANG TUA
1. Nama Ayah : Eko Heri Purwanto
2. Pekerjaan : Wiraswasta
3. Alamat Usaha : Bandara I Gusti Ngurah Rai
4. No Telepon : 08123954125
5. Alamat Rumah : Jl. Pemogan Gg. Anggrek XI No.9
6. Nama Ibu : Kastiah
7. Pekerjaan : Wiraswasta
8. No Telepon : 089637976219
9. Alamat Rumah : Jl. Pemogan Gg. Anggrek XI No.9

Surat Pernyataan
Surat Balasan
Jurnal Kegiatan Siswa
Absensi
Nilai Kompetensi
Form Bimbingan
Sertifikat

Abimanyu Satria Purwanto

Diunggah oleh

Informasi Dokumen

Judul Asli

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

Abimanyu Satria Purwanto

Diunggah oleh

Hak Cipta:

Format Tersedia

LAPORAN PRAKTEK KERJA INDUSTRI

KOMPETENSI KEAHLIAN : REKAYASA PERANGKAT LUNAK (RPL)

DINAS PENDIDIKAN PEMUDA DAN OLAHRAGA PROVINSI BALI

Denpasar, Mei 2017

“Kerjakanlah apa yang bisa dikerjakan

Gambar 2.1 Logo Balemedia ................................................................. 7

Tabel 3.1 Ringkasan Kegiatan Bulan Januari 2017 ................................. 12

1.1 Latar Belakang

d. Mengajarkan siswa untuk menghargai waktu dan berdisiplin.

d. Melalui praktek ini diharapkan semua siswa dapat menerapkan

1.4 Sistematika Penyusunan Laporan

Pada bab ini berisi Rencana Kegiatan dan Pelaksanaan Praktek

2.1 Sejarah Balemedia

2.2 Visi dan Misi Balemedia

b. Ekspansi perusahaan untuk menjadi Application Service Provider.

2.3 Logo Balemedia

Gambar 2.1 Logo Balemedia

Jadi logo Balemedia adalah suatu tempat berkumpulnya para Software

2.4 Struktur Organisasi Balemedia

CFO / Designer COO System Admin

Gambar 2.2 Struktur Organisasi Balemedia

2.5 Produk Balemedia

Gambar 2.3 Website InputBali

Gambar 2.4 Website Pondok Bambu

Gambar 2.5 Website JDIH Jembrana

Gambar 2.6 Website JDIH Karangasem

Gambar 2.7 MAXOMORRA

f. Meyaboo Admin Panel

Gambar 2.8 Meyaboo Admin Panel

3.1 Rencana Kegiatan

b. Ringkasan Kegiatan Bulan Pebruari 2017

c. Ringkasan Kegiatan Bulan Maret 2017

d. Ringkasan Kegiatan Bulan April 2017

3.2.2 Deskripsi tugas yang dilaksanakan

1. Membuat Website Perpustakaan Dinamis dengan Form Login dan

d. XAMPP Control Panel

Gambar 3.1 XAMPP Control Panel

2) Buat Database dengan membuka localhost/phpmyadmin di

Gambar 3.2 Phpmyadmin

Gambar 3.3 Membuat tabel pada dbperpus.

-- phpMyAdmin SQL Dump

CREATE TABLE IF NOT EXISTS `tbanggota` (

INSERT INTO `tbanggota` (`nim`, `nama`, `tempat_lahir`,

CREATE TABLE IF NOT EXISTS `tbtransaksi` (

INSERT INTO `tbtransaksi` (`idtransaksi`, `idbuku`, `nim`,

INSERT INTO `tbuser` (`iduser`, `namauser`, `username`,

4) Buatlah folder baru di dalam XAMPP → htdocs dengan nama

Gambar 3.4 Membuat folder baru di htdocs

5) Di dalam folder perpus buatlah folder assets untuk meletakan

Gambar 3.5 Membuat folder assets

6) Download font-awesome, klik download lalu pilih No thank’s

Gambar 3.6 Donwload font-awesome

7) Masukan gambar seperlunya kedalam folder assets → gambar.

Gambar 3.7 Membuat Folder Baru dihtdocs

8) Di dalalm folder js letakan folder jquery yang akan digunakan

Gambar 3.8 Peletakan Jquery

Gambar 3.9 Membuka folder pada Sublime Text

10) Buatlah koneksi.php pada Sublime Text dengan scirpt seperti

Gambar 3.10 Simpan file koneksi.php

11) Kemudian buat layout login yang diberi nama index.php

12) Setelah membuat layout login, buatlah proses login dengan

Gambar 3.11 Membuat folder admin

15) Buatlah 2 folder baru di dalam folder admin dengan nama

<p style="font-family: arial; font-size: 16px;">Copyright ©