TAMA PRIAMBODO M3109075

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

PEMBANGUNAN PORTAL LELANG ONLINE BERBASIS WEB

TUGAS AKHIR

Diajukan untuk Memenuhi Salah Satu Syarat Mencapai Gelar Ahli Madya Program Diploma III Teknik Informatika

Disusun Oleh: TAMA PRIAMBODO

NIM. M3109075

PROGRAM DIPLOMA III TEKNIK INFORMATIKA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS SEBELAS MARET

SURAKARTA 2012

commit to user

ii

HALAMAN PERSETUJUAN

PEMBANGUNAN PORTAL LELANG ONLINE BERBASIS WEB

Disusun Oleh

TAMA PRIAMBODO NIM. M3109075

Tugas Akhir ini telah disetujui untuk dipertahankan Di hadapan dewan penguji

Pada tanggal 2 Juli 2012

Dibimbing oleh Pembimbing Utama

Wisnu Widiarto, S.Si., M.T. NIP. 197006012008011009

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

iii

HALAMAN PENGESAHAN

PEMBANGUNAN PORTAL LELANG ONLINE BERBASIS WEB

Disusun Oleh

TAMA PRIAMBODO NIM. M3109075

Dibimbing oleh Pembimbing Utama

Wisnu Widiarto, S.Si., M.T. NIP. 197006012008011009

Tugas Akhir ini telah diterima dan disahkan oleh dewan penguji Tugas Akhir Program Diploma III Teknik Informatika

Pada hari Senin tanggal 2 Juli 2012 Dewan Penguji :

1. Wisnu Widiarto, S.Si., M.T. ( )

NIP. 197006012008011009

2. Nanang Maulana, S.Si ( )

NIDN. 0614078103

3. Meiyanto Eko Sulistyo, S.T., M.Eng ( )

NIP. 197705132009121004

Disahkan oleh :

Dekan Fakultas MIPA UNS

Prof.Ir.Ari Handono Ramelan, M.Sc(Hons) PhD NIP. 19610223 198601 1 001

Ketua Program Studi DIII Teknik Informatika UNS

Drs. YS. Palgunadi, M.Sc NIP. 19560407 198303 1 004

commit to user

iv

ABSTRACT

Tama Priambodo. 2012. The CONSTRUCTION OF A WEB BASED AUCTION PORTAL. Engineering Informatics of Diploma III, Faculty of Mathematics and Natural Science, Sebelas Maret University Surakarta.

Now days, the development of technology is getting faster. The technology is already used in various aspects of public life, for example internet technology is applied by people to help them in acquiring information. People can access information easily without limitation through internet technology.

Auction portal online based on website is designed by using PHP

programming language with Apache as the webserver and MySOL as its data base. In this study, the writer uses Adobe Dreamweaver, which is used as the HTML editor and PHP. On the other hand, the writer uses Adobe Photoshop and Corel Draw in making the design of website page.

This website has three levels of users. First, the users, who do not belong to the member, can only see the products that will be auction. They also can access the common information or the common contents of this website. Second, both users can see the products which were on an auction by another member, can access all content website, can also conduct an auction of the product and also do the bidding of the item that is currently at auction the other member. The third, the administrators who monitor the traffic auction of each items and organize content in the any display on Web page.

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

v ABSTRAK

Tama Priambodo. 2012. PEMBANGUNAN PORTAL LELANG ONLINE BERBASIS WEBSITE. Teknik Informatika, Diploma III Teknik Informatikan, Fakultas Matematika dan Ilmu Pengetahuan Alam, Universitas Sebelas Maret Surakarta.

Perkembangan dunia teknologi semakin cepat dewasa ini. Teknologi sudah di pakai dalam berbagai macam aspek kehidupan masyarakat, khususnya teknologi internet. Penerapan teknologi internet ini memudahkan masyarakat dalam mengakses informasi karena tidak adanya batasan dalam hal akses informasi.

Portal lelang online berbasis website ini dirancang dengan menggunakan bahasa pemrograman PHP dengan Apache sebagai webservernya dan MySQL sebagai basis datanya. Dalam pembuatannya Adobe Dreamweaver di gunakan sebagai editor HTML dan PHP, sedangkan pembuatan desain halaman websitenya menggunakan Adobe Photoshop dan Corel Draw.

Website ini memiliki tiga tingkatan pengguna. Pertama pengguna bukan member yang hanya dapat melihat barang apa saja yang sedang di lelang, dan dapat mengakses konten-konten website yang sifatnya umum. Kedua pengguna member yang dapat melihat barang apa saja yang sedang di lelang oleh member lain, dapat mengakses semua konten-konten website dan juga dapat melakukan lelang barang serta dapat juga melakukan penawaran terhadap barang yang sedang di lelang member lain. Ketiga adalah administrator yang memantau lalulintas pelelangan barang dan mengatur konten-konten apa saja yang di tampilkan pada halaman website.

commit to user

vi

MOTTO PERSEMBAHAN

“Ini adalah laporan terakhir saya, kedepannya saya yang akan menerima laporan” (Tama Priambodo)

Laporan tugas akhir ini penulis persembahkan untuk :

1. Keluarga tercinta

2. Sahabat-sahabat ku dan orang-orang tersayang

3. Temen-temen TI’B 09 DIII TI FMIPA UNS

4. Teman-teman seperjuangan di D3 Teknik Informatika 2009

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

vii

KATA PENGANTAR

Segala puji dan rasa syukur kehadirat Tuhan Yang Maha Esa atas segala berkat dan karunia-Nya yang telah diberikan, sehingga penulis dapat menyelesaikan tugas akhir dengan judul ” Pembangunan Portal Lelang Online Berbasis Website”

Tugas akhir ini bertujuan untuk memenuhi dan melengkapi salah satu syarat dalam menempuh ujian untuk memperoleh derajat Ahli Madya pada studi Diploma III Teknik Informatika FMIPA Universitas Sebelas Maret.

Penulis mengucapkan banyak terima kasih dan memberikan penghargaan yang sebesar-besarnya kepada semua pihak yang telah membantu dan mendukung baik itu secara langsung maupun tidak langsung dalam penyusunan laporan Tugas Akhir ini mulai dari persiapan hingga tahap penyelesaiannya, terutama kepada:

1. Bapak Drs. YS. Palgunadi, M.Sc, selaku Ketua Program Diploma III Teknik Informatika Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sebelas Maret.

2. Bapak Wisnu Widiarto, S.Si., M.T. selaku pembimbing tugas akhir yang telah berbaik hati dan banyak memberi toleransi selama membimbing penulis sehingga tugas akhir ini dapat terselesaikan.

3. Bapak Meiyanto Eko, M.Eng. dan Bapak Nanang Maulana Y., S.Si selaku

penguji tugas akhir yang telah memberikan kebenaran atas penyusunan laporan tugas akhir ini.

Akhir kata semoga tulisan ini bermanfaat khususnya untuk penulis dan para pembaca pada umumnya.

Surakarta, Juni 2012

commit to user

viii DAFTAR ISI

Halaman

HALAMAN JUDUL ... i

HALAMAN PERSETUJUAN ... ii

HALAMAN PENGESAHAN ... iii

HALAMAN ABSTRAK ... iv

HALAMAN INTISARI ... v

MOTTO DAN PERSEMBAHAN ... vi

KATA PENGANTAR ... vii

DAFTAR ISI ... viii

DAFTAR TABEL ... x

DAFTAR GAMBAR ... xi

BAB I PENDAHULUAN ... 1

1.1 Latar Belakang Masalah ... 1

1.2 Rumusan Masalah ... 2

1.3 Batasan Masalah... 2

1.4 Tujuan dan Manfaat ... 2

1.5 Metodologi Penelitian ... 3

1.6 Sistematika Penulisan ... 4

BAB II LANDASAN TEORI ... 5

2.1 Lelang ... 5

2.2 Data Flow Diagram (DFD) ... 6

2.3 EntityRelationshipDiagram (ERD) ... 7

2.3.1 Entity ... 8

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

ix

2.3.1 Hubungan/Relasi ... 8

2.4 Website ... 9

2.5 Bahasa Pemograman HTML ... 10

2.6 Bahasa Pemograman JavaScript ... 11

2.7 Bahasa Pemograman CSS ... 11

2.8 Bahasa Pemograman PHP ... 11

2.9 jQuery ... 12

BAB III ANALISIS DAN PERANCANGAN SISTEM ... 13

3.1 Perancangan Arsitektur ... 13

3.2 Perancangan Sistem ... 13

3.2.1 Context Diagram (CD) ... 13

3.2.2 Data Flow Diagram (DFD) ... 15

3.2.3 Entitiy Relationship Diagram (ERD) ... 20

3.2.4 Relasi Antar Tabel ... 20

3.2.5 Struktur Tabel ... 21

3.2.6 Struktur Navigasi ... 31

BAB IV IMPLEMENTASI DAN ANALISA ... 33

4.1 Kebutuhan Sistem ... 33

4.2 Implementasi Sistem ... 34

4.2.1 Halaman Front End ... 34

4.2.2 Halaman Back End ... 44

BAB V PENUTUP ... 48

4.1 Kesimpulan ... 48

4.2 Saran ... 48

commit to user

x

DAFTAR TABEL

Halaman

1. Tabel 3.1 admin ... 21

2. Tabel 3.2 banner ... 22

3. Tabel 3.3 bid... 23

4. Tabel 3.4 conten ... 24

5. Tabel 3.5 kategori... 24

6. Tabel 3.6 kat_par ... 25

7. Tabel 3.7 lelang ... 26

8. Tabel 3.8 member... 28

9. Tabel 3.9 news ... 30

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

xi

DAFTAR GAMBAR

Halaman

1. Gambar 2.1 Simbol Entity Luar ... 6

2. Gambar 2.2 Simbol Aliran Data... 6

3. Gambar 2.3 Simbol Proses ... 7

4. Gambar 2.4 Simbol Berkas ... 7

5. Gambar 2.5 Simbol Entity ... 8

6. Gambar 2.6 Simbol Atribut ... 8

7. Gambar 2.7 Simbol Relasi ... 8

8. Gambar 3.1 Perancangan Arsitektur ... 13

9. Gambar 3.2 Context Diagram Wanipiro ... 14

10. Gambar 3.3 DFD Level 0 Website Wanipiro ... 15

11. Gambar 3.4 DFD Level 1 proses 2 website wanipiro ... 16

12. Gambar 3.5 DFD Level 1 proses 3 website wanipiro ... 16

13. Gambar 3.6 DFD Level 1 proses 4 website wanipiro ... 17

14. Gambar 3.7 DFD Level 1 proses 5 website wanipiro ... 18

15. Gambar 3.8 DFD Level 1 proses 6 website wanipiro ... 19

16. Gambar 3.9 DFD Level 1 proses 7 website wanipiro ... 19

17. Gambar 3.10 ERD (Entity Relationship Diagram) ... 20

18. Gambar 3.11 Relasi Antar Tabel ... 20

19. Gambar 3.12 Struktur Navigasi User ... 31

20. Gambar 3.13 Struktur Navigasi Administrator ... 32

21. Gambar 4.1 Halaman Home ... 35

22. Gambar 4.2 Form Registrasi ... 36

23. Gambar 4.3 Form Login ... 37

24. Gambar 4.4 Halaman List Barang Lelang ... 38

25. Gambar 4.5 Halaman List Berita ... 39

26. Gambar 4.6 Halaman Detail Barang ... 40

27. Gambar 4.7 Halaman Profile Member ... 42

commit to user

xii

29. Gambar 4.9 Halaman Input Barang Lelang ... 44

30. Gambar 4.10 Halaman Login Administrator ... 45

31. Gambar 4.11 Halaman Index Administrator ... 45

32. Gambar 4.12 Halaman Tampil Data Administrator ... 46

33. Gambar 4.13 Halaman Tambah Data Administrator... 47

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

1 BAB I PENDAHULUAN

1.1Latar Belakang Masalah

Perkembangan teknologi informasi saat ini sangat berpengaruh bagi semua kalangan, semua orang membutuhkan segala bentuk informasi agar tidak tertinggal di belakang. Informasi sekecil apapun sangat berarti bagi semua orang, dan karena sebuah informasi itulah yang bisa menjadikan semuanya mengerti akan perkembangan yang terjadi di negeri yang sudah modern ini, tanpa sebuah teknologi informasi masyarakat saat ini tidak akan bisa berkembang dengan pesat.

Seiring dengan pesatnya perkembangan teknologi informasi saat ini, informasi pun sudah dapat diakses dimana-mana serta praktis. Salah satu medianya yaitu dengan media elektronik/komputer. Sekarang ini sudah menjadi bahan yang tak asing lagi di masyarakat yaitu menggunakan media internet untuk berinteraksi, mengakses informasi, serta transaksi jual beli pun dapat dilakukan di internet tanpa mengenal jarak antara penjual dan pembeli yang ada di penjuru dunia.

Begitu juga jika dilihat dari keekonomisan biaya yang dikeluarkan jika mempromosikan barang yang akan dijual atau dilelang melalu media cetak ataupun televisi, sedangkan melalui media internet atau biasa disebut website, kita dapat mempromosikan barang yang akan dijual atau dilelang tanpa mengeluarkan biaya sepeserpun dengan ruang lingkup yang lebih luas jika dibandingkan dengan media cetak ataupun televisi. Untuk melakukan pembelian atau penawaran barang melalui media internet atau websitepun lebih ekonomis jika dibandingkan dengan mengunjungi penjualnya langsung jika si penjual barang berada di kota atau provinsi yang berbeda.

commit to user

1.2Rumusan Masalah

Rumusan masalah dari penulisan tugas akhir ini adalah “Bagaimana

membangun suatu web yang dapat mempermudah pengunjung melelang atau menawar barang yang dilelang oleh pengunjun lain”.

1.3Batasan Masalah

Penulis membatasi masalah dalam penulisan Tugas Akhir ini. Masalah – masalah yang akan dibahas dalam penulisan Tugas Akhir ini adalah :

1. Pembuatan portal lelang online berbasis web.

2. Pembuatan website yang menyediakan service – service kepada member dimana member dapat melelang barangnya dan juga dapat menawar barang yang dilelang member lainnya. Sedangkan administrator hanya memantau lalulintas pelelangan dan memanajemen member.

1.4Tujuan dan Manfaat

Tujuan penyusunan tugas akhir ini adalah untuk membangun suatu website

lelang online dimana dapat mempermudah seorang personal untuk

mempromosikan barang atau melelang barang tanpa harus memiliki website sendiri, sekaligus mempermudah seorang personal untuk melakukan penawaran tanpa harus bertatap muka dengan pemilik barang.

Manfaat yang penulis harapkan dari penyusunan tugas akhir ini antara lain:

1. Untuk pengguna :

Penggunaan website lelang online ini cukup dengan menjadi member, pengguna dapat melelang barangnya di website ini, member juga dapat melakukan penawaran atas barang yang dilelang oleh member lainnya.

2. Untuk penulis :

Pembuatan website ini merupakan media kreativitas dalam menerapkan ilmu - ilmu yang telah dipelajari selama proses belajar di bangku kuliah dengan harapan semoga website ini terus dapat dikembangkan.

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

3

1.5Metodologi Penelitian

Penelitian diperlukan sebagai sarana pendukung dalam pembuatan laporan Tugas Akhir, dimana penelitian ini dilakukan dengan menggunakan beberapa metode. Metode yang digunakan yaitu :

1. Pengumpulan Data

Metode pengumpulan data yang digunakan penulis dalam penyusunan tugas akhir ini ada dua yaitu :aan

a. Penelitian

Penulis melakukan penelitian terhadap website-website sejenis dan mempelajari sistem informasi yang digunakan, flow-flow dalam melakukan transaksi dan keamanan yang harus diberikan member. Serta menyempurnakan sistem-sistem yang masih memiliki kekurangan dari website-website sejenis.

b. Studi Pustaka

Penulis mengambil referensi dari perpustakaan untuk mencari deskripsi tentang sistem informasi, Context Diagram, Data Flow Diagram,

database, Entitas Relationship Diagram, Relasional Antar Tabel, site map, dan masih banyak lagi.

2. Perancangan

Dalam perancangan sistem pada website lelang online digunakan beberapa diagram. Antara lain, Context Diagram, Data Flow Diagram, Entity Relationship Diagram dan Relasional Antar Tabel. Selain itu, penulis juga membuat perancangan database.

3. Implementasi

Implementasi sistem pada website lelang online ini dikerjakan menggunakan bahasa pemrograman PHP, Apache sebagai webserver dan MySQL sebagai database.

1.6 Sistematika Penulisan

Sistematika penulisan laporan tugas akhir ini adalah sebagai berikut :

1. BAB I PENDAHULUAN

Bab ini membahas tentang latar belakang masalah dari penulisan tugas akhir ini, rumusan masalah, batasan masalah, tujuan penulisan tugas akhir, manfaat yang didapatkan dari penulisan tugas akhir, metodologi serta sistematika penulisan yang digunakan pada penulisan tugas akhir ini.

2. BAB II LANDASAN TEORI

Bab ini membahas tentang teori-teori yang digunakan penulis sebagai dasar untuk menyusun tugas akhir ini.

3. BAB III ANALISA DAN PERANCANGAN SISTEM

Bab ini membahas tentang bentuk desain dan perancangan sistem aplikasi. Pemodelan yang dipakai untuk merancang aplikasi ini adalah dengan

pembuatan Context Diagram, Data Flow Diagram, Entity Relationship

Diagram, database dan Relasional Antar Tabel.

4. BAB IV IMPLEMENTASI DAN PEMBAHASAN

Bab ini membahas tentang ini membahas tentang implementasi aplikasi sistem pada jaringan komputer, spesifikasi hardware maupun software yang dipakai, serta analisa hasil aplikasi yang kemudian ditampilkan dalam bentuk report.

5. BAB V PENUTUP

Bab ini membahas tentang kesimpulan dan saran yang penulis ambil dari penulisan tugas akhir ini.

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

5 BAB II

LANDASAN TEORI

2.1Lelang

Pengertian lelang menurut bahasa Indonesia (dikeluarkan oleh Depdikbud, penerbit Balai Pustaka) bahwa lelang adalah penjualan dihadapkan orang banyak (dengan tawaran yang atas mengatas) dipimpin oleh penjabat lelang. Sedangkan yang dimaksud melelangkan atau memperlelangkan adalah:

1. Menjual dengan jalan lelang

2. Memberikan barang untuk dijual dengan jalan lelang,

3. Memborongkan pekerjaan.

Berdasarkan pengertian tersebut dapat diambil kesimpulan bahwa pengertian lelang tidak dibatasi penjualan barang-barang saja, tetapi meliputi juga pemborongan pekerjaan.(Sasmita, 2011)

Pengertian lelang menurut kamus hokum dalam bahasa inggris bahwa lelang adalah auction, yaitu “Public sale at while godos are sold the person making the hinghest bids or offers” barang dijual kepada penawaran tertinggi. (Sasmita, 2011)

Pengertian lelang menurut Undang-undang (VR.STBL 1908 no. 189) bahwa di Indonesia sejak jaman penjajahan Belanda, lelang sudah diatur dalam peraturan perundang-undangan yang disebut vendu reglement (Stbl. Tahun 1908 No. 189 diubah dengan Stbl. 1940 no 56). Sampai saat ini Vendu Reglement ini masih tetap dipergunakan sebagai dasar hukum lelang. Bunyi dari terjemahan itu

adalah “Penjualan Umumadalah penawaran yang mengikat atau menurun atau dengan pemasukan harga dalam sampul tertutup, atau kepada orang-orang yang diundang atau sebelumnya diberitahu mengenai pelelangan atau penjualan itu, atau diijinkan untuk ikut serta dan diberi kesempatan untuk menawar harga, menyetujui harga yang ditawarkan atau memasukkan harga dalam sampul

2.2Data Flow Diagram (DFD)

Data Flow Diagram adalah suatu model logika data atau proses yang akan dibuat untuk menggambarkan darimana asal data dan kemana tujuan data yang keluar dari sistem, dimana data disimpan, proses apa yang menghasilkan data tersebut, dan interaksi antara data yang tersimpan dan proses yang dikenakan pada data tersebut. (Kristanto, 2003)

DFD menggambarkan penyimpanan data dan proses yang

mentransformasikan data serta menunjukkan hubungan antara data pada sistem dan proses pada sistem. Salah satu teknik dasar DFD yaitu Yourdon dan De Marco yang terdiri dari komponen-komponen sebagai berikut :

a. Entity Luar

Entity luar digambarkan dengan simbol persegi biasa. Merupakan sumber atau tujuan dari aliran data dari atau ke sistem. Entity luar bisa digambarkan secara fisik dengan sekelompok orang atau mungkin sebuah sistem. (Kristanto, 2003)

Gambar 2.1 Simbol Entity Luar b. Aliran Data

Menggambarkan aliran data dari suatu proses ke proses lainnya. Adapun simbol dari aliran data bentuk garisnya bisa bebas. (Kristanto, 2003)

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

7

c. Proses

Proses atau fungsi yang mentranformasikan data secara umum, digambarkan dengan lingkaran. (Kristanto, 2003)

Gambar 2.3 Simbol Proses

d. Berkas

Merupakan komponen yang berfungsi untuk menyimpan data atau file. Simbolnya seperti berikut :

Gambar 2.4 Simbol Berkas

2.3EntityRelationshipDiagram (ERD)

Menurut Kristanto ERD merupakan suatu model untuk menjelaskan hubungan antar data dalam basis data berdasarkan objek-objek dasar data yang mempunyai hubungan antar relasi. ERD untuk memodelkan struktur data dan hubungan antar data, untuk menggambarkannya digunakan beberapa notasi dan simbol. Pada dasarnya ada tiga simbol yang digunakan, yaitu :

commit to user

2.3.1 Entity

Entity merupakan objek yang mewakili sesuatu yang nyata dan dapat dibedakan dari sesuatu yang lain . (Kristanto, 2003)

Gambar 2.5 Simbol Entity

2.3.2 Atribut

Setiap entitas pasti mempunyai elemen yang disebut atribut yang berfungsi untuk mendeskripsikan karakteristik dari entitas tersebut. Isi dari atribut mempunyai sesuatu yang dapat mengidentifikasikan isi elemen satu dengan yang lain. (Kristanto, 2003)

Gambar 2.6 Simbol Atribut

2.3.3 Hubungan / Relasi

Hubungan antara sejumlah entitas yang berasal dari himpunan entitas yang berbeda. (Kristanto, 2003)

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

9

2.4Website

Website adalah kumpulan dari halaman-halaman situs, yang biasanya terangkum dalam sebuah domain atau subdomain, yang tempatnya berada didalam

World Wide Web (WWW) di Internet. Sebuah halaman web adalah dokumen yang ditulis dalam format HTML (Hyper Text Markup Language), yang hampir selalu bisa diakses melalui HTTP, yaitu protokol yang menyampaikan informasi dari server website untuk ditampilkan kepada para pemakai melalui web browser. (Nugroho, 2004)

Semua publikasi dari website tersebut dapat membentuk sebuah jaringan informasi yang sangat besar. Sebuah website dibuat didalam sebuah sistem komputer yang dikenal dengan server web. Yang menerima lalu mengirimkan halaman-halaman yang diperlukan untuk merespon permintaan dari pengguna. Apache adalah piranti lunak yang biasa digunakan dalam sebuah webserver, kemudian setelah itu adalah Microsoft Internet Information Services (IIS). (Nugroho, 2004)

Penemu website adalah Sir Timothy John ¨Tim¨ Berners-Lee, sedangkan

website yang tersambung dengan jaringan, pertamakali muncul pada tahun 1991. Maksud dari Tim ketika membuat website adalah untuk mempermudah tukar menukar dan memperbarui informasi kepada sesama peneliti ditempat dia bekerja. Pada tanggal 30 April 1993, CERN (tempat dimana Tim bekerja) menginformasikan bahwa WWW dapat digunakan secara gratis oleh semua orang. Terdapat dua komponen utama dalam mekanisme kerja web :

1. Web server.

Web server merupakan sebuah aplikasi perangkat lunak. Aplikasi web server ini dijalankan pada sebuah komputer yang disebut dengan server.

Web server adalah salah satu jenis perangkat lunak yang menyediakan layanan halaman (dokumen) web yang dapat diakses seluruh dunia melalui internet. Web server akan melayani permintaan akses halaman web dengan bantuan protokol – protokol komunikasi terutama HTTP. (Nugroho, 2004)

2. Web browser.

Web browser adalah perangkat lunak (software) yang digunakan untuk menampilkan dokumen HTML. Perangkat luna ini dioperasikan pada komputer pengguna seluruh dunia. Web browser akan membantu pengguna mengakses halaman web yang disediakan oleh sebuah web server serta membantu pengguna dalam hal navigasi. Pada saat ini ada beberapa borwser yang dikembangkan oleh beberapa vendor, antara lain internet explorer yang dikempangkan oleh netscape. (Nugroho, 2004)

Protokol merupakan aturan tata cara yang diimplemantasikan di dalam mekanisme komunikasi dalam satu jaringan komoputer. Aturan ini diperlukan supaya proses komunikasi yang terjadi dapat teratur dan sistematis sehingga dapat dirancang suatu model komunikasi untuk berbagai keperluan. Pada saat ini telah tercipta berbagai protokol yang digunakan dalam rangka berkomunikasi melalui jaringan komputer. Berikut ini adalah beberapa prootokol yang ada :

a. Transmission Control Protokol (TCP). Mengatur tata cara pemaketan data dari pengirim dan pembukaan data dari komputer penerima.

b. Internet Protokol (IP). Mengatur mekanisme pengiriman data dari komputer pengirim sampai komputer penerima.

c. Hypertext Transfer Protocol (HTTP). Mengatur mekanisme transfer dan penampilan halaman web.

d. File Transfer Protocol. Mekanisme transfer file di dalam jaringan komputer.

Email protocol. Mengatur meknisme pengiriman dan penerimaan email. (Nugroho, 2004)

2.5Bahasa Pemograman HTML

HyperText Markup Language (HTML) adalah sebuah bahasa markup yang digunakan untuk membuat halaman web dan menampilkan berbagai informasi di dalam sebuah browser internet. (Septian, 2011)

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

11

HTML saat ini merupakan standar Internet yang didefinisikan dan dikendalikan penggunaannya oleh Word Wide Web Consortium (W3C). (Septian, 2011)

HTML berupa kode-kode tag yang menginstruksikan browser untuk menghasilkan tampilan sesuai dengan yang diinginkan. Sebuah file bentuk HTML dapat digunakan menggunakn browser web seperti Mozilla Firefox atau Microsoft Internet Explorer. (Septian, 2011)

2.6Bahasa Pemograman JavaScript

Javascript adalah bahasa scripting yang handal yang berjalan pada sisi client. Javascript merupakan sebuah bahasa scripting yang dikembangkan oleh Netscape. Untuk menjalankan script yang ditulis dengan Javascript kita membutuhkan Javascript-enabeled browser yaitu browser yang mampu menjalankan Javascript. (Septian, 2011)

2.7Bahasa Pemograman CSS

Cascading Style Sheet (CSS) adalah seuatu bahasa stylesheet yang digunakan untuk mengatur tampilan suatu dokumen yang ditulis dalam bahasa markup. Pengguna yang paling umum dari CSS adalah untuk memformat halaman web yang ditulis dengan HTML dan XHTML. Walaupun demikian, bahasanya sendiri dapat dipergunakan untuk semua jenis dokumen XML termasuk SVG dan XUL Spesifikasi CSS diatur oleh Word Wide Web Consortium (W3C). (Septian. 2011)

2.8Bahasa Pemograman PHP

PHP adalah bahasa pemrograman script yang paling banyak dipakai saat ini. PHP adalah bahasa pemrograman web atau scripting language yang didesain untuk web atau scripting language yang didesain untuk web. (Septian, 2011)

Awalnya PHP merupakan kependekan dari Personal Home Page. PHP

dibuat pertama kali oleh Rasmus Lerdorf pada 1994, yang pada awalnya dibuat untuk menghitung jumlah pengunjung pada homepagenya. Pada waktu itu PHP

masih bernama FI (Form Interpreted), yang wujudnya berupa sekumpulan script yang digunakan untuk mengelola data form di web. Di awal tahun 2001, PHP telah dipakai lebih dari 5 juta dolain di seluruh dunia, dan akan terus bertambah karena kemudahan aplikasi PHP ini dibandingkan dengan bahasa Server side yang lain. (Septian, 2011)

2.9jQuery

jQuery merupakan salah satu pustaka yang dikembangkan dengan menggunakan JavaScrip. Kehadirannya adalah untuk memudahkan penulisan kode JavaScrip. Dengan menggunakan jQuery, penulisan kode JavaScrip menjadi lebih sederhana,(kodenya menjadi ringkas). Selain itu, yang lebih penting lagi, pembuatan halaman web yang interaktif dan menarik menjadi jauh lebih mudah diimplementasikan dari pada kalau anda menuliskan JavaScrip sendiri. (Kadir, 2011)

Beberapa kemampuan yang bisa didapatkan dengan menggunakan jQuery disajikan dibawah ini:

Menyembunyikan/menampilkan elemen yang menyusun halaman web. Menambahkan/menghapus elemen yang ada dalam halaman web.

Melakukan animasi terhadap halaman web, misalnya menggerakkan gambar.

Menyajikan table dengan warna berselang-seling untuk setiap baris.

Menggunakan Ajax, misalnya untuk mengubah tampilan sebagian data pada halaman web didasarkan jawaban dari server.

Selain itu, jQuery juga mendukung penambahan plug-in, yang membuat

kemampuan jQuery bertambah pesat. Plug-in adalah tambahan-tambahan yang berjalan di atas jQuery yang membuat pembuatan halaman web jadi lebih mudah atau lebih menarik. (Kadir, 2011)

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

13 BAB III

ANALISA DAN PERANCANGAN SISTEM

3.1 Perancangan Arsitektur

Gambar dibawah ini merupakan rancangan arsitektur jaringan komputer yang akan diimplementasikan pada website lelang online.

`

Database server Web server

admin

user `

Gambar 3.1 Perancangan Arsitektur

3.2Perancangan Sistem

Setelah memperoleh data – data dari hasil penelitian, dibuat sebuah perencanaan sistem sesuai dengan kebutuhan yang ada. Rancangan tersebut meliputi perancangan input dan output. Perancangan sistem ini dimulai dengan perancangan Context Diagram (CD), Data Flow Diagram (DFD) dan Entitas Relationship Diagram (ERD). Agar suatu sistem dapat dipahami dan direalisasikan, maka diperlukan suatu gambaran mengenai alur data dari proses yang terjadi.

3.2.1 Context Diagram (CD)

Context Diagram atau diagram konteks ini merupakan penggambaran secara garis besar sistem portal lelang online yang akan dibangun dengan menampilkan input, proses, dan output dari sistem. Context Diagram sistem ini dapat dilihat pada gambar 3.2.

Wanipiro Admin User Non-member Data Lelang Data Konten Data News Data Member Data History

Info Data Lelang Info Data Konten Info Data News Info Data Member

Info History

Data Lelang Data Konten Data News

Info Data Lelang Info Data Konten Info Data News

User member Data Lelang Data Konten Data News Data Member Data History

Info Data Lelang Info Data Konten Info Data News Info Data Member

Info History

Gambar 3.2 Context Diagram Wanipiro

Keterangan :

Pada Context Diagram tersebut, terdiri dari 3 entitas yaitu Admin. User Nonmember dan User Member.

1. Admin login dengan user dan password sesuai yang telah ditentukan.

2. Admin mengelola semua konten yang di tampilkan di halaman wanipiro

3. Admin mengontrol semua barang yang di lelang di halaman wanipiro

4. User Nonmember hanya dapat melihat barang apa saja yang di lelang.

5. User Nonmember dapat melakukan registrasi untuk mendaftar menjadi

member di website wanipiro.

6. User Member dapat melelang barang miliknya di website wanipiro.

7. User Member dapat menawar barang yang di lelang member lainnya.

8. User Member dapat melihat history penawaran dan lelang barang yang pernah

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

15

3.2.2 Data Flow Diagram (DFD)

DFD Level 0, menggambarkan aliran data yang ada di dalam sistem seperti yang digambarkan pada proses di dalam Context Diagram. Gambar DFD Level 0 dapat dilihat pada gambar 3.3.

Admin 1 Login 2 Management User 3 Management Lelang Data member Data lelang Data news Data kategori Data bid 4 Management News 5 Management Konten 6 Management transaksi 7 Management kategori Data kontent

Username dan password Pesan validasi Data user Info user Data lelang Info lelang Data news Info news Data konten Info Konten data pesanan Info pesanan Data kategori Info kategori Username dan password

Pesan validasi Data user Data lelang Data news Data konten konfrimasi pemesanan Data kategori User Member User Non-member Info user Info Lelang Info news Info konten Info pesanan data pesanan Info kategori Pesan validasi

Username dan password

Info Lelang Info news Info konten Info categori Data registrasi Info user Info lelang Info news Info konten Pesan validasi Info kategori

commit to user Admin Data member User member 2.1 Tambah member 2.2 Edit data member 2.3 hapus data member 2.4 Cari data member Data member Data member Data member Data member Nama member Info member Pesan validasi Pesan validasi Pesan validasi Data member Data member Nama member Data member Pesan validasi Info member Pesan validasi Pesan validasi Pesan validasi

Gambar 3.4 DFD Level 1 Proses 2 Website Wanipiro

Admin Data lelang User member 3.1 Edit data lelang 3.2 hapus data lelang 3.3 Cari data lelang Data lelang Data lelang

Data nama lelang Info lelang Pesan validasi

Pesan validasi Data lelang

Data lelang

Input nama lelang

Input nama lelang

Pesan validasi Pesan validasi Info lelang Info lelang 3.4 Input data lelang Data lelang Pesan validasi Data lelang Pesan validasi Data lelang Pesan validasi Data lelang Pesan validasi

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

17

Admin

Data news 4.1

Tambah news

4.2 Edit data

news

4.3 hapus data

news

4.4 Cari data

news Data news

Data news

Data news

Data news

Judul berita Info news Pesan validasi

Pesan validasi Pesan validasi

Data news

Data news

Judul berita Pesan validasi

Pesan validasi

Pesan validasi

Info news

Pengunjung Member 5.5 Edit about us 5.4 Edit Term 5.2 Edit privacy and policy 5.7 Edit meta keyword 5.6 Edit YM Data Konten Admin 5.12 View Content

Data konten contact

Data privacy and policy

Data banner

Data term

Data konten About us

Data ym

Data meta keyword

Data meta deskription

Data konten contact

Data privacy and policy

Data banner

Data term

Data about us

Data ym

Data meta keyword

Data meta deskription Pesan validasi Pesan validasi Pesan validasi info konten Info konten Request data Pesan validasi Pesan validasi Pesan validasi Pesan validasi Pesan validasi Request konten Pengunjung Non Member Info konten Request konten Pesan validasi Pesan validasi Pesan validasi Pesan validasi Pesan validasi Pesan validasi Pesan validasi Pesan validasi 5.3 Edit banner 5.8 Edit meta deskripsion 5.1 Edit contact

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

19 Admin Data bid User member 6.1 Edit Status transaksi 6.2 Cari data transaksi 6.3 hapus data transaksi 6.4 input data transaksi status transaksi Status transaksi

Data Nomer faktur

Data transaksi

Data transaksi Pesan validasi dan info transaksi

Pesan validasi Info transaksi Pesan validasi

Input nomer faktur

Data transaksi

Input data transaksi Pesan validasi

Info transaksi

Pesan validasi

Pesan validasi dan info transaksi

Gambar 3.8 DFD Level 1 Proses 6 Website Wanipiro

Admin Data kategori 7.1 Tambah kategori 7.2 Edit data kategori 7.3 hapus data kategori 7.4 Cari data kategori

Data kategori Data kategori

Data kategori Data kategori Nama kategori Info kategori Pesan validasi Pesan validasi Pesan validasi Data kategori Data kategori Nama kategori Pesan validasi Pesan validasi Pesan validasi Info kategori

3.2.3 Entity Relationship Diagram (ERD)

memiliki idid member

lelang username password email nama alamat telp tgl_lahir no_ktp ava date_reg status ktp id barang gambar deskripsi kat tanggal member harga_awal lama_lelang harga_akhir lelang bid melakukan 1 M M M id member harga waktu kat id kategori parent kat_par id kategori M 1 memiliki 1 M

Gambar 3.10 ERD (Entity Relationship Diagram)

3.2.4 Relasi Antar Tabel

Gambar 3.11 Relasi Antar Tabel

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

21

3.2.5 Struktur Tabel

Berikut Struktur Tabel dari rancangan diagram diatas:

1. Tabel admin

Fungsi: untuk menyimpan record list administrator yang dapat

mengakses halaman administrator, yang berisi username dan password administrator.

Dalam tabel admin terdapat beberapa field yang menjadikanya sebuah tabel, filed tersebut antara lain:

a. id

field id merupakan suatu field yang mana datanya berisi id pada suatu record dengan primary key dan auto increment.

b. username

field username merupakan suatu field yang mana datanya berisi username administrator.

c. password

field password merupakan suatu field yang mana datanya berisi password administrator.

Tabel 3.1 admin

Field Type Size Keterangan

id int 11 Primary Key not_null

Auto increment

username varchar 111 not_null

password varchar 32 not_null

2. Tabel banner

Fungsi: untuk menyimpan nama gambar banner yang di tampilkan pada halaman index sehingga gambar banner pada halaman index dapat di

edit.

Dalam tabel banner terdapat beberapa field yang menjadikanya sebuah tabel, field tersebut antara lain:

commit to user

a. id

field id merupakan suatu field yang mana datanya berisi id pada suatu record dengan primary key dan auto increment.

b. judul

field judul merupakan suatu field yang mana datanya berisi nama banner .

c. banner

field banner merupakan suatu field yang mana datanya berisi nama file gambar banner yang ditampilkan pada halaman index.

Tabel 3.2 banner

Field Type Size Keterangan

id int 11 Primary Key not_null Auto increment

judul varchar 111 not_null

banner text not_null

3. Tabel bid

Fungsi: untuk menyimpan record penawaran suatu member pada tiap barang yang di lelang.

Dalam tabel bid terdapat beberapa field yang menjadikanya sebuah tabel,

field tersebut antara lain:

a. id

field id merupakan suatu field yang mana datanya berisi id pada suatu record dengan primary key dan auto increment.

b. lelang

field lelang merupakan suatu field yang berisi id dari tabel lelang.

c. member

field member merupakan suatu field yang mana datanya berisi id dari tabel member yang mana member tersebut melakukan penawaran terhadap barang yang di lelang.

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

23

d. harga

field harga merupakan suatu field yang mana datanya berisi harga dari penawaran suatu member terhadap barang yang di lelang.

e. waktu

field waktu merupakan suatu field yang mana datanya berisi waktu kapan suatu member melakukan penawaran terhadap suatu lelang.

Tabel 3.3 bid

Field Type Size Keterangan

id int 11 Primary Key not_null Auto increment

lelang int 11 not_null

member int 11 not_null

harga double not_null

waktu datetime not_null

4. Tabel conten

Fungsi: untuk menyimpan record konten-konten yang di tampilkan pada halaman website, sehingga konten-konten tersebut dapat di edit.

Dalam tabel conten terdapat beberapa field yang menjadikanya sebuah tabel, field tersebut antara lain:

a. id

field id merupakan suatu field yang mana datanya berisi id pada suatu record dengan primary key dan auto increment.

b. judul

field judul merupakan suatu field yang mana datanya berisi judul conten pada suatu record.

c. isi

field isi merupakan suatu field yang mana datanya berisi text yang ditampilkan pada suatu conten.

d. modif

field modif merupakan suatu field yang mana datanya berisi tanggal terakhir pengeditan pada suatu record.

Tabel 3.4 conten

Field Type Size Keterangan

id int 11 Primary Key not_null Auto increment

judul varchar 111 not_null

isi text not_null

modif date not_null

5. Tabel kategori

Fungsi: untuk mengelompokkan barang-barang yang di lelang menjadi beberapa jenis kategori.

Dalam tabel kategori terdapat beberapa field yang menjadikanya sebuah tabel, field tersebut antara lain:

a. id

field id merupakan suatu field yang mana datanya berisi id pada suatu record dengan primary key dan auto increment.

b. nama

field nama merupakan suatu field yang mana datanya berisi nama kategori.

c. parent

field parent merupakan suatu field yang mana datanya berisi id dari tabel kat_parent.

Tabel 3.5 kategori

Field Type Size Keterangan

id int 11

Primary

Key not_null

Auto increment

nama varchar 111 not_null

parent int 11 not_null

6. Tabel kat_par

Fungsi: untuk mengelompokkan kategori-kategori yang di lelang menjadi beberapa sub kategori.

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

25

Dalam tabel kat_par terdapat beberapa field yang menjadikanya sebuah tabel, field tersebut antara lain:

a. id

field id merupakan suatu field yang mana datanya berisi id pada suatu record dengan primary key dan auto increment.

b. kategori

field nama merupakan suatu field yang mana datanya berisi id dari table kategori

c. deskripsi

field dekripsi merupakan suatu field yang mana datanya berisi deskripsi dari kategori induk.

Tabel 3.6 kat_par

Field Type Size Keterangan

id int 11

Primary

Key not_null

Auto increment

kategori int 11 not_null

deskripsi text null

7. Tabel lelang

Fungsi: untuk menyimpan record barang-barang yang di lelang oleh member.

Dalam tabel lelang terdapat beberapa field yang menjadikanya sebuah tabel, field tersebut antara lain:

a. id

field id merupakan suatu field yang mana datanya berisi id pada suatu record dengan primary key dan auto increment.

b. barang

field barang merupakan suatu field yang mana datanya berisi nama barang yang di lelang.

commit to user

field gambar merupakan suatu field yang mana datanya berisi gambar dari barang yang di lelang.

d. deskripsi

field deskripsi merupakan suatu field yang mana datanya berisi deskripsi dari barang yang di lelang.

e. kat

field kat merupakan suatu field yang mana datanya id dari table kategori.

f. tanggal

field tanggal merupakan suatu field yang mana datanya berisi waktu barang tersebut dilelang.

g. member

field member merupakan suatu field yang mana datanya berisi id member si pelelang yang di ambil dari tabel member.

h. harga_awal

field harga_awal merupakan suatu field yang mana datanya berisi harga awal dari barang yang di lelang.

i. lama_lelang

field lama_lelang merupakan suatu field yang mana datanya berisi lama waktu lelang dari suatu barang yang di lelang.

Tabel 3.7 lelang

Field Type Size Keterangan

id int 11

Primary

Key not_null

Auto increment

barang varchar 111 not_null

gambar text not_null

deskripsi text not_null

kat int 11 not_null

tanggal date not_null

member int 11 not_null

harga_awal double not_null

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

27

8. Tabel member

Fungsi: untuk menyimpan record user yang terdaftar sebagai member website.

Dalam tabel member terdapat beberapa field yang menjadikanya sebuah tabel, field tersebut antara lain:

a. id

field id merupakan suatu field yang mana datanya berisi id pada suatu record dengan primary key dan auto increment.

b. username

field username merupakan suatu field yang mana datanya username yang digunakan user untuk login sebagai member.

c. password

field password merupakan suatu field yang mana datanya password yang digunakan user untuk login sebagai member.

d. email

field email merupakan suatu field yang mana datanya berisi alamat email member.

e. nama

field nama merupakan suatu field yang mana datanya berisi nama lengkap member.

f. jk

field jk merupakan suatu field yang mana datanya berisi jenis kelamin member.

g. alamat

field alamat merupakan suatu field yang mana datanya berisi alamat rumah member.

h. telp

field telp merupakan suatu field yang mana datanya berisi nomer telpon member.

commit to user

field no_ktp merupakan suatu field yang mana datanya berisi nomer ktp member sebagai syarat registrasi.

j. ava

field ava merupakan suatu field yang mana datanya berisi nama file gambar avatar member.

k. date_reg

field date_reg merupakan suatu field yang mana datanya berisi tanggal daftar user sebagai member.

l. status

field status merupakan suatu field yang mana datanya berisi 0, 1 dan 2, yang mana jika status member = 1, maka member tersebut aktif. Sedangkan jika status member = 2, maka member tersebut di blok. Dan jika status member=0 maka member tersebut belum di konfirmasi oleh admin.

m. ktp

field ktp merupakan suatu field yang mana datanya berisi nama file gambar ktp yang di upload member sebagai syarat registrasi.

Tabel 3.8 member

Field Type Size Keterangan

id int 11

Primary

Key not_null

Auto increment

username varchar 111 not_null

password varchar 32 not_null

email varchar 111 null

nama varchar 111 null

jk varchar 1 null

alamat text null

telp varchar 20 null

no_ktp varchar 111 null

ava text null

date_reg date null

status int 11 null

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

29

9. Tabel news

Fungsi: untuk menyimpan berita-berita yang di tampilkan pada halaman

News, sehingga administrator dapat mengedit, menambahkan dan

menghapus berita yang di tampilkan di halaman News.

Dalam news terdapat beberapa field yang menjadikanya sebuah tabel,

field tersebut antara lain:

a. id

field id merupakan suatu field yang mana datanya berisi id pada suatu record dengan primary key dan auto increment.

b. judul

field title merupakan suatu field yang mana datanya berisi judul dari berita pada record tersebut.

c. thum

field thum merupakan suatu field yang mana datanya berisi nama file gambar yang di gunakan sebagai thumbnail di list berita.

d. isi

field ini merupakan suatu field yang mana datanya berisi isi berita yang tampilkan di halaman News.

e. date

field date merupakan suatu field yang mana datanya berisi tanggal berita di buat.

f. status

field news_status merupakan suatu field yang mana datanya berisi nilai 1 dan 2 . yang mana jika status = 1, maka news di post. Sedangkan jika status = 2, maka news baru sebagai draf saja belum di publikasikan.

Tabel 3.9 news

Field Type Size Keterangan

id int 11

Primary

Key not_null

Auto increment

judul varchar 111 not_null

thum varchar 111 not_null

isi text not_null

date date not_null

status int 11 not_null

10.Tabel email

Fungsi: untuk menyimpan email yang digunakan untuk alamat pengiriman contact us.

Dalam tabel email terdapat beberapa field yang menjadikanya sebuah tabel, field tersebut antara lain:

a. id

field id merupakan suatu field yang mana datanya berisi id pada suatu record dengan primary key dan auto increment.

b. email

field email merupakan suatu field yang mana datanya berisi alamat email yang digunakan untuk mengirim pesan dari member yang berada di contact us.

Tabel 3.10 email

Field Type Size Keterangan

id int 11

Primary

Key not_null

Auto increment

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

31

3.2.6 Struktur Navigasi

a. Halaman User

Halaman Utama

Menu Utama

Home

Register

(Non-member)

Profile

(member)

Login

(Non-member)

Menu Information

Home

Tentang Kami

Kebijakan Privasi Peraturan

dan Tata Tertib Hubungi

Kami Logout

(member)

Lelang Barang

History Lelang

History Penawaran

Edit Informasi

User

b. Halaman Administrator

Halaman Administrator

Site

Setting

Member

Category

Auction

News

Content

Add New News News Management

Auction History Auction

Add New Category Category Parent

Management

Add New Member Member

Management Admin Setting

Log Out Control Panel

Term and Agreement

Editor

Privacy Policy Editor

Contact Infortamtion

Editor

Banner Editor Email Editor

Contact Us About Us

Editor

Category Management

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

33 BAB IV

IMPLEMENTASI DAN ANALISA

4.1 Kebutuhan Sistem

Dalam pembangunan portal lelang online berbasis website ini terdapat beberapa perangkat lunak dan perangkat keras yang digunakan untuk mendukung proses pembuatan aplikasi, yaitu:

1. Perangkat Keras (Hardware)

Perangkat keras yang digunakan dalam pembangunan portal lelang online ini adalah sebagai berikut:

1 Buah notebook spesifikasi:

 Prosessor Core 2 duo 2.0 GHz

 RAM 2 GB

 Hardisk 250 GB

2. Perangkat Lunak (Sofware)

Perangkat lunak yang digunakan dalam pembangunan portal lelang online ini adalah sebagai berikut:

XAMPP 1.7.3 (Apache dan MySQL) Adobe Dreamweaver CS5

Adobe Photoshop CS4 Corel Draw X4

4.2Implementasi Sistem

4.2.1 Halaman Front End

Halaman front end adalah halaman yang dapat dilihat public (pengunjung). Halaman terbut antara lain:

1. Halaman Index / Home

Halaman ini adalah halaman yang pertama kali terbuka ketika mengetikkan alamat websitenya. Di halaman ini terdapat menu-menu utama yaitu Home, Register, dan Login. Halaman index ini adalah salah satu halaman umum, maksud dari halaman umum adalah halaman yang dapat diakses oleh pengunjung biasa atau bias disebut pengunjung bukan member dan juga dapat diakses oleh pengunjung member. Namun ketika pengunjung member mengakses halaman index ini menu utamanya berubah menjadi Home, label yang bertuliskan nama member yang memiliki link ke profile member tersebut dan logout. Dihalaman index ini juga terdapat beberapa pilihan kategori yang memiliki subkategori yang mana subkategori tersebut berfungsi mengelompokkan barang-barang yang dilelang kedalam beberapa pengelompokan sesuai yang telah ditentukan. Di halaman index ini tedapat sebuah banner gambar yang bisa berubah-ubah secara otomatis. Banner tersebut bisa berisi iklan berbentuk gambar yang diatur oleh administrator. Di sebelah kanan banner terdapat tiga list barang yang dilelang yang pemunculannya disetting secara random. Di bawah banner dan list barang lelang tadi juga ada empat list barang lelang yang ditampilkan. Keempat barang lelang yang tampil di list tersebut adalah barang-barang yang dalam waktu dekat akan habis waktu lelangnya. Dibawah list barang lelang juga ada list berita yang dibuat oleh administrator. Terdapat tiga judul berita yang ditampilkan, yang mana penampilannya diurutkan berdasarkan berita terbaru. Berikut adalah tampilan dari halaman index.

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

35

commit to user

2. Form Registrasi

Form registrasi ini digunakan untuk melakukan pendaftaran seorang pengunjung bukan member untuk menjadi pengunjung member. Form register ini dibuat dengan menggunakan pop-up JQuery, jadi di halaman manapun menu register diklik makan di halaman itu juga form tersebut akan muncul tanpa harus pindah ke halaman khusus. Di dalam form tersebut ada beberapa data yang harus diisi. Data tersebut yaitu username, password, email, nama, jenis kelamin, alamat, nomer telpon, nomer KTP, dan foto KTP yang diupload. Data nomer KTP dan Foto KTP digunakan untuk pengecekan kebenaran data seorang user yang mana nantinya akan menjadi pertimbangan administrator untuk memberikan hak sebagai member. Ini adalah salah satu upaya meminimalisir penipuan antara member dengan member lainnya. Berikut adalah tampilan form registrasinya.

Gambar 4.2 Form Registrasi

3. Form Login

Form login ini digunakan untuk melakukan login user seorang pengunjung bukan member untuk mengubah menjadi pengunjung member(jika sudah melakukan registrasi dan data disetujui administrator). Form login ini juga dibuat dengan menggunakan JQuery, jadi di halaman manapun menu register diklik

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

37

makan di halaman itu juga form tersebut akan muncul tanpa harus pindah ke halaman khusus. Bedanya dengan form register, form login ini dibuat menu

dropdown berbeda dengan form register yang menggunakan pop-up. Di dalam form tersebut user harus mengisi username dan password yang sesuai dengan data yang pernah didaftarkan. Berikut adalah tampilan form login.

Gambar 4.3 Form Login

4. Halaman List Barang Lelang

Halaman list barang lelang ini adalah halaman yang berisi list barang. Halaman ini dapat ditampilkan ketika seorang pengunjung mengklik salah satu subkategori yang telah ditentukan, dan juga bisa mengklik link lainnya yang berada pada halaman index dibagian pojok kanan atas lelang detik terakhir. Jika pengunjung menklik salah satu subkategori yang ada di sidebar, maka di list barang lelang yang ditampilkan, barang-barangnya sesuai kategori yang diklik sebelumnya. Berikut adalah tampilan halaman dari list barang lelang.

Gambar 4.4 Halaman List Barang Lelang

5. Halaman List Berita

Halaman list Berita ini akan tampil jika mengklik link berita lainnya yang berada di halaman index. Pada halaman list berita ini terdapat beberapa berita yang ditampilkan, yang mana penampilannya diurutkan berdasarkan berita yang terakhir kali diposting oleh administrator. Berikut adalah tampilan dari halaman list berita.

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

39

Gambar 4.5 Halaman List Berita

6. Halaman Detail Barang Lelang

Halaman detail barang lelang ini akan muncul ketika mengklik salah satu barang di list barang. Di list barang ini terdapat beberapa data yang ditampilkan, data tersebut antara lain adalah nama barang, gambar barang, nama pelelang, kategori barang, harga awal barang, sisa waktu lelang, deskripsi barang dan record penawar yang pernah nelakukan penawaran terhadap barang tersebut. Dihalaman

detail barang ini ada sebuah texfield yang digunakan untuk menginputkan harga penawaran terhadap barang. Penawaran akan diproses hanya pada seorang member yang melakukan penginputan, jika user bukan member melakukan penginputan, maka tidak akan dilakukan proses dan ada pemberitahuan. Harga yang diinput pun harus lebih tinggi dari harga penawaran terakhir, jika harga lebih rendah, maka aka nada pemberitahuan dan penginputan tidak akan dip roses. Berikut adalah tampilan dari halaman detail barang.

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

41

7. Halaman Profile Member

Halaman profile member akan tampil ketika member berhasil melakukan member maka akan langsung diarahkan ke halaman ini. Di halaman profile member ini ada beberapa menu tambahan yang mana menu tersebut hanya dapat diakses oleh member website. Menu-menu tersebut adalah edit informasi member, lelang barang, melihat history pelelangan yang pernah dilakukan member tersebut, dan melihat histori penawaran barang yang pernah dilakukan oleh member tersebut.

Di halaman ini juga terdapat beberapa data yang ditampilkan data tersebut adalah nama member, avatar member, jenis kelamin, nomer telepon, email , alamat, dan tanggal register. Halaman profile berfungsi agar setiap member dapat mengetahui informasi member lain. Jadi setiap member bisa mengetahui informasi pelelang barang dengan mengklik nama pelelang pada detail barang yang dilinkkan ke profile member tersebtu. Di halaman profile ini juga terdapat list barang-barang yang pernah dilelang . beritkut tampilan halaman profile.

Gambar 4.7 Halaman Profile Member

8. Form Edit Informasi Member

Form edit informasi member ini digunakan untuk melakukan pengeditan informasi seorang pengunjung member. Form edit ini dibuat dengan menggunakan pop-up JQuery, jadi form ini akan muncul tanpa haru membuka halaman baru. Pada form edit ini terdapat beberapa informasi member yang dapat diubah, antara lain adalah nama, jenis kelamin, nomer telepon, alamat, gambar avata, username, email, dan ubah password. Berikut tampilan dari form edit informasi member.

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

43

Gambar 4.8 Form Edit Informasi Member

9. Halaman Input Barang Lelang

Halaman input barang lelang adalah halaman yang digunakan untuk menginputkan data-data barang yang akan dilelang kedalam database. Data-data tersebut adalah nama barang, kategori barang, deskripsi barang, harga awal, dan gambar barang. Di bawah form input barang juga ada list barang-barang yang sebelumnya pernah dilelang. Berikut tampilan halaman input barang lelang.

Gambar 4.9 Halaman Input Barang Lelang

4.2.2 Halaman Back End

Halaman back end adalah halaman yang hanya dapat diakses oleh administrator suatu website.

1. Halaman Login Administrator

Halaman login administrator ini adalah halaman yang digunakan untuk menseleksi user, di halaman ini diminta username dan password administrator. Untuk dapat menuju kehalaman ini tinggal mengetikkan tambahan administrator di belakang alamat. Missal http://localhost/wanipiro, maka untuk masuk

kehalaman administrator http://localhost/wanipiro/administarator. Berikut

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

45

Gambar 4.10 Halaman Login Administrator

2. Halaman Index Administrator

Halaman index administrator berisi berbagai menu-menu yang digunakan untuk memanagement konten yang ditampilkan di halaman front end, dan juga mengatur lalulintas member website. Berikut tampilan dari halaman index administrator.

3. Halaman List Data

Berikut adalah tampilan dari halaman administrator ketika menampilkan list data dari data base. Untuk penampilan pada tiap menu sama dengan lainnya. Yang mana ketika judul atau nama listnya diklik maka akan melinkkan data ke detail data yang dipilih. Pada halaman list data ini terdapat beberapa menu yang digunakan untuk mengelola data, menu tersebut adalah New yang berfungsi untuk menambah data baru, home yang berfungsi mengembalikan tampilan ke tampilan index, dan delete yang berfungsi untuk menghapus record-record data dengan menceklis terlebih dahulu data yang akan dihapus.

Gambar 4.12 Halaman Tampil Data Administrator

4. Halaman Tambah Data Administator

Hamalan tambah data adalah halaman yang digunakan untuk menabahkan data kedalam data base, misal menambah member, menambah berita atau menambah kategori. Berikut tampilan dari halaman tembah data.

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

47

Gambar 4.13 Halaman Tambah Data Administrator

5. Halaman Detail Data Administrator

Hamalan detail data adalah halaman yang muncul ketika salah satu judul atau nama record diklik. Di halaman detail data ini terdapat fasilitas mengedit data. Berikut tampilan dari detail data administrator.

commit to user

48 BAB V PENUTUP

4.1Kesimpulan

Portal Lelang Online berbasis web telah berhasil di selesaikan. Sesuai judulnya, website ini digunakan untuk melakukan pelelangan barang secara online. Untuk dapat mekakukan pelelangan dan penawaran barang, pengunjung harus mendaftar member dan di konfirmasi oleh administrator website terlebih dahulu. Seorang member dapat melelang barang kemudian dapat juga menawar barang yang di lelang oleh member lain. Ketika registrasi pengunjung diharapkan melampirkan foto KTP untuk penyesuaian data yang di masukkan ketika melakukan registrasi sehingga dapat menjadi bahan pertimbangan seorang administrator ketika mengkonfirmasi member tersebut. Website ini terdapat fasilitas mengatur konten-konten yang di tampilkan di dalam website seperti kontak infromasi, tentang kami, peraturan dan tata tertib, dan juga banner. Website ini juga memiliki fasilitas berita, yang mana berita yang di posting di atur oleh administrator.

4.2Saran

Website portal lelang online ini masih terdapat beberapa kekurangan seperti masalah sekuritas web dan validasinya, untuk kedepannya dapat ditingkatkan sekuritas web agar lebih aman dan terjamin.

Gambar 4.8 Form Edit Informasi Member

9. Halaman Input Barang Lelang

Halaman input barang lelang adalah halaman yang digunakan untuk menginputkan data-data barang yang akan dilelang kedalam database. Data-data tersebut adalah nama barang, kategori barang, deskripsi barang, harga awal, dan gambar barang. Di bawah form input barang juga ada list barang-barang yang sebelumnya pernah dilelang. Berikut tampilan halaman input barang lelang.

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

44

Gambar 4.9 Halaman Input Barang Lelang

4.2.2 Halaman Back End

Halaman back end adalah halaman yang hanya dapat diakses oleh administrator suatu website.

1. Halaman Login Administrator

Halaman login administrator ini adalah halaman yang digunakan untuk menseleksi user, di halaman ini diminta username dan password administrator. Untuk dapat menuju kehalaman ini tinggal mengetikkan tambahan administrator di belakang alamat. Missal http://localhost/wanipiro, maka untuk masuk

kehalaman administrator http://localhost/wanipiro/administarator. Berikut

Gambar 4.10 Halaman Login Administrator

2. Halaman Index Administrator

Halaman index administrator berisi berbagai menu-menu yang digunakan untuk memanagement konten yang ditampilkan di halaman front end, dan juga mengatur lalulintas member website. Berikut tampilan dari halaman index administrator.

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

46

3. Halaman List Data

Berikut adalah tampilan dari halaman administrator ketika menampilkan list data dari data base. Untuk penampilan pada tiap menu sama dengan lainnya. Yang mana ketika judul atau nama listnya diklik maka akan melinkkan data ke detail data yang dipilih. Pada halaman list data ini terdapat beberapa menu yang digunakan untuk mengelola data, menu tersebut adalah New yang berfungsi untuk menambah data baru, home yang berfungsi mengembalikan tampilan ke tampilan index, dan delete yang berfungsi untuk menghapus record-record data dengan menceklis terlebih dahulu data yang akan dihapus.

Gambar 4.12 Halaman Tampil Data Administrator

4. Halaman Tambah Data Administator

Hamalan tambah data adalah halaman yang digunakan untuk menabahkan data kedalam data base, misal menambah member, menambah berita atau menambah kategori. Berikut tampilan dari halaman tembah data.

Gambar 4.13 Halaman Tambah Data Administrator

5. Halaman Detail Data Administrator

Hamalan detail data adalah halaman yang muncul ketika salah satu judul atau nama record diklik. Di halaman detail data ini terdapat fasilitas mengedit data. Berikut tampilan dari detail data administrator.

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

48 BAB V PENUTUP

4.1Kesimpulan

Portal Lelang Online berbasis web telah berhasil di selesaikan. Sesuai judulnya, website ini digunakan untuk melakukan pelelangan barang secara online. Untuk dapat mekakukan pelelangan dan penawaran barang, pengunjung harus mendaftar member dan di konfirmasi oleh administrator website terlebih dahulu. Seorang member dapat melelang barang kemudian dapat juga menawar barang yang di lelang oleh member lain. Ketika registrasi pengunjung diharapkan melampirkan foto KTP untuk penyesuaian data yang di masukkan ketika melakukan registrasi sehingga dapat menjadi bahan pertimbangan seorang administrator ketika mengkonfirmasi member tersebut. Website ini terdapat fasilitas mengatur konten-konten yang di tampilkan di dalam website seperti kontak infromasi, tentang kami, peraturan dan tata tertib, dan juga banner. Website ini juga memiliki fasilitas berita, yang mana berita yang di posting di atur oleh administrator.

4.2Saran

Website portal lelang online ini masih terdapat beberapa kekurangan seperti masalah sekuritas web dan validasinya, untuk kedepannya dapat ditingkatkan sekuritas web agar lebih aman dan terjamin.